diff --git a/README.md b/README.md index 7885e3a4..006edc85 100644 --- a/README.md +++ b/README.md @@ -4,12 +4,12 @@

Clean, lightweight, responsive, modern and fully customizable.
- Documentation | - Changelogs + Documentation | + Changelog

## Introduction -Punica CSS is a clean, lightweight, responsive, modern and fully customizable (even class names) pure CSS Framework based on SASS/SCSS. +Punica CSS is a clean, lightweight, responsive, modern and fully customizable (even class names) pure CSS Framework based on SASS/SCSS with multi-theme support.

@@ -19,7 +19,11 @@ Punica CSS is a clean, lightweight, responsive, modern and fully customizable (e ## Install From CDN If you want to quickly add Punica to your project, you can use the JsDelivr CDN; ```html - + +``` +Dark theme; +```html + ``` ## HTML Markup diff --git a/dist/punica-dark.min.css b/dist/punica-dark.min.css new file mode 100644 index 00000000..5d6a7134 --- /dev/null +++ b/dist/punica-dark.min.css @@ -0,0 +1 @@ +@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;900&display=swap);*,:after,:before{-webkit-box-sizing:inherit;box-sizing:inherit}*{margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;text-shadow:1px 1px 1px rgba(0,0,0,.004)!important}html{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:13px;font-weight:400;line-height:1.7;color:#fff;background-color:#26272b}body,html{min-height:100%;height:100%;padding:0;margin:0;border:none}::-moz-selection{background-color:#10a6fa;color:#fff}::selection{background-color:#10a6fa;color:#fff}::-webkit-input-placeholder{color:#fff;opacity:.5}::-moz-placeholder{color:#fff;opacity:.5}::-ms-input-placeholder{color:#fff;opacity:.5}::placeholder{color:#fff;opacity:.5}a{color:#fff;outline:none;text-decoration:none}a.active,a:active,a:focus,a:hover{color:#058fdd;text-decoration:underline}a:visited{color:#fff}hr{margin:15px 0;background-color:#5d5f69;border:none;height:1px}ol,ul{padding:0}ol,ol ol,ol ul,ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ol{list-style:decimal inside}dl dt{font-weight:700}canvas,embed,img,object,video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}img{border-style:none}iframe{outline:0}:not(pre)>code,:not(pre)>kbd,:not(pre)>samp{color:#d84955;white-space:nowrap;padding:2px 6px;font-size:.935em}.container{width:100%;margin:0 auto;padding:0 40px}.row{display:grid;grid-gap:6px;grid-template-columns:repeat(16,1fr)}.row>[class^=col]{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:.3rem;min-height:.125rem}.row.equal>[class^=col]{height:auto}@media only screen and (max-width:768px){.container{padding:0 13.33333px}}@media only screen and (min-width:0){.col-1,.col-xs-1{grid-column:span 1}.col-xs-1.offset-xs-2{grid-column:2/span 1}.col-xs-1.offset-xs-3{grid-column:3/span 1}.col-xs-1.offset-xs-4{grid-column:4/span 1}.col-xs-1.offset-xs-5{grid-column:5/span 1}.col-xs-1.offset-xs-6{grid-column:6/span 1}.col-xs-1.offset-xs-7{grid-column:7/span 1}.col-xs-1.offset-xs-8{grid-column:8/span 1}.col-xs-1.offset-xs-9{grid-column:9/span 1}.col-xs-1.offset-xs-10{grid-column:10/span 1}.col-xs-1.offset-xs-11{grid-column:11/span 1}.col-xs-1.offset-xs-12{grid-column:12/span 1}.col-xs-1.offset-xs-13{grid-column:13/span 1}.col-xs-1.offset-xs-14{grid-column:14/span 1}.col-xs-1.offset-xs-15{grid-column:15/span 1}.col-xs-1.offset-xs-16{grid-column:16/span 1}.col-2,.col-xs-2{grid-column:span 2}.col-xs-2.offset-xs-2{grid-column:2/span 2}.col-xs-2.offset-xs-3{grid-column:3/span 2}.col-xs-2.offset-xs-4{grid-column:4/span 2}.col-xs-2.offset-xs-5{grid-column:5/span 2}.col-xs-2.offset-xs-6{grid-column:6/span 2}.col-xs-2.offset-xs-7{grid-column:7/span 2}.col-xs-2.offset-xs-8{grid-column:8/span 2}.col-xs-2.offset-xs-9{grid-column:9/span 2}.col-xs-2.offset-xs-10{grid-column:10/span 2}.col-xs-2.offset-xs-11{grid-column:11/span 2}.col-xs-2.offset-xs-12{grid-column:12/span 2}.col-xs-2.offset-xs-13{grid-column:13/span 2}.col-xs-2.offset-xs-14{grid-column:14/span 2}.col-xs-2.offset-xs-15{grid-column:15/span 2}.col-xs-2.offset-xs-16{grid-column:16/span 2}.col-3,.col-xs-3{grid-column:span 3}.col-xs-3.offset-xs-2{grid-column:2/span 3}.col-xs-3.offset-xs-3{grid-column:3/span 3}.col-xs-3.offset-xs-4{grid-column:4/span 3}.col-xs-3.offset-xs-5{grid-column:5/span 3}.col-xs-3.offset-xs-6{grid-column:6/span 3}.col-xs-3.offset-xs-7{grid-column:7/span 3}.col-xs-3.offset-xs-8{grid-column:8/span 3}.col-xs-3.offset-xs-9{grid-column:9/span 3}.col-xs-3.offset-xs-10{grid-column:10/span 3}.col-xs-3.offset-xs-11{grid-column:11/span 3}.col-xs-3.offset-xs-12{grid-column:12/span 3}.col-xs-3.offset-xs-13{grid-column:13/span 3}.col-xs-3.offset-xs-14{grid-column:14/span 3}.col-xs-3.offset-xs-15{grid-column:15/span 3}.col-xs-3.offset-xs-16{grid-column:16/span 3}.col-4,.col-xs-4{grid-column:span 4}.col-xs-4.offset-xs-2{grid-column:2/span 4}.col-xs-4.offset-xs-3{grid-column:3/span 4}.col-xs-4.offset-xs-4{grid-column:4/span 4}.col-xs-4.offset-xs-5{grid-column:5/span 4}.col-xs-4.offset-xs-6{grid-column:6/span 4}.col-xs-4.offset-xs-7{grid-column:7/span 4}.col-xs-4.offset-xs-8{grid-column:8/span 4}.col-xs-4.offset-xs-9{grid-column:9/span 4}.col-xs-4.offset-xs-10{grid-column:10/span 4}.col-xs-4.offset-xs-11{grid-column:11/span 4}.col-xs-4.offset-xs-12{grid-column:12/span 4}.col-xs-4.offset-xs-13{grid-column:13/span 4}.col-xs-4.offset-xs-14{grid-column:14/span 4}.col-xs-4.offset-xs-15{grid-column:15/span 4}.col-xs-4.offset-xs-16{grid-column:16/span 4}.col-5,.col-xs-5{grid-column:span 5}.col-xs-5.offset-xs-2{grid-column:2/span 5}.col-xs-5.offset-xs-3{grid-column:3/span 5}.col-xs-5.offset-xs-4{grid-column:4/span 5}.col-xs-5.offset-xs-5{grid-column:5/span 5}.col-xs-5.offset-xs-6{grid-column:6/span 5}.col-xs-5.offset-xs-7{grid-column:7/span 5}.col-xs-5.offset-xs-8{grid-column:8/span 5}.col-xs-5.offset-xs-9{grid-column:9/span 5}.col-xs-5.offset-xs-10{grid-column:10/span 5}.col-xs-5.offset-xs-11{grid-column:11/span 5}.col-xs-5.offset-xs-12{grid-column:12/span 5}.col-xs-5.offset-xs-13{grid-column:13/span 5}.col-xs-5.offset-xs-14{grid-column:14/span 5}.col-xs-5.offset-xs-15{grid-column:15/span 5}.col-xs-5.offset-xs-16{grid-column:16/span 5}.col-6,.col-xs-6{grid-column:span 6}.col-xs-6.offset-xs-2{grid-column:2/span 6}.col-xs-6.offset-xs-3{grid-column:3/span 6}.col-xs-6.offset-xs-4{grid-column:4/span 6}.col-xs-6.offset-xs-5{grid-column:5/span 6}.col-xs-6.offset-xs-6{grid-column:6/span 6}.col-xs-6.offset-xs-7{grid-column:7/span 6}.col-xs-6.offset-xs-8{grid-column:8/span 6}.col-xs-6.offset-xs-9{grid-column:9/span 6}.col-xs-6.offset-xs-10{grid-column:10/span 6}.col-xs-6.offset-xs-11{grid-column:11/span 6}.col-xs-6.offset-xs-12{grid-column:12/span 6}.col-xs-6.offset-xs-13{grid-column:13/span 6}.col-xs-6.offset-xs-14{grid-column:14/span 6}.col-xs-6.offset-xs-15{grid-column:15/span 6}.col-xs-6.offset-xs-16{grid-column:16/span 6}.col-7,.col-xs-7{grid-column:span 7}.col-xs-7.offset-xs-2{grid-column:2/span 7}.col-xs-7.offset-xs-3{grid-column:3/span 7}.col-xs-7.offset-xs-4{grid-column:4/span 7}.col-xs-7.offset-xs-5{grid-column:5/span 7}.col-xs-7.offset-xs-6{grid-column:6/span 7}.col-xs-7.offset-xs-7{grid-column:7/span 7}.col-xs-7.offset-xs-8{grid-column:8/span 7}.col-xs-7.offset-xs-9{grid-column:9/span 7}.col-xs-7.offset-xs-10{grid-column:10/span 7}.col-xs-7.offset-xs-11{grid-column:11/span 7}.col-xs-7.offset-xs-12{grid-column:12/span 7}.col-xs-7.offset-xs-13{grid-column:13/span 7}.col-xs-7.offset-xs-14{grid-column:14/span 7}.col-xs-7.offset-xs-15{grid-column:15/span 7}.col-xs-7.offset-xs-16{grid-column:16/span 7}.col-8,.col-xs-8{grid-column:span 8}.col-xs-8.offset-xs-2{grid-column:2/span 8}.col-xs-8.offset-xs-3{grid-column:3/span 8}.col-xs-8.offset-xs-4{grid-column:4/span 8}.col-xs-8.offset-xs-5{grid-column:5/span 8}.col-xs-8.offset-xs-6{grid-column:6/span 8}.col-xs-8.offset-xs-7{grid-column:7/span 8}.col-xs-8.offset-xs-8{grid-column:8/span 8}.col-xs-8.offset-xs-9{grid-column:9/span 8}.col-xs-8.offset-xs-10{grid-column:10/span 8}.col-xs-8.offset-xs-11{grid-column:11/span 8}.col-xs-8.offset-xs-12{grid-column:12/span 8}.col-xs-8.offset-xs-13{grid-column:13/span 8}.col-xs-8.offset-xs-14{grid-column:14/span 8}.col-xs-8.offset-xs-15{grid-column:15/span 8}.col-xs-8.offset-xs-16{grid-column:16/span 8}.col-9,.col-xs-9{grid-column:span 9}.col-xs-9.offset-xs-2{grid-column:2/span 9}.col-xs-9.offset-xs-3{grid-column:3/span 9}.col-xs-9.offset-xs-4{grid-column:4/span 9}.col-xs-9.offset-xs-5{grid-column:5/span 9}.col-xs-9.offset-xs-6{grid-column:6/span 9}.col-xs-9.offset-xs-7{grid-column:7/span 9}.col-xs-9.offset-xs-8{grid-column:8/span 9}.col-xs-9.offset-xs-9{grid-column:9/span 9}.col-xs-9.offset-xs-10{grid-column:10/span 9}.col-xs-9.offset-xs-11{grid-column:11/span 9}.col-xs-9.offset-xs-12{grid-column:12/span 9}.col-xs-9.offset-xs-13{grid-column:13/span 9}.col-xs-9.offset-xs-14{grid-column:14/span 9}.col-xs-9.offset-xs-15{grid-column:15/span 9}.col-xs-9.offset-xs-16{grid-column:16/span 9}.col-10,.col-xs-10{grid-column:span 10}.col-xs-10.offset-xs-2{grid-column:2/span 10}.col-xs-10.offset-xs-3{grid-column:3/span 10}.col-xs-10.offset-xs-4{grid-column:4/span 10}.col-xs-10.offset-xs-5{grid-column:5/span 10}.col-xs-10.offset-xs-6{grid-column:6/span 10}.col-xs-10.offset-xs-7{grid-column:7/span 10}.col-xs-10.offset-xs-8{grid-column:8/span 10}.col-xs-10.offset-xs-9{grid-column:9/span 10}.col-xs-10.offset-xs-10{grid-column:10/span 10}.col-xs-10.offset-xs-11{grid-column:11/span 10}.col-xs-10.offset-xs-12{grid-column:12/span 10}.col-xs-10.offset-xs-13{grid-column:13/span 10}.col-xs-10.offset-xs-14{grid-column:14/span 10}.col-xs-10.offset-xs-15{grid-column:15/span 10}.col-xs-10.offset-xs-16{grid-column:16/span 10}.col-11,.col-xs-11{grid-column:span 11}.col-xs-11.offset-xs-2{grid-column:2/span 11}.col-xs-11.offset-xs-3{grid-column:3/span 11}.col-xs-11.offset-xs-4{grid-column:4/span 11}.col-xs-11.offset-xs-5{grid-column:5/span 11}.col-xs-11.offset-xs-6{grid-column:6/span 11}.col-xs-11.offset-xs-7{grid-column:7/span 11}.col-xs-11.offset-xs-8{grid-column:8/span 11}.col-xs-11.offset-xs-9{grid-column:9/span 11}.col-xs-11.offset-xs-10{grid-column:10/span 11}.col-xs-11.offset-xs-11{grid-column:11/span 11}.col-xs-11.offset-xs-12{grid-column:12/span 11}.col-xs-11.offset-xs-13{grid-column:13/span 11}.col-xs-11.offset-xs-14{grid-column:14/span 11}.col-xs-11.offset-xs-15{grid-column:15/span 11}.col-xs-11.offset-xs-16{grid-column:16/span 11}.col-12,.col-xs-12{grid-column:span 12}.col-xs-12.offset-xs-2{grid-column:2/span 12}.col-xs-12.offset-xs-3{grid-column:3/span 12}.col-xs-12.offset-xs-4{grid-column:4/span 12}.col-xs-12.offset-xs-5{grid-column:5/span 12}.col-xs-12.offset-xs-6{grid-column:6/span 12}.col-xs-12.offset-xs-7{grid-column:7/span 12}.col-xs-12.offset-xs-8{grid-column:8/span 12}.col-xs-12.offset-xs-9{grid-column:9/span 12}.col-xs-12.offset-xs-10{grid-column:10/span 12}.col-xs-12.offset-xs-11{grid-column:11/span 12}.col-xs-12.offset-xs-12{grid-column:12/span 12}.col-xs-12.offset-xs-13{grid-column:13/span 12}.col-xs-12.offset-xs-14{grid-column:14/span 12}.col-xs-12.offset-xs-15{grid-column:15/span 12}.col-xs-12.offset-xs-16{grid-column:16/span 12}.col-13,.col-xs-13{grid-column:span 13}.col-xs-13.offset-xs-2{grid-column:2/span 13}.col-xs-13.offset-xs-3{grid-column:3/span 13}.col-xs-13.offset-xs-4{grid-column:4/span 13}.col-xs-13.offset-xs-5{grid-column:5/span 13}.col-xs-13.offset-xs-6{grid-column:6/span 13}.col-xs-13.offset-xs-7{grid-column:7/span 13}.col-xs-13.offset-xs-8{grid-column:8/span 13}.col-xs-13.offset-xs-9{grid-column:9/span 13}.col-xs-13.offset-xs-10{grid-column:10/span 13}.col-xs-13.offset-xs-11{grid-column:11/span 13}.col-xs-13.offset-xs-12{grid-column:12/span 13}.col-xs-13.offset-xs-13{grid-column:13/span 13}.col-xs-13.offset-xs-14{grid-column:14/span 13}.col-xs-13.offset-xs-15{grid-column:15/span 13}.col-xs-13.offset-xs-16{grid-column:16/span 13}.col-14,.col-xs-14{grid-column:span 14}.col-xs-14.offset-xs-2{grid-column:2/span 14}.col-xs-14.offset-xs-3{grid-column:3/span 14}.col-xs-14.offset-xs-4{grid-column:4/span 14}.col-xs-14.offset-xs-5{grid-column:5/span 14}.col-xs-14.offset-xs-6{grid-column:6/span 14}.col-xs-14.offset-xs-7{grid-column:7/span 14}.col-xs-14.offset-xs-8{grid-column:8/span 14}.col-xs-14.offset-xs-9{grid-column:9/span 14}.col-xs-14.offset-xs-10{grid-column:10/span 14}.col-xs-14.offset-xs-11{grid-column:11/span 14}.col-xs-14.offset-xs-12{grid-column:12/span 14}.col-xs-14.offset-xs-13{grid-column:13/span 14}.col-xs-14.offset-xs-14{grid-column:14/span 14}.col-xs-14.offset-xs-15{grid-column:15/span 14}.col-xs-14.offset-xs-16{grid-column:16/span 14}.col-15,.col-xs-15{grid-column:span 15}.col-xs-15.offset-xs-2{grid-column:2/span 15}.col-xs-15.offset-xs-3{grid-column:3/span 15}.col-xs-15.offset-xs-4{grid-column:4/span 15}.col-xs-15.offset-xs-5{grid-column:5/span 15}.col-xs-15.offset-xs-6{grid-column:6/span 15}.col-xs-15.offset-xs-7{grid-column:7/span 15}.col-xs-15.offset-xs-8{grid-column:8/span 15}.col-xs-15.offset-xs-9{grid-column:9/span 15}.col-xs-15.offset-xs-10{grid-column:10/span 15}.col-xs-15.offset-xs-11{grid-column:11/span 15}.col-xs-15.offset-xs-12{grid-column:12/span 15}.col-xs-15.offset-xs-13{grid-column:13/span 15}.col-xs-15.offset-xs-14{grid-column:14/span 15}.col-xs-15.offset-xs-15{grid-column:15/span 15}.col-xs-15.offset-xs-16{grid-column:16/span 15}.col-16,.col-xs-16{grid-column:span 16}.col-xs-16.offset-xs-2{grid-column:2/span 16}.col-xs-16.offset-xs-3{grid-column:3/span 16}.col-xs-16.offset-xs-4{grid-column:4/span 16}.col-xs-16.offset-xs-5{grid-column:5/span 16}.col-xs-16.offset-xs-6{grid-column:6/span 16}.col-xs-16.offset-xs-7{grid-column:7/span 16}.col-xs-16.offset-xs-8{grid-column:8/span 16}.col-xs-16.offset-xs-9{grid-column:9/span 16}.col-xs-16.offset-xs-10{grid-column:10/span 16}.col-xs-16.offset-xs-11{grid-column:11/span 16}.col-xs-16.offset-xs-12{grid-column:12/span 16}.col-xs-16.offset-xs-13{grid-column:13/span 16}.col-xs-16.offset-xs-14{grid-column:14/span 16}.col-xs-16.offset-xs-15{grid-column:15/span 16}.col-xs-16.offset-xs-16{grid-column:16/span 16}}@media only screen and (min-width:500px){.col-1,.col-sm-1{grid-column:span 1}.col-sm-1.offset-sm-2{grid-column:2/span 1}.col-sm-1.offset-sm-3{grid-column:3/span 1}.col-sm-1.offset-sm-4{grid-column:4/span 1}.col-sm-1.offset-sm-5{grid-column:5/span 1}.col-sm-1.offset-sm-6{grid-column:6/span 1}.col-sm-1.offset-sm-7{grid-column:7/span 1}.col-sm-1.offset-sm-8{grid-column:8/span 1}.col-sm-1.offset-sm-9{grid-column:9/span 1}.col-sm-1.offset-sm-10{grid-column:10/span 1}.col-sm-1.offset-sm-11{grid-column:11/span 1}.col-sm-1.offset-sm-12{grid-column:12/span 1}.col-sm-1.offset-sm-13{grid-column:13/span 1}.col-sm-1.offset-sm-14{grid-column:14/span 1}.col-sm-1.offset-sm-15{grid-column:15/span 1}.col-sm-1.offset-sm-16{grid-column:16/span 1}.col-2,.col-sm-2{grid-column:span 2}.col-sm-2.offset-sm-2{grid-column:2/span 2}.col-sm-2.offset-sm-3{grid-column:3/span 2}.col-sm-2.offset-sm-4{grid-column:4/span 2}.col-sm-2.offset-sm-5{grid-column:5/span 2}.col-sm-2.offset-sm-6{grid-column:6/span 2}.col-sm-2.offset-sm-7{grid-column:7/span 2}.col-sm-2.offset-sm-8{grid-column:8/span 2}.col-sm-2.offset-sm-9{grid-column:9/span 2}.col-sm-2.offset-sm-10{grid-column:10/span 2}.col-sm-2.offset-sm-11{grid-column:11/span 2}.col-sm-2.offset-sm-12{grid-column:12/span 2}.col-sm-2.offset-sm-13{grid-column:13/span 2}.col-sm-2.offset-sm-14{grid-column:14/span 2}.col-sm-2.offset-sm-15{grid-column:15/span 2}.col-sm-2.offset-sm-16{grid-column:16/span 2}.col-3,.col-sm-3{grid-column:span 3}.col-sm-3.offset-sm-2{grid-column:2/span 3}.col-sm-3.offset-sm-3{grid-column:3/span 3}.col-sm-3.offset-sm-4{grid-column:4/span 3}.col-sm-3.offset-sm-5{grid-column:5/span 3}.col-sm-3.offset-sm-6{grid-column:6/span 3}.col-sm-3.offset-sm-7{grid-column:7/span 3}.col-sm-3.offset-sm-8{grid-column:8/span 3}.col-sm-3.offset-sm-9{grid-column:9/span 3}.col-sm-3.offset-sm-10{grid-column:10/span 3}.col-sm-3.offset-sm-11{grid-column:11/span 3}.col-sm-3.offset-sm-12{grid-column:12/span 3}.col-sm-3.offset-sm-13{grid-column:13/span 3}.col-sm-3.offset-sm-14{grid-column:14/span 3}.col-sm-3.offset-sm-15{grid-column:15/span 3}.col-sm-3.offset-sm-16{grid-column:16/span 3}.col-4,.col-sm-4{grid-column:span 4}.col-sm-4.offset-sm-2{grid-column:2/span 4}.col-sm-4.offset-sm-3{grid-column:3/span 4}.col-sm-4.offset-sm-4{grid-column:4/span 4}.col-sm-4.offset-sm-5{grid-column:5/span 4}.col-sm-4.offset-sm-6{grid-column:6/span 4}.col-sm-4.offset-sm-7{grid-column:7/span 4}.col-sm-4.offset-sm-8{grid-column:8/span 4}.col-sm-4.offset-sm-9{grid-column:9/span 4}.col-sm-4.offset-sm-10{grid-column:10/span 4}.col-sm-4.offset-sm-11{grid-column:11/span 4}.col-sm-4.offset-sm-12{grid-column:12/span 4}.col-sm-4.offset-sm-13{grid-column:13/span 4}.col-sm-4.offset-sm-14{grid-column:14/span 4}.col-sm-4.offset-sm-15{grid-column:15/span 4}.col-sm-4.offset-sm-16{grid-column:16/span 4}.col-5,.col-sm-5{grid-column:span 5}.col-sm-5.offset-sm-2{grid-column:2/span 5}.col-sm-5.offset-sm-3{grid-column:3/span 5}.col-sm-5.offset-sm-4{grid-column:4/span 5}.col-sm-5.offset-sm-5{grid-column:5/span 5}.col-sm-5.offset-sm-6{grid-column:6/span 5}.col-sm-5.offset-sm-7{grid-column:7/span 5}.col-sm-5.offset-sm-8{grid-column:8/span 5}.col-sm-5.offset-sm-9{grid-column:9/span 5}.col-sm-5.offset-sm-10{grid-column:10/span 5}.col-sm-5.offset-sm-11{grid-column:11/span 5}.col-sm-5.offset-sm-12{grid-column:12/span 5}.col-sm-5.offset-sm-13{grid-column:13/span 5}.col-sm-5.offset-sm-14{grid-column:14/span 5}.col-sm-5.offset-sm-15{grid-column:15/span 5}.col-sm-5.offset-sm-16{grid-column:16/span 5}.col-6,.col-sm-6{grid-column:span 6}.col-sm-6.offset-sm-2{grid-column:2/span 6}.col-sm-6.offset-sm-3{grid-column:3/span 6}.col-sm-6.offset-sm-4{grid-column:4/span 6}.col-sm-6.offset-sm-5{grid-column:5/span 6}.col-sm-6.offset-sm-6{grid-column:6/span 6}.col-sm-6.offset-sm-7{grid-column:7/span 6}.col-sm-6.offset-sm-8{grid-column:8/span 6}.col-sm-6.offset-sm-9{grid-column:9/span 6}.col-sm-6.offset-sm-10{grid-column:10/span 6}.col-sm-6.offset-sm-11{grid-column:11/span 6}.col-sm-6.offset-sm-12{grid-column:12/span 6}.col-sm-6.offset-sm-13{grid-column:13/span 6}.col-sm-6.offset-sm-14{grid-column:14/span 6}.col-sm-6.offset-sm-15{grid-column:15/span 6}.col-sm-6.offset-sm-16{grid-column:16/span 6}.col-7,.col-sm-7{grid-column:span 7}.col-sm-7.offset-sm-2{grid-column:2/span 7}.col-sm-7.offset-sm-3{grid-column:3/span 7}.col-sm-7.offset-sm-4{grid-column:4/span 7}.col-sm-7.offset-sm-5{grid-column:5/span 7}.col-sm-7.offset-sm-6{grid-column:6/span 7}.col-sm-7.offset-sm-7{grid-column:7/span 7}.col-sm-7.offset-sm-8{grid-column:8/span 7}.col-sm-7.offset-sm-9{grid-column:9/span 7}.col-sm-7.offset-sm-10{grid-column:10/span 7}.col-sm-7.offset-sm-11{grid-column:11/span 7}.col-sm-7.offset-sm-12{grid-column:12/span 7}.col-sm-7.offset-sm-13{grid-column:13/span 7}.col-sm-7.offset-sm-14{grid-column:14/span 7}.col-sm-7.offset-sm-15{grid-column:15/span 7}.col-sm-7.offset-sm-16{grid-column:16/span 7}.col-8,.col-sm-8{grid-column:span 8}.col-sm-8.offset-sm-2{grid-column:2/span 8}.col-sm-8.offset-sm-3{grid-column:3/span 8}.col-sm-8.offset-sm-4{grid-column:4/span 8}.col-sm-8.offset-sm-5{grid-column:5/span 8}.col-sm-8.offset-sm-6{grid-column:6/span 8}.col-sm-8.offset-sm-7{grid-column:7/span 8}.col-sm-8.offset-sm-8{grid-column:8/span 8}.col-sm-8.offset-sm-9{grid-column:9/span 8}.col-sm-8.offset-sm-10{grid-column:10/span 8}.col-sm-8.offset-sm-11{grid-column:11/span 8}.col-sm-8.offset-sm-12{grid-column:12/span 8}.col-sm-8.offset-sm-13{grid-column:13/span 8}.col-sm-8.offset-sm-14{grid-column:14/span 8}.col-sm-8.offset-sm-15{grid-column:15/span 8}.col-sm-8.offset-sm-16{grid-column:16/span 8}.col-9,.col-sm-9{grid-column:span 9}.col-sm-9.offset-sm-2{grid-column:2/span 9}.col-sm-9.offset-sm-3{grid-column:3/span 9}.col-sm-9.offset-sm-4{grid-column:4/span 9}.col-sm-9.offset-sm-5{grid-column:5/span 9}.col-sm-9.offset-sm-6{grid-column:6/span 9}.col-sm-9.offset-sm-7{grid-column:7/span 9}.col-sm-9.offset-sm-8{grid-column:8/span 9}.col-sm-9.offset-sm-9{grid-column:9/span 9}.col-sm-9.offset-sm-10{grid-column:10/span 9}.col-sm-9.offset-sm-11{grid-column:11/span 9}.col-sm-9.offset-sm-12{grid-column:12/span 9}.col-sm-9.offset-sm-13{grid-column:13/span 9}.col-sm-9.offset-sm-14{grid-column:14/span 9}.col-sm-9.offset-sm-15{grid-column:15/span 9}.col-sm-9.offset-sm-16{grid-column:16/span 9}.col-10,.col-sm-10{grid-column:span 10}.col-sm-10.offset-sm-2{grid-column:2/span 10}.col-sm-10.offset-sm-3{grid-column:3/span 10}.col-sm-10.offset-sm-4{grid-column:4/span 10}.col-sm-10.offset-sm-5{grid-column:5/span 10}.col-sm-10.offset-sm-6{grid-column:6/span 10}.col-sm-10.offset-sm-7{grid-column:7/span 10}.col-sm-10.offset-sm-8{grid-column:8/span 10}.col-sm-10.offset-sm-9{grid-column:9/span 10}.col-sm-10.offset-sm-10{grid-column:10/span 10}.col-sm-10.offset-sm-11{grid-column:11/span 10}.col-sm-10.offset-sm-12{grid-column:12/span 10}.col-sm-10.offset-sm-13{grid-column:13/span 10}.col-sm-10.offset-sm-14{grid-column:14/span 10}.col-sm-10.offset-sm-15{grid-column:15/span 10}.col-sm-10.offset-sm-16{grid-column:16/span 10}.col-11,.col-sm-11{grid-column:span 11}.col-sm-11.offset-sm-2{grid-column:2/span 11}.col-sm-11.offset-sm-3{grid-column:3/span 11}.col-sm-11.offset-sm-4{grid-column:4/span 11}.col-sm-11.offset-sm-5{grid-column:5/span 11}.col-sm-11.offset-sm-6{grid-column:6/span 11}.col-sm-11.offset-sm-7{grid-column:7/span 11}.col-sm-11.offset-sm-8{grid-column:8/span 11}.col-sm-11.offset-sm-9{grid-column:9/span 11}.col-sm-11.offset-sm-10{grid-column:10/span 11}.col-sm-11.offset-sm-11{grid-column:11/span 11}.col-sm-11.offset-sm-12{grid-column:12/span 11}.col-sm-11.offset-sm-13{grid-column:13/span 11}.col-sm-11.offset-sm-14{grid-column:14/span 11}.col-sm-11.offset-sm-15{grid-column:15/span 11}.col-sm-11.offset-sm-16{grid-column:16/span 11}.col-12,.col-sm-12{grid-column:span 12}.col-sm-12.offset-sm-2{grid-column:2/span 12}.col-sm-12.offset-sm-3{grid-column:3/span 12}.col-sm-12.offset-sm-4{grid-column:4/span 12}.col-sm-12.offset-sm-5{grid-column:5/span 12}.col-sm-12.offset-sm-6{grid-column:6/span 12}.col-sm-12.offset-sm-7{grid-column:7/span 12}.col-sm-12.offset-sm-8{grid-column:8/span 12}.col-sm-12.offset-sm-9{grid-column:9/span 12}.col-sm-12.offset-sm-10{grid-column:10/span 12}.col-sm-12.offset-sm-11{grid-column:11/span 12}.col-sm-12.offset-sm-12{grid-column:12/span 12}.col-sm-12.offset-sm-13{grid-column:13/span 12}.col-sm-12.offset-sm-14{grid-column:14/span 12}.col-sm-12.offset-sm-15{grid-column:15/span 12}.col-sm-12.offset-sm-16{grid-column:16/span 12}.col-13,.col-sm-13{grid-column:span 13}.col-sm-13.offset-sm-2{grid-column:2/span 13}.col-sm-13.offset-sm-3{grid-column:3/span 13}.col-sm-13.offset-sm-4{grid-column:4/span 13}.col-sm-13.offset-sm-5{grid-column:5/span 13}.col-sm-13.offset-sm-6{grid-column:6/span 13}.col-sm-13.offset-sm-7{grid-column:7/span 13}.col-sm-13.offset-sm-8{grid-column:8/span 13}.col-sm-13.offset-sm-9{grid-column:9/span 13}.col-sm-13.offset-sm-10{grid-column:10/span 13}.col-sm-13.offset-sm-11{grid-column:11/span 13}.col-sm-13.offset-sm-12{grid-column:12/span 13}.col-sm-13.offset-sm-13{grid-column:13/span 13}.col-sm-13.offset-sm-14{grid-column:14/span 13}.col-sm-13.offset-sm-15{grid-column:15/span 13}.col-sm-13.offset-sm-16{grid-column:16/span 13}.col-14,.col-sm-14{grid-column:span 14}.col-sm-14.offset-sm-2{grid-column:2/span 14}.col-sm-14.offset-sm-3{grid-column:3/span 14}.col-sm-14.offset-sm-4{grid-column:4/span 14}.col-sm-14.offset-sm-5{grid-column:5/span 14}.col-sm-14.offset-sm-6{grid-column:6/span 14}.col-sm-14.offset-sm-7{grid-column:7/span 14}.col-sm-14.offset-sm-8{grid-column:8/span 14}.col-sm-14.offset-sm-9{grid-column:9/span 14}.col-sm-14.offset-sm-10{grid-column:10/span 14}.col-sm-14.offset-sm-11{grid-column:11/span 14}.col-sm-14.offset-sm-12{grid-column:12/span 14}.col-sm-14.offset-sm-13{grid-column:13/span 14}.col-sm-14.offset-sm-14{grid-column:14/span 14}.col-sm-14.offset-sm-15{grid-column:15/span 14}.col-sm-14.offset-sm-16{grid-column:16/span 14}.col-15,.col-sm-15{grid-column:span 15}.col-sm-15.offset-sm-2{grid-column:2/span 15}.col-sm-15.offset-sm-3{grid-column:3/span 15}.col-sm-15.offset-sm-4{grid-column:4/span 15}.col-sm-15.offset-sm-5{grid-column:5/span 15}.col-sm-15.offset-sm-6{grid-column:6/span 15}.col-sm-15.offset-sm-7{grid-column:7/span 15}.col-sm-15.offset-sm-8{grid-column:8/span 15}.col-sm-15.offset-sm-9{grid-column:9/span 15}.col-sm-15.offset-sm-10{grid-column:10/span 15}.col-sm-15.offset-sm-11{grid-column:11/span 15}.col-sm-15.offset-sm-12{grid-column:12/span 15}.col-sm-15.offset-sm-13{grid-column:13/span 15}.col-sm-15.offset-sm-14{grid-column:14/span 15}.col-sm-15.offset-sm-15{grid-column:15/span 15}.col-sm-15.offset-sm-16{grid-column:16/span 15}.col-16,.col-sm-16{grid-column:span 16}.col-sm-16.offset-sm-2{grid-column:2/span 16}.col-sm-16.offset-sm-3{grid-column:3/span 16}.col-sm-16.offset-sm-4{grid-column:4/span 16}.col-sm-16.offset-sm-5{grid-column:5/span 16}.col-sm-16.offset-sm-6{grid-column:6/span 16}.col-sm-16.offset-sm-7{grid-column:7/span 16}.col-sm-16.offset-sm-8{grid-column:8/span 16}.col-sm-16.offset-sm-9{grid-column:9/span 16}.col-sm-16.offset-sm-10{grid-column:10/span 16}.col-sm-16.offset-sm-11{grid-column:11/span 16}.col-sm-16.offset-sm-12{grid-column:12/span 16}.col-sm-16.offset-sm-13{grid-column:13/span 16}.col-sm-16.offset-sm-14{grid-column:14/span 16}.col-sm-16.offset-sm-15{grid-column:15/span 16}.col-sm-16.offset-sm-16{grid-column:16/span 16}}@media only screen and (min-width:768px){.col-1,.col-md-1{grid-column:span 1}.col-md-1.offset-md-2{grid-column:2/span 1}.col-md-1.offset-md-3{grid-column:3/span 1}.col-md-1.offset-md-4{grid-column:4/span 1}.col-md-1.offset-md-5{grid-column:5/span 1}.col-md-1.offset-md-6{grid-column:6/span 1}.col-md-1.offset-md-7{grid-column:7/span 1}.col-md-1.offset-md-8{grid-column:8/span 1}.col-md-1.offset-md-9{grid-column:9/span 1}.col-md-1.offset-md-10{grid-column:10/span 1}.col-md-1.offset-md-11{grid-column:11/span 1}.col-md-1.offset-md-12{grid-column:12/span 1}.col-md-1.offset-md-13{grid-column:13/span 1}.col-md-1.offset-md-14{grid-column:14/span 1}.col-md-1.offset-md-15{grid-column:15/span 1}.col-md-1.offset-md-16{grid-column:16/span 1}.col-2,.col-md-2{grid-column:span 2}.col-md-2.offset-md-2{grid-column:2/span 2}.col-md-2.offset-md-3{grid-column:3/span 2}.col-md-2.offset-md-4{grid-column:4/span 2}.col-md-2.offset-md-5{grid-column:5/span 2}.col-md-2.offset-md-6{grid-column:6/span 2}.col-md-2.offset-md-7{grid-column:7/span 2}.col-md-2.offset-md-8{grid-column:8/span 2}.col-md-2.offset-md-9{grid-column:9/span 2}.col-md-2.offset-md-10{grid-column:10/span 2}.col-md-2.offset-md-11{grid-column:11/span 2}.col-md-2.offset-md-12{grid-column:12/span 2}.col-md-2.offset-md-13{grid-column:13/span 2}.col-md-2.offset-md-14{grid-column:14/span 2}.col-md-2.offset-md-15{grid-column:15/span 2}.col-md-2.offset-md-16{grid-column:16/span 2}.col-3,.col-md-3{grid-column:span 3}.col-md-3.offset-md-2{grid-column:2/span 3}.col-md-3.offset-md-3{grid-column:3/span 3}.col-md-3.offset-md-4{grid-column:4/span 3}.col-md-3.offset-md-5{grid-column:5/span 3}.col-md-3.offset-md-6{grid-column:6/span 3}.col-md-3.offset-md-7{grid-column:7/span 3}.col-md-3.offset-md-8{grid-column:8/span 3}.col-md-3.offset-md-9{grid-column:9/span 3}.col-md-3.offset-md-10{grid-column:10/span 3}.col-md-3.offset-md-11{grid-column:11/span 3}.col-md-3.offset-md-12{grid-column:12/span 3}.col-md-3.offset-md-13{grid-column:13/span 3}.col-md-3.offset-md-14{grid-column:14/span 3}.col-md-3.offset-md-15{grid-column:15/span 3}.col-md-3.offset-md-16{grid-column:16/span 3}.col-4,.col-md-4{grid-column:span 4}.col-md-4.offset-md-2{grid-column:2/span 4}.col-md-4.offset-md-3{grid-column:3/span 4}.col-md-4.offset-md-4{grid-column:4/span 4}.col-md-4.offset-md-5{grid-column:5/span 4}.col-md-4.offset-md-6{grid-column:6/span 4}.col-md-4.offset-md-7{grid-column:7/span 4}.col-md-4.offset-md-8{grid-column:8/span 4}.col-md-4.offset-md-9{grid-column:9/span 4}.col-md-4.offset-md-10{grid-column:10/span 4}.col-md-4.offset-md-11{grid-column:11/span 4}.col-md-4.offset-md-12{grid-column:12/span 4}.col-md-4.offset-md-13{grid-column:13/span 4}.col-md-4.offset-md-14{grid-column:14/span 4}.col-md-4.offset-md-15{grid-column:15/span 4}.col-md-4.offset-md-16{grid-column:16/span 4}.col-5,.col-md-5{grid-column:span 5}.col-md-5.offset-md-2{grid-column:2/span 5}.col-md-5.offset-md-3{grid-column:3/span 5}.col-md-5.offset-md-4{grid-column:4/span 5}.col-md-5.offset-md-5{grid-column:5/span 5}.col-md-5.offset-md-6{grid-column:6/span 5}.col-md-5.offset-md-7{grid-column:7/span 5}.col-md-5.offset-md-8{grid-column:8/span 5}.col-md-5.offset-md-9{grid-column:9/span 5}.col-md-5.offset-md-10{grid-column:10/span 5}.col-md-5.offset-md-11{grid-column:11/span 5}.col-md-5.offset-md-12{grid-column:12/span 5}.col-md-5.offset-md-13{grid-column:13/span 5}.col-md-5.offset-md-14{grid-column:14/span 5}.col-md-5.offset-md-15{grid-column:15/span 5}.col-md-5.offset-md-16{grid-column:16/span 5}.col-6,.col-md-6{grid-column:span 6}.col-md-6.offset-md-2{grid-column:2/span 6}.col-md-6.offset-md-3{grid-column:3/span 6}.col-md-6.offset-md-4{grid-column:4/span 6}.col-md-6.offset-md-5{grid-column:5/span 6}.col-md-6.offset-md-6{grid-column:6/span 6}.col-md-6.offset-md-7{grid-column:7/span 6}.col-md-6.offset-md-8{grid-column:8/span 6}.col-md-6.offset-md-9{grid-column:9/span 6}.col-md-6.offset-md-10{grid-column:10/span 6}.col-md-6.offset-md-11{grid-column:11/span 6}.col-md-6.offset-md-12{grid-column:12/span 6}.col-md-6.offset-md-13{grid-column:13/span 6}.col-md-6.offset-md-14{grid-column:14/span 6}.col-md-6.offset-md-15{grid-column:15/span 6}.col-md-6.offset-md-16{grid-column:16/span 6}.col-7,.col-md-7{grid-column:span 7}.col-md-7.offset-md-2{grid-column:2/span 7}.col-md-7.offset-md-3{grid-column:3/span 7}.col-md-7.offset-md-4{grid-column:4/span 7}.col-md-7.offset-md-5{grid-column:5/span 7}.col-md-7.offset-md-6{grid-column:6/span 7}.col-md-7.offset-md-7{grid-column:7/span 7}.col-md-7.offset-md-8{grid-column:8/span 7}.col-md-7.offset-md-9{grid-column:9/span 7}.col-md-7.offset-md-10{grid-column:10/span 7}.col-md-7.offset-md-11{grid-column:11/span 7}.col-md-7.offset-md-12{grid-column:12/span 7}.col-md-7.offset-md-13{grid-column:13/span 7}.col-md-7.offset-md-14{grid-column:14/span 7}.col-md-7.offset-md-15{grid-column:15/span 7}.col-md-7.offset-md-16{grid-column:16/span 7}.col-8,.col-md-8{grid-column:span 8}.col-md-8.offset-md-2{grid-column:2/span 8}.col-md-8.offset-md-3{grid-column:3/span 8}.col-md-8.offset-md-4{grid-column:4/span 8}.col-md-8.offset-md-5{grid-column:5/span 8}.col-md-8.offset-md-6{grid-column:6/span 8}.col-md-8.offset-md-7{grid-column:7/span 8}.col-md-8.offset-md-8{grid-column:8/span 8}.col-md-8.offset-md-9{grid-column:9/span 8}.col-md-8.offset-md-10{grid-column:10/span 8}.col-md-8.offset-md-11{grid-column:11/span 8}.col-md-8.offset-md-12{grid-column:12/span 8}.col-md-8.offset-md-13{grid-column:13/span 8}.col-md-8.offset-md-14{grid-column:14/span 8}.col-md-8.offset-md-15{grid-column:15/span 8}.col-md-8.offset-md-16{grid-column:16/span 8}.col-9,.col-md-9{grid-column:span 9}.col-md-9.offset-md-2{grid-column:2/span 9}.col-md-9.offset-md-3{grid-column:3/span 9}.col-md-9.offset-md-4{grid-column:4/span 9}.col-md-9.offset-md-5{grid-column:5/span 9}.col-md-9.offset-md-6{grid-column:6/span 9}.col-md-9.offset-md-7{grid-column:7/span 9}.col-md-9.offset-md-8{grid-column:8/span 9}.col-md-9.offset-md-9{grid-column:9/span 9}.col-md-9.offset-md-10{grid-column:10/span 9}.col-md-9.offset-md-11{grid-column:11/span 9}.col-md-9.offset-md-12{grid-column:12/span 9}.col-md-9.offset-md-13{grid-column:13/span 9}.col-md-9.offset-md-14{grid-column:14/span 9}.col-md-9.offset-md-15{grid-column:15/span 9}.col-md-9.offset-md-16{grid-column:16/span 9}.col-10,.col-md-10{grid-column:span 10}.col-md-10.offset-md-2{grid-column:2/span 10}.col-md-10.offset-md-3{grid-column:3/span 10}.col-md-10.offset-md-4{grid-column:4/span 10}.col-md-10.offset-md-5{grid-column:5/span 10}.col-md-10.offset-md-6{grid-column:6/span 10}.col-md-10.offset-md-7{grid-column:7/span 10}.col-md-10.offset-md-8{grid-column:8/span 10}.col-md-10.offset-md-9{grid-column:9/span 10}.col-md-10.offset-md-10{grid-column:10/span 10}.col-md-10.offset-md-11{grid-column:11/span 10}.col-md-10.offset-md-12{grid-column:12/span 10}.col-md-10.offset-md-13{grid-column:13/span 10}.col-md-10.offset-md-14{grid-column:14/span 10}.col-md-10.offset-md-15{grid-column:15/span 10}.col-md-10.offset-md-16{grid-column:16/span 10}.col-11,.col-md-11{grid-column:span 11}.col-md-11.offset-md-2{grid-column:2/span 11}.col-md-11.offset-md-3{grid-column:3/span 11}.col-md-11.offset-md-4{grid-column:4/span 11}.col-md-11.offset-md-5{grid-column:5/span 11}.col-md-11.offset-md-6{grid-column:6/span 11}.col-md-11.offset-md-7{grid-column:7/span 11}.col-md-11.offset-md-8{grid-column:8/span 11}.col-md-11.offset-md-9{grid-column:9/span 11}.col-md-11.offset-md-10{grid-column:10/span 11}.col-md-11.offset-md-11{grid-column:11/span 11}.col-md-11.offset-md-12{grid-column:12/span 11}.col-md-11.offset-md-13{grid-column:13/span 11}.col-md-11.offset-md-14{grid-column:14/span 11}.col-md-11.offset-md-15{grid-column:15/span 11}.col-md-11.offset-md-16{grid-column:16/span 11}.col-12,.col-md-12{grid-column:span 12}.col-md-12.offset-md-2{grid-column:2/span 12}.col-md-12.offset-md-3{grid-column:3/span 12}.col-md-12.offset-md-4{grid-column:4/span 12}.col-md-12.offset-md-5{grid-column:5/span 12}.col-md-12.offset-md-6{grid-column:6/span 12}.col-md-12.offset-md-7{grid-column:7/span 12}.col-md-12.offset-md-8{grid-column:8/span 12}.col-md-12.offset-md-9{grid-column:9/span 12}.col-md-12.offset-md-10{grid-column:10/span 12}.col-md-12.offset-md-11{grid-column:11/span 12}.col-md-12.offset-md-12{grid-column:12/span 12}.col-md-12.offset-md-13{grid-column:13/span 12}.col-md-12.offset-md-14{grid-column:14/span 12}.col-md-12.offset-md-15{grid-column:15/span 12}.col-md-12.offset-md-16{grid-column:16/span 12}.col-13,.col-md-13{grid-column:span 13}.col-md-13.offset-md-2{grid-column:2/span 13}.col-md-13.offset-md-3{grid-column:3/span 13}.col-md-13.offset-md-4{grid-column:4/span 13}.col-md-13.offset-md-5{grid-column:5/span 13}.col-md-13.offset-md-6{grid-column:6/span 13}.col-md-13.offset-md-7{grid-column:7/span 13}.col-md-13.offset-md-8{grid-column:8/span 13}.col-md-13.offset-md-9{grid-column:9/span 13}.col-md-13.offset-md-10{grid-column:10/span 13}.col-md-13.offset-md-11{grid-column:11/span 13}.col-md-13.offset-md-12{grid-column:12/span 13}.col-md-13.offset-md-13{grid-column:13/span 13}.col-md-13.offset-md-14{grid-column:14/span 13}.col-md-13.offset-md-15{grid-column:15/span 13}.col-md-13.offset-md-16{grid-column:16/span 13}.col-14,.col-md-14{grid-column:span 14}.col-md-14.offset-md-2{grid-column:2/span 14}.col-md-14.offset-md-3{grid-column:3/span 14}.col-md-14.offset-md-4{grid-column:4/span 14}.col-md-14.offset-md-5{grid-column:5/span 14}.col-md-14.offset-md-6{grid-column:6/span 14}.col-md-14.offset-md-7{grid-column:7/span 14}.col-md-14.offset-md-8{grid-column:8/span 14}.col-md-14.offset-md-9{grid-column:9/span 14}.col-md-14.offset-md-10{grid-column:10/span 14}.col-md-14.offset-md-11{grid-column:11/span 14}.col-md-14.offset-md-12{grid-column:12/span 14}.col-md-14.offset-md-13{grid-column:13/span 14}.col-md-14.offset-md-14{grid-column:14/span 14}.col-md-14.offset-md-15{grid-column:15/span 14}.col-md-14.offset-md-16{grid-column:16/span 14}.col-15,.col-md-15{grid-column:span 15}.col-md-15.offset-md-2{grid-column:2/span 15}.col-md-15.offset-md-3{grid-column:3/span 15}.col-md-15.offset-md-4{grid-column:4/span 15}.col-md-15.offset-md-5{grid-column:5/span 15}.col-md-15.offset-md-6{grid-column:6/span 15}.col-md-15.offset-md-7{grid-column:7/span 15}.col-md-15.offset-md-8{grid-column:8/span 15}.col-md-15.offset-md-9{grid-column:9/span 15}.col-md-15.offset-md-10{grid-column:10/span 15}.col-md-15.offset-md-11{grid-column:11/span 15}.col-md-15.offset-md-12{grid-column:12/span 15}.col-md-15.offset-md-13{grid-column:13/span 15}.col-md-15.offset-md-14{grid-column:14/span 15}.col-md-15.offset-md-15{grid-column:15/span 15}.col-md-15.offset-md-16{grid-column:16/span 15}.col-16,.col-md-16{grid-column:span 16}.col-md-16.offset-md-2{grid-column:2/span 16}.col-md-16.offset-md-3{grid-column:3/span 16}.col-md-16.offset-md-4{grid-column:4/span 16}.col-md-16.offset-md-5{grid-column:5/span 16}.col-md-16.offset-md-6{grid-column:6/span 16}.col-md-16.offset-md-7{grid-column:7/span 16}.col-md-16.offset-md-8{grid-column:8/span 16}.col-md-16.offset-md-9{grid-column:9/span 16}.col-md-16.offset-md-10{grid-column:10/span 16}.col-md-16.offset-md-11{grid-column:11/span 16}.col-md-16.offset-md-12{grid-column:12/span 16}.col-md-16.offset-md-13{grid-column:13/span 16}.col-md-16.offset-md-14{grid-column:14/span 16}.col-md-16.offset-md-15{grid-column:15/span 16}.col-md-16.offset-md-16{grid-column:16/span 16}}@media only screen and (min-width:992px){.col-1,.col-lg-1{grid-column:span 1}.col-lg-1.offset-lg-2{grid-column:2/span 1}.col-lg-1.offset-lg-3{grid-column:3/span 1}.col-lg-1.offset-lg-4{grid-column:4/span 1}.col-lg-1.offset-lg-5{grid-column:5/span 1}.col-lg-1.offset-lg-6{grid-column:6/span 1}.col-lg-1.offset-lg-7{grid-column:7/span 1}.col-lg-1.offset-lg-8{grid-column:8/span 1}.col-lg-1.offset-lg-9{grid-column:9/span 1}.col-lg-1.offset-lg-10{grid-column:10/span 1}.col-lg-1.offset-lg-11{grid-column:11/span 1}.col-lg-1.offset-lg-12{grid-column:12/span 1}.col-lg-1.offset-lg-13{grid-column:13/span 1}.col-lg-1.offset-lg-14{grid-column:14/span 1}.col-lg-1.offset-lg-15{grid-column:15/span 1}.col-lg-1.offset-lg-16{grid-column:16/span 1}.col-2,.col-lg-2{grid-column:span 2}.col-lg-2.offset-lg-2{grid-column:2/span 2}.col-lg-2.offset-lg-3{grid-column:3/span 2}.col-lg-2.offset-lg-4{grid-column:4/span 2}.col-lg-2.offset-lg-5{grid-column:5/span 2}.col-lg-2.offset-lg-6{grid-column:6/span 2}.col-lg-2.offset-lg-7{grid-column:7/span 2}.col-lg-2.offset-lg-8{grid-column:8/span 2}.col-lg-2.offset-lg-9{grid-column:9/span 2}.col-lg-2.offset-lg-10{grid-column:10/span 2}.col-lg-2.offset-lg-11{grid-column:11/span 2}.col-lg-2.offset-lg-12{grid-column:12/span 2}.col-lg-2.offset-lg-13{grid-column:13/span 2}.col-lg-2.offset-lg-14{grid-column:14/span 2}.col-lg-2.offset-lg-15{grid-column:15/span 2}.col-lg-2.offset-lg-16{grid-column:16/span 2}.col-3,.col-lg-3{grid-column:span 3}.col-lg-3.offset-lg-2{grid-column:2/span 3}.col-lg-3.offset-lg-3{grid-column:3/span 3}.col-lg-3.offset-lg-4{grid-column:4/span 3}.col-lg-3.offset-lg-5{grid-column:5/span 3}.col-lg-3.offset-lg-6{grid-column:6/span 3}.col-lg-3.offset-lg-7{grid-column:7/span 3}.col-lg-3.offset-lg-8{grid-column:8/span 3}.col-lg-3.offset-lg-9{grid-column:9/span 3}.col-lg-3.offset-lg-10{grid-column:10/span 3}.col-lg-3.offset-lg-11{grid-column:11/span 3}.col-lg-3.offset-lg-12{grid-column:12/span 3}.col-lg-3.offset-lg-13{grid-column:13/span 3}.col-lg-3.offset-lg-14{grid-column:14/span 3}.col-lg-3.offset-lg-15{grid-column:15/span 3}.col-lg-3.offset-lg-16{grid-column:16/span 3}.col-4,.col-lg-4{grid-column:span 4}.col-lg-4.offset-lg-2{grid-column:2/span 4}.col-lg-4.offset-lg-3{grid-column:3/span 4}.col-lg-4.offset-lg-4{grid-column:4/span 4}.col-lg-4.offset-lg-5{grid-column:5/span 4}.col-lg-4.offset-lg-6{grid-column:6/span 4}.col-lg-4.offset-lg-7{grid-column:7/span 4}.col-lg-4.offset-lg-8{grid-column:8/span 4}.col-lg-4.offset-lg-9{grid-column:9/span 4}.col-lg-4.offset-lg-10{grid-column:10/span 4}.col-lg-4.offset-lg-11{grid-column:11/span 4}.col-lg-4.offset-lg-12{grid-column:12/span 4}.col-lg-4.offset-lg-13{grid-column:13/span 4}.col-lg-4.offset-lg-14{grid-column:14/span 4}.col-lg-4.offset-lg-15{grid-column:15/span 4}.col-lg-4.offset-lg-16{grid-column:16/span 4}.col-5,.col-lg-5{grid-column:span 5}.col-lg-5.offset-lg-2{grid-column:2/span 5}.col-lg-5.offset-lg-3{grid-column:3/span 5}.col-lg-5.offset-lg-4{grid-column:4/span 5}.col-lg-5.offset-lg-5{grid-column:5/span 5}.col-lg-5.offset-lg-6{grid-column:6/span 5}.col-lg-5.offset-lg-7{grid-column:7/span 5}.col-lg-5.offset-lg-8{grid-column:8/span 5}.col-lg-5.offset-lg-9{grid-column:9/span 5}.col-lg-5.offset-lg-10{grid-column:10/span 5}.col-lg-5.offset-lg-11{grid-column:11/span 5}.col-lg-5.offset-lg-12{grid-column:12/span 5}.col-lg-5.offset-lg-13{grid-column:13/span 5}.col-lg-5.offset-lg-14{grid-column:14/span 5}.col-lg-5.offset-lg-15{grid-column:15/span 5}.col-lg-5.offset-lg-16{grid-column:16/span 5}.col-6,.col-lg-6{grid-column:span 6}.col-lg-6.offset-lg-2{grid-column:2/span 6}.col-lg-6.offset-lg-3{grid-column:3/span 6}.col-lg-6.offset-lg-4{grid-column:4/span 6}.col-lg-6.offset-lg-5{grid-column:5/span 6}.col-lg-6.offset-lg-6{grid-column:6/span 6}.col-lg-6.offset-lg-7{grid-column:7/span 6}.col-lg-6.offset-lg-8{grid-column:8/span 6}.col-lg-6.offset-lg-9{grid-column:9/span 6}.col-lg-6.offset-lg-10{grid-column:10/span 6}.col-lg-6.offset-lg-11{grid-column:11/span 6}.col-lg-6.offset-lg-12{grid-column:12/span 6}.col-lg-6.offset-lg-13{grid-column:13/span 6}.col-lg-6.offset-lg-14{grid-column:14/span 6}.col-lg-6.offset-lg-15{grid-column:15/span 6}.col-lg-6.offset-lg-16{grid-column:16/span 6}.col-7,.col-lg-7{grid-column:span 7}.col-lg-7.offset-lg-2{grid-column:2/span 7}.col-lg-7.offset-lg-3{grid-column:3/span 7}.col-lg-7.offset-lg-4{grid-column:4/span 7}.col-lg-7.offset-lg-5{grid-column:5/span 7}.col-lg-7.offset-lg-6{grid-column:6/span 7}.col-lg-7.offset-lg-7{grid-column:7/span 7}.col-lg-7.offset-lg-8{grid-column:8/span 7}.col-lg-7.offset-lg-9{grid-column:9/span 7}.col-lg-7.offset-lg-10{grid-column:10/span 7}.col-lg-7.offset-lg-11{grid-column:11/span 7}.col-lg-7.offset-lg-12{grid-column:12/span 7}.col-lg-7.offset-lg-13{grid-column:13/span 7}.col-lg-7.offset-lg-14{grid-column:14/span 7}.col-lg-7.offset-lg-15{grid-column:15/span 7}.col-lg-7.offset-lg-16{grid-column:16/span 7}.col-8,.col-lg-8{grid-column:span 8}.col-lg-8.offset-lg-2{grid-column:2/span 8}.col-lg-8.offset-lg-3{grid-column:3/span 8}.col-lg-8.offset-lg-4{grid-column:4/span 8}.col-lg-8.offset-lg-5{grid-column:5/span 8}.col-lg-8.offset-lg-6{grid-column:6/span 8}.col-lg-8.offset-lg-7{grid-column:7/span 8}.col-lg-8.offset-lg-8{grid-column:8/span 8}.col-lg-8.offset-lg-9{grid-column:9/span 8}.col-lg-8.offset-lg-10{grid-column:10/span 8}.col-lg-8.offset-lg-11{grid-column:11/span 8}.col-lg-8.offset-lg-12{grid-column:12/span 8}.col-lg-8.offset-lg-13{grid-column:13/span 8}.col-lg-8.offset-lg-14{grid-column:14/span 8}.col-lg-8.offset-lg-15{grid-column:15/span 8}.col-lg-8.offset-lg-16{grid-column:16/span 8}.col-9,.col-lg-9{grid-column:span 9}.col-lg-9.offset-lg-2{grid-column:2/span 9}.col-lg-9.offset-lg-3{grid-column:3/span 9}.col-lg-9.offset-lg-4{grid-column:4/span 9}.col-lg-9.offset-lg-5{grid-column:5/span 9}.col-lg-9.offset-lg-6{grid-column:6/span 9}.col-lg-9.offset-lg-7{grid-column:7/span 9}.col-lg-9.offset-lg-8{grid-column:8/span 9}.col-lg-9.offset-lg-9{grid-column:9/span 9}.col-lg-9.offset-lg-10{grid-column:10/span 9}.col-lg-9.offset-lg-11{grid-column:11/span 9}.col-lg-9.offset-lg-12{grid-column:12/span 9}.col-lg-9.offset-lg-13{grid-column:13/span 9}.col-lg-9.offset-lg-14{grid-column:14/span 9}.col-lg-9.offset-lg-15{grid-column:15/span 9}.col-lg-9.offset-lg-16{grid-column:16/span 9}.col-10,.col-lg-10{grid-column:span 10}.col-lg-10.offset-lg-2{grid-column:2/span 10}.col-lg-10.offset-lg-3{grid-column:3/span 10}.col-lg-10.offset-lg-4{grid-column:4/span 10}.col-lg-10.offset-lg-5{grid-column:5/span 10}.col-lg-10.offset-lg-6{grid-column:6/span 10}.col-lg-10.offset-lg-7{grid-column:7/span 10}.col-lg-10.offset-lg-8{grid-column:8/span 10}.col-lg-10.offset-lg-9{grid-column:9/span 10}.col-lg-10.offset-lg-10{grid-column:10/span 10}.col-lg-10.offset-lg-11{grid-column:11/span 10}.col-lg-10.offset-lg-12{grid-column:12/span 10}.col-lg-10.offset-lg-13{grid-column:13/span 10}.col-lg-10.offset-lg-14{grid-column:14/span 10}.col-lg-10.offset-lg-15{grid-column:15/span 10}.col-lg-10.offset-lg-16{grid-column:16/span 10}.col-11,.col-lg-11{grid-column:span 11}.col-lg-11.offset-lg-2{grid-column:2/span 11}.col-lg-11.offset-lg-3{grid-column:3/span 11}.col-lg-11.offset-lg-4{grid-column:4/span 11}.col-lg-11.offset-lg-5{grid-column:5/span 11}.col-lg-11.offset-lg-6{grid-column:6/span 11}.col-lg-11.offset-lg-7{grid-column:7/span 11}.col-lg-11.offset-lg-8{grid-column:8/span 11}.col-lg-11.offset-lg-9{grid-column:9/span 11}.col-lg-11.offset-lg-10{grid-column:10/span 11}.col-lg-11.offset-lg-11{grid-column:11/span 11}.col-lg-11.offset-lg-12{grid-column:12/span 11}.col-lg-11.offset-lg-13{grid-column:13/span 11}.col-lg-11.offset-lg-14{grid-column:14/span 11}.col-lg-11.offset-lg-15{grid-column:15/span 11}.col-lg-11.offset-lg-16{grid-column:16/span 11}.col-12,.col-lg-12{grid-column:span 12}.col-lg-12.offset-lg-2{grid-column:2/span 12}.col-lg-12.offset-lg-3{grid-column:3/span 12}.col-lg-12.offset-lg-4{grid-column:4/span 12}.col-lg-12.offset-lg-5{grid-column:5/span 12}.col-lg-12.offset-lg-6{grid-column:6/span 12}.col-lg-12.offset-lg-7{grid-column:7/span 12}.col-lg-12.offset-lg-8{grid-column:8/span 12}.col-lg-12.offset-lg-9{grid-column:9/span 12}.col-lg-12.offset-lg-10{grid-column:10/span 12}.col-lg-12.offset-lg-11{grid-column:11/span 12}.col-lg-12.offset-lg-12{grid-column:12/span 12}.col-lg-12.offset-lg-13{grid-column:13/span 12}.col-lg-12.offset-lg-14{grid-column:14/span 12}.col-lg-12.offset-lg-15{grid-column:15/span 12}.col-lg-12.offset-lg-16{grid-column:16/span 12}.col-13,.col-lg-13{grid-column:span 13}.col-lg-13.offset-lg-2{grid-column:2/span 13}.col-lg-13.offset-lg-3{grid-column:3/span 13}.col-lg-13.offset-lg-4{grid-column:4/span 13}.col-lg-13.offset-lg-5{grid-column:5/span 13}.col-lg-13.offset-lg-6{grid-column:6/span 13}.col-lg-13.offset-lg-7{grid-column:7/span 13}.col-lg-13.offset-lg-8{grid-column:8/span 13}.col-lg-13.offset-lg-9{grid-column:9/span 13}.col-lg-13.offset-lg-10{grid-column:10/span 13}.col-lg-13.offset-lg-11{grid-column:11/span 13}.col-lg-13.offset-lg-12{grid-column:12/span 13}.col-lg-13.offset-lg-13{grid-column:13/span 13}.col-lg-13.offset-lg-14{grid-column:14/span 13}.col-lg-13.offset-lg-15{grid-column:15/span 13}.col-lg-13.offset-lg-16{grid-column:16/span 13}.col-14,.col-lg-14{grid-column:span 14}.col-lg-14.offset-lg-2{grid-column:2/span 14}.col-lg-14.offset-lg-3{grid-column:3/span 14}.col-lg-14.offset-lg-4{grid-column:4/span 14}.col-lg-14.offset-lg-5{grid-column:5/span 14}.col-lg-14.offset-lg-6{grid-column:6/span 14}.col-lg-14.offset-lg-7{grid-column:7/span 14}.col-lg-14.offset-lg-8{grid-column:8/span 14}.col-lg-14.offset-lg-9{grid-column:9/span 14}.col-lg-14.offset-lg-10{grid-column:10/span 14}.col-lg-14.offset-lg-11{grid-column:11/span 14}.col-lg-14.offset-lg-12{grid-column:12/span 14}.col-lg-14.offset-lg-13{grid-column:13/span 14}.col-lg-14.offset-lg-14{grid-column:14/span 14}.col-lg-14.offset-lg-15{grid-column:15/span 14}.col-lg-14.offset-lg-16{grid-column:16/span 14}.col-15,.col-lg-15{grid-column:span 15}.col-lg-15.offset-lg-2{grid-column:2/span 15}.col-lg-15.offset-lg-3{grid-column:3/span 15}.col-lg-15.offset-lg-4{grid-column:4/span 15}.col-lg-15.offset-lg-5{grid-column:5/span 15}.col-lg-15.offset-lg-6{grid-column:6/span 15}.col-lg-15.offset-lg-7{grid-column:7/span 15}.col-lg-15.offset-lg-8{grid-column:8/span 15}.col-lg-15.offset-lg-9{grid-column:9/span 15}.col-lg-15.offset-lg-10{grid-column:10/span 15}.col-lg-15.offset-lg-11{grid-column:11/span 15}.col-lg-15.offset-lg-12{grid-column:12/span 15}.col-lg-15.offset-lg-13{grid-column:13/span 15}.col-lg-15.offset-lg-14{grid-column:14/span 15}.col-lg-15.offset-lg-15{grid-column:15/span 15}.col-lg-15.offset-lg-16{grid-column:16/span 15}.col-16,.col-lg-16{grid-column:span 16}.col-lg-16.offset-lg-2{grid-column:2/span 16}.col-lg-16.offset-lg-3{grid-column:3/span 16}.col-lg-16.offset-lg-4{grid-column:4/span 16}.col-lg-16.offset-lg-5{grid-column:5/span 16}.col-lg-16.offset-lg-6{grid-column:6/span 16}.col-lg-16.offset-lg-7{grid-column:7/span 16}.col-lg-16.offset-lg-8{grid-column:8/span 16}.col-lg-16.offset-lg-9{grid-column:9/span 16}.col-lg-16.offset-lg-10{grid-column:10/span 16}.col-lg-16.offset-lg-11{grid-column:11/span 16}.col-lg-16.offset-lg-12{grid-column:12/span 16}.col-lg-16.offset-lg-13{grid-column:13/span 16}.col-lg-16.offset-lg-14{grid-column:14/span 16}.col-lg-16.offset-lg-15{grid-column:15/span 16}.col-lg-16.offset-lg-16{grid-column:16/span 16}}@media only screen and (min-width:1260px){.col-1,.col-xl-1{grid-column:span 1}.col-xl-1.offset-xl-2{grid-column:2/span 1}.col-xl-1.offset-xl-3{grid-column:3/span 1}.col-xl-1.offset-xl-4{grid-column:4/span 1}.col-xl-1.offset-xl-5{grid-column:5/span 1}.col-xl-1.offset-xl-6{grid-column:6/span 1}.col-xl-1.offset-xl-7{grid-column:7/span 1}.col-xl-1.offset-xl-8{grid-column:8/span 1}.col-xl-1.offset-xl-9{grid-column:9/span 1}.col-xl-1.offset-xl-10{grid-column:10/span 1}.col-xl-1.offset-xl-11{grid-column:11/span 1}.col-xl-1.offset-xl-12{grid-column:12/span 1}.col-xl-1.offset-xl-13{grid-column:13/span 1}.col-xl-1.offset-xl-14{grid-column:14/span 1}.col-xl-1.offset-xl-15{grid-column:15/span 1}.col-xl-1.offset-xl-16{grid-column:16/span 1}.col-2,.col-xl-2{grid-column:span 2}.col-xl-2.offset-xl-2{grid-column:2/span 2}.col-xl-2.offset-xl-3{grid-column:3/span 2}.col-xl-2.offset-xl-4{grid-column:4/span 2}.col-xl-2.offset-xl-5{grid-column:5/span 2}.col-xl-2.offset-xl-6{grid-column:6/span 2}.col-xl-2.offset-xl-7{grid-column:7/span 2}.col-xl-2.offset-xl-8{grid-column:8/span 2}.col-xl-2.offset-xl-9{grid-column:9/span 2}.col-xl-2.offset-xl-10{grid-column:10/span 2}.col-xl-2.offset-xl-11{grid-column:11/span 2}.col-xl-2.offset-xl-12{grid-column:12/span 2}.col-xl-2.offset-xl-13{grid-column:13/span 2}.col-xl-2.offset-xl-14{grid-column:14/span 2}.col-xl-2.offset-xl-15{grid-column:15/span 2}.col-xl-2.offset-xl-16{grid-column:16/span 2}.col-3,.col-xl-3{grid-column:span 3}.col-xl-3.offset-xl-2{grid-column:2/span 3}.col-xl-3.offset-xl-3{grid-column:3/span 3}.col-xl-3.offset-xl-4{grid-column:4/span 3}.col-xl-3.offset-xl-5{grid-column:5/span 3}.col-xl-3.offset-xl-6{grid-column:6/span 3}.col-xl-3.offset-xl-7{grid-column:7/span 3}.col-xl-3.offset-xl-8{grid-column:8/span 3}.col-xl-3.offset-xl-9{grid-column:9/span 3}.col-xl-3.offset-xl-10{grid-column:10/span 3}.col-xl-3.offset-xl-11{grid-column:11/span 3}.col-xl-3.offset-xl-12{grid-column:12/span 3}.col-xl-3.offset-xl-13{grid-column:13/span 3}.col-xl-3.offset-xl-14{grid-column:14/span 3}.col-xl-3.offset-xl-15{grid-column:15/span 3}.col-xl-3.offset-xl-16{grid-column:16/span 3}.col-4,.col-xl-4{grid-column:span 4}.col-xl-4.offset-xl-2{grid-column:2/span 4}.col-xl-4.offset-xl-3{grid-column:3/span 4}.col-xl-4.offset-xl-4{grid-column:4/span 4}.col-xl-4.offset-xl-5{grid-column:5/span 4}.col-xl-4.offset-xl-6{grid-column:6/span 4}.col-xl-4.offset-xl-7{grid-column:7/span 4}.col-xl-4.offset-xl-8{grid-column:8/span 4}.col-xl-4.offset-xl-9{grid-column:9/span 4}.col-xl-4.offset-xl-10{grid-column:10/span 4}.col-xl-4.offset-xl-11{grid-column:11/span 4}.col-xl-4.offset-xl-12{grid-column:12/span 4}.col-xl-4.offset-xl-13{grid-column:13/span 4}.col-xl-4.offset-xl-14{grid-column:14/span 4}.col-xl-4.offset-xl-15{grid-column:15/span 4}.col-xl-4.offset-xl-16{grid-column:16/span 4}.col-5,.col-xl-5{grid-column:span 5}.col-xl-5.offset-xl-2{grid-column:2/span 5}.col-xl-5.offset-xl-3{grid-column:3/span 5}.col-xl-5.offset-xl-4{grid-column:4/span 5}.col-xl-5.offset-xl-5{grid-column:5/span 5}.col-xl-5.offset-xl-6{grid-column:6/span 5}.col-xl-5.offset-xl-7{grid-column:7/span 5}.col-xl-5.offset-xl-8{grid-column:8/span 5}.col-xl-5.offset-xl-9{grid-column:9/span 5}.col-xl-5.offset-xl-10{grid-column:10/span 5}.col-xl-5.offset-xl-11{grid-column:11/span 5}.col-xl-5.offset-xl-12{grid-column:12/span 5}.col-xl-5.offset-xl-13{grid-column:13/span 5}.col-xl-5.offset-xl-14{grid-column:14/span 5}.col-xl-5.offset-xl-15{grid-column:15/span 5}.col-xl-5.offset-xl-16{grid-column:16/span 5}.col-6,.col-xl-6{grid-column:span 6}.col-xl-6.offset-xl-2{grid-column:2/span 6}.col-xl-6.offset-xl-3{grid-column:3/span 6}.col-xl-6.offset-xl-4{grid-column:4/span 6}.col-xl-6.offset-xl-5{grid-column:5/span 6}.col-xl-6.offset-xl-6{grid-column:6/span 6}.col-xl-6.offset-xl-7{grid-column:7/span 6}.col-xl-6.offset-xl-8{grid-column:8/span 6}.col-xl-6.offset-xl-9{grid-column:9/span 6}.col-xl-6.offset-xl-10{grid-column:10/span 6}.col-xl-6.offset-xl-11{grid-column:11/span 6}.col-xl-6.offset-xl-12{grid-column:12/span 6}.col-xl-6.offset-xl-13{grid-column:13/span 6}.col-xl-6.offset-xl-14{grid-column:14/span 6}.col-xl-6.offset-xl-15{grid-column:15/span 6}.col-xl-6.offset-xl-16{grid-column:16/span 6}.col-7,.col-xl-7{grid-column:span 7}.col-xl-7.offset-xl-2{grid-column:2/span 7}.col-xl-7.offset-xl-3{grid-column:3/span 7}.col-xl-7.offset-xl-4{grid-column:4/span 7}.col-xl-7.offset-xl-5{grid-column:5/span 7}.col-xl-7.offset-xl-6{grid-column:6/span 7}.col-xl-7.offset-xl-7{grid-column:7/span 7}.col-xl-7.offset-xl-8{grid-column:8/span 7}.col-xl-7.offset-xl-9{grid-column:9/span 7}.col-xl-7.offset-xl-10{grid-column:10/span 7}.col-xl-7.offset-xl-11{grid-column:11/span 7}.col-xl-7.offset-xl-12{grid-column:12/span 7}.col-xl-7.offset-xl-13{grid-column:13/span 7}.col-xl-7.offset-xl-14{grid-column:14/span 7}.col-xl-7.offset-xl-15{grid-column:15/span 7}.col-xl-7.offset-xl-16{grid-column:16/span 7}.col-8,.col-xl-8{grid-column:span 8}.col-xl-8.offset-xl-2{grid-column:2/span 8}.col-xl-8.offset-xl-3{grid-column:3/span 8}.col-xl-8.offset-xl-4{grid-column:4/span 8}.col-xl-8.offset-xl-5{grid-column:5/span 8}.col-xl-8.offset-xl-6{grid-column:6/span 8}.col-xl-8.offset-xl-7{grid-column:7/span 8}.col-xl-8.offset-xl-8{grid-column:8/span 8}.col-xl-8.offset-xl-9{grid-column:9/span 8}.col-xl-8.offset-xl-10{grid-column:10/span 8}.col-xl-8.offset-xl-11{grid-column:11/span 8}.col-xl-8.offset-xl-12{grid-column:12/span 8}.col-xl-8.offset-xl-13{grid-column:13/span 8}.col-xl-8.offset-xl-14{grid-column:14/span 8}.col-xl-8.offset-xl-15{grid-column:15/span 8}.col-xl-8.offset-xl-16{grid-column:16/span 8}.col-9,.col-xl-9{grid-column:span 9}.col-xl-9.offset-xl-2{grid-column:2/span 9}.col-xl-9.offset-xl-3{grid-column:3/span 9}.col-xl-9.offset-xl-4{grid-column:4/span 9}.col-xl-9.offset-xl-5{grid-column:5/span 9}.col-xl-9.offset-xl-6{grid-column:6/span 9}.col-xl-9.offset-xl-7{grid-column:7/span 9}.col-xl-9.offset-xl-8{grid-column:8/span 9}.col-xl-9.offset-xl-9{grid-column:9/span 9}.col-xl-9.offset-xl-10{grid-column:10/span 9}.col-xl-9.offset-xl-11{grid-column:11/span 9}.col-xl-9.offset-xl-12{grid-column:12/span 9}.col-xl-9.offset-xl-13{grid-column:13/span 9}.col-xl-9.offset-xl-14{grid-column:14/span 9}.col-xl-9.offset-xl-15{grid-column:15/span 9}.col-xl-9.offset-xl-16{grid-column:16/span 9}.col-10,.col-xl-10{grid-column:span 10}.col-xl-10.offset-xl-2{grid-column:2/span 10}.col-xl-10.offset-xl-3{grid-column:3/span 10}.col-xl-10.offset-xl-4{grid-column:4/span 10}.col-xl-10.offset-xl-5{grid-column:5/span 10}.col-xl-10.offset-xl-6{grid-column:6/span 10}.col-xl-10.offset-xl-7{grid-column:7/span 10}.col-xl-10.offset-xl-8{grid-column:8/span 10}.col-xl-10.offset-xl-9{grid-column:9/span 10}.col-xl-10.offset-xl-10{grid-column:10/span 10}.col-xl-10.offset-xl-11{grid-column:11/span 10}.col-xl-10.offset-xl-12{grid-column:12/span 10}.col-xl-10.offset-xl-13{grid-column:13/span 10}.col-xl-10.offset-xl-14{grid-column:14/span 10}.col-xl-10.offset-xl-15{grid-column:15/span 10}.col-xl-10.offset-xl-16{grid-column:16/span 10}.col-11,.col-xl-11{grid-column:span 11}.col-xl-11.offset-xl-2{grid-column:2/span 11}.col-xl-11.offset-xl-3{grid-column:3/span 11}.col-xl-11.offset-xl-4{grid-column:4/span 11}.col-xl-11.offset-xl-5{grid-column:5/span 11}.col-xl-11.offset-xl-6{grid-column:6/span 11}.col-xl-11.offset-xl-7{grid-column:7/span 11}.col-xl-11.offset-xl-8{grid-column:8/span 11}.col-xl-11.offset-xl-9{grid-column:9/span 11}.col-xl-11.offset-xl-10{grid-column:10/span 11}.col-xl-11.offset-xl-11{grid-column:11/span 11}.col-xl-11.offset-xl-12{grid-column:12/span 11}.col-xl-11.offset-xl-13{grid-column:13/span 11}.col-xl-11.offset-xl-14{grid-column:14/span 11}.col-xl-11.offset-xl-15{grid-column:15/span 11}.col-xl-11.offset-xl-16{grid-column:16/span 11}.col-12,.col-xl-12{grid-column:span 12}.col-xl-12.offset-xl-2{grid-column:2/span 12}.col-xl-12.offset-xl-3{grid-column:3/span 12}.col-xl-12.offset-xl-4{grid-column:4/span 12}.col-xl-12.offset-xl-5{grid-column:5/span 12}.col-xl-12.offset-xl-6{grid-column:6/span 12}.col-xl-12.offset-xl-7{grid-column:7/span 12}.col-xl-12.offset-xl-8{grid-column:8/span 12}.col-xl-12.offset-xl-9{grid-column:9/span 12}.col-xl-12.offset-xl-10{grid-column:10/span 12}.col-xl-12.offset-xl-11{grid-column:11/span 12}.col-xl-12.offset-xl-12{grid-column:12/span 12}.col-xl-12.offset-xl-13{grid-column:13/span 12}.col-xl-12.offset-xl-14{grid-column:14/span 12}.col-xl-12.offset-xl-15{grid-column:15/span 12}.col-xl-12.offset-xl-16{grid-column:16/span 12}.col-13,.col-xl-13{grid-column:span 13}.col-xl-13.offset-xl-2{grid-column:2/span 13}.col-xl-13.offset-xl-3{grid-column:3/span 13}.col-xl-13.offset-xl-4{grid-column:4/span 13}.col-xl-13.offset-xl-5{grid-column:5/span 13}.col-xl-13.offset-xl-6{grid-column:6/span 13}.col-xl-13.offset-xl-7{grid-column:7/span 13}.col-xl-13.offset-xl-8{grid-column:8/span 13}.col-xl-13.offset-xl-9{grid-column:9/span 13}.col-xl-13.offset-xl-10{grid-column:10/span 13}.col-xl-13.offset-xl-11{grid-column:11/span 13}.col-xl-13.offset-xl-12{grid-column:12/span 13}.col-xl-13.offset-xl-13{grid-column:13/span 13}.col-xl-13.offset-xl-14{grid-column:14/span 13}.col-xl-13.offset-xl-15{grid-column:15/span 13}.col-xl-13.offset-xl-16{grid-column:16/span 13}.col-14,.col-xl-14{grid-column:span 14}.col-xl-14.offset-xl-2{grid-column:2/span 14}.col-xl-14.offset-xl-3{grid-column:3/span 14}.col-xl-14.offset-xl-4{grid-column:4/span 14}.col-xl-14.offset-xl-5{grid-column:5/span 14}.col-xl-14.offset-xl-6{grid-column:6/span 14}.col-xl-14.offset-xl-7{grid-column:7/span 14}.col-xl-14.offset-xl-8{grid-column:8/span 14}.col-xl-14.offset-xl-9{grid-column:9/span 14}.col-xl-14.offset-xl-10{grid-column:10/span 14}.col-xl-14.offset-xl-11{grid-column:11/span 14}.col-xl-14.offset-xl-12{grid-column:12/span 14}.col-xl-14.offset-xl-13{grid-column:13/span 14}.col-xl-14.offset-xl-14{grid-column:14/span 14}.col-xl-14.offset-xl-15{grid-column:15/span 14}.col-xl-14.offset-xl-16{grid-column:16/span 14}.col-15,.col-xl-15{grid-column:span 15}.col-xl-15.offset-xl-2{grid-column:2/span 15}.col-xl-15.offset-xl-3{grid-column:3/span 15}.col-xl-15.offset-xl-4{grid-column:4/span 15}.col-xl-15.offset-xl-5{grid-column:5/span 15}.col-xl-15.offset-xl-6{grid-column:6/span 15}.col-xl-15.offset-xl-7{grid-column:7/span 15}.col-xl-15.offset-xl-8{grid-column:8/span 15}.col-xl-15.offset-xl-9{grid-column:9/span 15}.col-xl-15.offset-xl-10{grid-column:10/span 15}.col-xl-15.offset-xl-11{grid-column:11/span 15}.col-xl-15.offset-xl-12{grid-column:12/span 15}.col-xl-15.offset-xl-13{grid-column:13/span 15}.col-xl-15.offset-xl-14{grid-column:14/span 15}.col-xl-15.offset-xl-15{grid-column:15/span 15}.col-xl-15.offset-xl-16{grid-column:16/span 15}.col-16,.col-xl-16{grid-column:span 16}.col-xl-16.offset-xl-2{grid-column:2/span 16}.col-xl-16.offset-xl-3{grid-column:3/span 16}.col-xl-16.offset-xl-4{grid-column:4/span 16}.col-xl-16.offset-xl-5{grid-column:5/span 16}.col-xl-16.offset-xl-6{grid-column:6/span 16}.col-xl-16.offset-xl-7{grid-column:7/span 16}.col-xl-16.offset-xl-8{grid-column:8/span 16}.col-xl-16.offset-xl-9{grid-column:9/span 16}.col-xl-16.offset-xl-10{grid-column:10/span 16}.col-xl-16.offset-xl-11{grid-column:11/span 16}.col-xl-16.offset-xl-12{grid-column:12/span 16}.col-xl-16.offset-xl-13{grid-column:13/span 16}.col-xl-16.offset-xl-14{grid-column:14/span 16}.col-xl-16.offset-xl-15{grid-column:15/span 16}.col-xl-16.offset-xl-16{grid-column:16/span 16}}.button,a.button{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:1em;font-weight:700;text-decoration:none;white-space:nowrap;outline:none;width:-webkit-min-content;width:-moz-min-content;width:min-content;background:#26272b;background-image:none;border:1px solid #5d5f69;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;line-height:1;padding:.935rem 1.6rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:visible;text-align:center}.button,.button:focus,.button:hover,a.button,a.button:focus,a.button:hover{color:#fff;-webkit-transition:background .2s,color .2s;transition:background .2s,color .2s}.button:focus,.button:hover,a.button:focus,a.button:hover{background:#2b2d2f;background-image:none}.button:active,a.button:active{color:#fff;background:#26272b}.button:focus,a.button:focus{background:#26272b}.button:focus>[class^=material-icons],.button:focus>i,a.button:focus>[class^=material-icons],a.button:focus>i{color:#10a6fa}.button.active,a.button.active{color:#fff;background:#2f3035;background-image:none;text-decoration:none}.button.active:focus,.button.active:hover,a.button.active:focus,a.button.active:hover{color:#fff;background:#2b2d2f}.button.active [class^=material-icons],.button.active i,a.button.active [class^=material-icons],a.button.active i{color:#fff;text-shadow:none}.button.disabled,.button:disabled,.button[disabled],a.button.disabled,a.button:disabled,a.button[disabled]{cursor:default;opacity:.59;pointer-events:none}.button.block,a.button.block{display:block;width:100%}.button [class^=material-icons],.button i,a.button [class^=material-icons],a.button i{font-size:1.35em;color:#fff;text-shadow:none}.button.primary,a.button.primary{background:#10a6fa;color:#fff;text-shadow:0 1px 1px #0596e7;border:1px solid #33b3fb}.button.primary.active,.button.primary:active,.button.primary:hover,a.button.primary.active,a.button.primary:active,a.button.primary:hover{background:#35b4fb;color:#fff}.button.primary [class^=material-icons],.button.primary i,a.button.primary [class^=material-icons],a.button.primary i{color:#fff;text-shadow:none}.button.success,a.button.success{background:#2abc90;color:#fff;text-shadow:0 1px 1px #24a37d;border:1px solid #37d2a4}.button.success.active,.button.success:active,.button.success:hover,a.button.success.active,a.button.success:active,a.button.success:hover{background:#39d3a5;color:#fff}.button.success [class^=material-icons],.button.success i,a.button.success [class^=material-icons],a.button.success i{color:#fff;text-shadow:none}.button.warning,a.button.warning{background:#b78343;color:#fff;text-shadow:0 1px 1px #a1733b;border:1px solid #c3945b}.button.warning.active,.button.warning:active,.button.warning:hover,a.button.warning.active,a.button.warning:active,a.button.warning:hover{background:#c4955d;color:#fff}.button.warning [class^=material-icons],.button.warning i,a.button.warning [class^=material-icons],a.button.warning i{color:#fff;text-shadow:none}.button.error,a.button.error{background:#d84955;color:#fff;text-shadow:0 1px 1px #d3303d;border:1px solid #de6670}.button.error.active,.button.error:active,.button.error:hover,a.button.error.active,a.button.error:active,a.button.error:hover{background:#df6972;color:#fff}.button.error [class^=material-icons],.button.error i,a.button.error [class^=material-icons],a.button.error i{color:#fff;text-shadow:none}.button.dark,a.button.dark{background:#3a3c42;color:#fff;text-shadow:0 1px 1px #2c2d32;border:1px solid #4b4d55}.button.dark.active,.button.dark:active,.button.dark:hover,a.button.dark.active,a.button.dark:active,a.button.dark:hover{background:#4c4e56;color:#fff}.button.dark [class^=material-icons],.button.dark i,a.button.dark [class^=material-icons],a.button.dark i{color:#fff;text-shadow:none}.button.link.button,.button.link>.button,a.button.link.button,a.button.link>.button{background:transparent;text-shadow:0 1px 1px transparent;border:1px solid;-webkit-box-shadow:none;box-shadow:none;border:none;color:#fff}.button.link.button:hover,.button.link>.button:hover,a.button.link.button:hover,a.button.link>.button:hover{background:hsla(0,0%,7%,0)}.button.link.button.active,.button.link.button:active,.button.link>.button.active,.button.link>.button:active,a.button.link.button.active,a.button.link.button:active,a.button.link>.button.active,a.button.link>.button:active{background:hsla(0,0%,7%,0);color:#fff}.button.link.button [class^=material-icons],.button.link.button i,.button.link>.button [class^=material-icons],.button.link>.button i,a.button.link.button [class^=material-icons],a.button.link.button i,a.button.link>.button [class^=material-icons],a.button.link>.button i{color:#fff;text-shadow:none}.button.link.button:hover,.button.link>.button:hover,a.button.link.button:hover,a.button.link>.button:hover{background:#2f3035;color:#fff}.button.tiny,a.button.tiny{font-size:.809em;padding:.415rem .5rem;font-weight:700}.button.mini,a.button.mini{font-size:.909em;padding:.445rem .9rem;font-weight:700}.button.small,a.button.small{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.button.large,a.button.large{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.button.huge,a.button.huge{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}.button.secondary,a.button.secondary{color:#fff;background-image:-webkit-gradient(linear,left bottom,left top,from(#202125),to(#26272b));background-image:linear-gradient(0deg,#202125 0,#26272b)}.button.secondary.active,.button.secondary:active,.button.secondary:focus,.button.secondary:hover,a.button.secondary.active,a.button.secondary:active,a.button.secondary:focus,a.button.secondary:hover{color:#fff;background-image:-webkit-gradient(linear,left bottom,left top,from(#26272b),to(#202125));background-image:linear-gradient(0deg,#26272b 0,#202125);z-index:1;border-color:#5d5f69}.button.secondary.active [class^=material-icons],.button.secondary.active i,.button.secondary:active [class^=material-icons],.button.secondary:active i,.button.secondary:focus [class^=material-icons],.button.secondary:focus i,.button.secondary:hover [class^=material-icons],.button.secondary:hover i,a.button.secondary.active [class^=material-icons],a.button.secondary.active i,a.button.secondary:active [class^=material-icons],a.button.secondary:active i,a.button.secondary:focus [class^=material-icons],a.button.secondary:focus i,a.button.secondary:hover [class^=material-icons],a.button.secondary:hover i{color:#fff}.buttons{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-negative:0;flex-shrink:0;border-radius:4px;-webkit-box-shadow:0 4px 8px rgba(0,0,0,.2);box-shadow:0 4px 8px rgba(0,0,0,.2)}.buttons .button{-webkit-box-shadow:none;box-shadow:none}.buttons .button:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.buttons .button:not(:first-child):not(:last-child){border-radius:0;margin-left:-1px}.buttons .button:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}.buttons.secondary>.button{color:#fff;background-image:-webkit-gradient(linear,left bottom,left top,from(#202125),to(#26272b));background-image:linear-gradient(0deg,#202125 0,#26272b)}.buttons.secondary>.button.active,.buttons.secondary>.button:active,.buttons.secondary>.button:focus,.buttons.secondary>.button:hover{color:#fff;background-image:-webkit-gradient(linear,left bottom,left top,from(#26272b),to(#202125));background-image:linear-gradient(0deg,#26272b 0,#202125);z-index:1;border-color:#5d5f69}.buttons.secondary>.button.active [class^=material-icons],.buttons.secondary>.button.active i,.buttons.secondary>.button:active [class^=material-icons],.buttons.secondary>.button:active i,.buttons.secondary>.button:focus [class^=material-icons],.buttons.secondary>.button:focus i,.buttons.secondary>.button:hover [class^=material-icons],.buttons.secondary>.button:hover i{color:#fff}.buttons.block{display:-webkit-box;display:-ms-flexbox;display:flex}.buttons.block .button{-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0}.buttons .inactive{padding-left:.45rem!important;padding-right:.45rem!important;pointer-events:none;cursor:default;background-image:none!important}.buttons.tiny>.button,.buttons.tiny>.dropdown>.button{font-size:.809em;padding:.415rem .5rem;font-weight:700}.buttons.mini>.button,.buttons.mini>.dropdown>.button{font-size:.909em;padding:.445rem .9rem;font-weight:700}.buttons.small>.button,.buttons.small>.dropdown>.button{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.buttons.large>.button,.buttons.large>.dropdown>.button{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.buttons.huge>.button,.buttons.huge>.dropdown>.button{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}.buttons.primary>.button,.buttons.primary>.dropdown>.button{background:#10a6fa;color:#fff;text-shadow:0 1px 1px #0596e7;border:1px solid #0592e2}.buttons.primary>.button.active,.buttons.primary>.button:active,.buttons.primary>.button:hover,.buttons.primary>.dropdown>.button.active,.buttons.primary>.dropdown>.button:active,.buttons.primary>.dropdown>.button:hover{background:#35b4fb;color:#fff}.buttons.primary>.button [class^=material-icons],.buttons.primary>.button i,.buttons.primary>.dropdown>.button [class^=material-icons],.buttons.primary>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.success>.button,.buttons.success>.dropdown>.button{background:#2abc90;color:#fff;text-shadow:0 1px 1px #24a37d;border:1px solid #239f7a}.buttons.success>.button.active,.buttons.success>.button:active,.buttons.success>.button:hover,.buttons.success>.dropdown>.button.active,.buttons.success>.dropdown>.button:active,.buttons.success>.dropdown>.button:hover{background:#39d3a5;color:#fff}.buttons.success>.button [class^=material-icons],.buttons.success>.button i,.buttons.success>.dropdown>.button [class^=material-icons],.buttons.success>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.warning>.button,.buttons.warning>.dropdown>.button{background:#b78343;color:#fff;text-shadow:0 1px 1px #a1733b;border:1px solid #9d7039}.buttons.warning>.button.active,.buttons.warning>.button:active,.buttons.warning>.button:hover,.buttons.warning>.dropdown>.button.active,.buttons.warning>.dropdown>.button:active,.buttons.warning>.dropdown>.button:hover{background:#c4955d;color:#fff}.buttons.warning>.button [class^=material-icons],.buttons.warning>.button i,.buttons.warning>.dropdown>.button [class^=material-icons],.buttons.warning>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.error>.button,.buttons.error>.dropdown>.button{background:#d84955;color:#fff;text-shadow:0 1px 1px #d3303d;border:1px solid #d12d3a}.buttons.error>.button.active,.buttons.error>.button:active,.buttons.error>.button:hover,.buttons.error>.dropdown>.button.active,.buttons.error>.dropdown>.button:active,.buttons.error>.dropdown>.button:hover{background:#df6972;color:#fff}.buttons.error>.button [class^=material-icons],.buttons.error>.button i,.buttons.error>.dropdown>.button [class^=material-icons],.buttons.error>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.dark>.button,.buttons.dark>.dropdown>.button{background:#3a3c42;color:#fff;text-shadow:0 1px 1px #2c2d32;border:1px solid #2a2b2f}.buttons.dark>.button.active,.buttons.dark>.button:active,.buttons.dark>.button:hover,.buttons.dark>.dropdown>.button.active,.buttons.dark>.dropdown>.button:active,.buttons.dark>.dropdown>.button:hover{background:#4c4e56;color:#fff}.buttons.dark>.button [class^=material-icons],.buttons.dark>.button i,.buttons.dark>.dropdown>.button [class^=material-icons],.buttons.dark>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.link.button,.buttons.link>.button{background:transparent;text-shadow:0 1px 1px transparent;border:1px solid;-webkit-box-shadow:none;box-shadow:none;border:none;color:#fff}.buttons.link.button:hover,.buttons.link>.button:hover{background:hsla(0,0%,7%,0)}.buttons.link.button.active,.buttons.link.button:active,.buttons.link>.button.active,.buttons.link>.button:active{background:hsla(0,0%,7%,0);color:#fff}.buttons.link.button [class^=material-icons],.buttons.link.button i,.buttons.link>.button [class^=material-icons],.buttons.link>.button i{color:#fff;text-shadow:none}.buttons.link.button:hover,.buttons.link>.button:hover{background:#2f3035;color:#fff}.buttons .dropdown:last-child:not(:first-child),.buttons .dropdown:last-child:not(:first-child)>.button{border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}.buttons .dropdown:last-child,.buttons .dropdown:last-child>.button:first-child,.buttons .dropdown:last-child>.button:last-child{border-bottom-right-radius:4px;border-top-right-radius:4px}.buttons .dropdown:not(:first-child):not(:last-child)>.button{border-radius:0;margin-left:-1px}@media only screen and (max-width:768px){.buttons{-webkit-box-shadow:none;box-shadow:none}}.buttons.vertical{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column}.buttons.vertical.block,.buttons.vertical.block>.button,.buttons.vertical>.button,.buttons.vertical>.dropdown>.button{width:100%}.buttons.vertical>.button{border-radius:0}.buttons.vertical>.button:last-child:not(:first-child),.buttons.vertical>.button:not(:first-child):not(:last-child){margin:-1px 0 0}.buttons.vertical.block{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.buttons.vertical>.dropdown:last-child:not(:first-child),.buttons.vertical>.dropdown:last-child:not(:first-child)>.button,.buttons.vertical>.dropdown:not(:first-child):not(:last-child)>.button{margin:-1px 0 0;border-radius:0}.buttons.vertical>.dropdown>.primary.button,.buttons.vertical>.primary.button{border:1px solid #0596e7}.buttons.vertical>.dropdown>.success.button,.buttons.vertical>.success.button{border:1px solid #24a37d}.buttons.vertical>.dropdown>.warning.button,.buttons.vertical>.warning.button{border:1px solid #a1733b}.buttons.vertical>.dropdown>.error.button,.buttons.vertical>.error.button{border:1px solid #d3303d}.buttons.vertical>.dark.button,.buttons.vertical>.dropdown>.dark.button{border:1px solid #2c2d32}.dropdown{display:inline-block;position:relative}.dropdown>.menu{-webkit-animation:slide-down .15s ease 1;animation:slide-down .15s ease 1;display:none;left:0;max-height:45vh;overflow-y:auto;position:absolute;top:100%;z-index:301;width:auto}.dropdown>.menu>.item>a{padding:.1rem .9rem}.dropdown.left>.menu,.dropdown.right>.menu{top:0}.dropdown.right>.menu{left:100%;right:auto}.dropdown.left>.menu{left:auto;right:100%}.dropdown.top.left>.menu{right:auto!important;left:0!important}.dropdown.top.right>.menu{right:0!important;left:auto!important}.dropdown.top>.menu{bottom:100%;top:auto;right:0;left:auto;-webkit-box-shadow:0 -3px 10px rgba(0,0,0,.15);box-shadow:0 -3px 10px rgba(0,0,0,.15)}.dropdown.bottom.left>.menu,.dropdown.bottom.right>.menu{top:100%}.dropdown.bottom.left>.menu{right:auto!important;left:0!important}.dropdown.bottom.right>.menu{right:0!important;left:auto!important}.dropdown.active>.menu,.dropdown>.menu:focus,.dropdown>.menu:hover,.dropdown>.toggle:focus+.menu,.dropdown>.toggle:hover+.menu{display:block}.dropdown.clickable>.toggle:hover+.menu{display:none}.dropdown.clickable>.toggle:active+.menu,.dropdown.clickable>.toggle:focus+.menu{display:block}.dropdown>.buttons>.toggle:nth-last-child(2){border-bottom-right-radius:4px;border-top-right-radius:4px}.dropdown.tiny>.button,.dropdown.tiny>.dropdown>.button{font-size:.809em;padding:.415rem .5rem;font-weight:700}.dropdown.mini>.button,.dropdown.mini>.dropdown>.button{font-size:.909em;padding:.445rem .9rem;font-weight:700}.dropdown.small>.button,.dropdown.small>.dropdown>.button{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.dropdown.large>.button,.dropdown.large>.dropdown>.button{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.dropdown.huge>.button,.dropdown.huge>.dropdown>.button{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}input:not([type]),input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=file],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{-webkit-appearance:none;background-color:#3a3c42;border:1px solid #646771;height:2.5rem;border-radius:0;outline:2px solid transparent;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:inherit;box-sizing:inherit;outline-offset:-2px;padding:.4rem .5rem;width:100%;max-width:100%;font-family:inherit;color:#fff;font-size:1.088em}input:not([type]):focus,input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=file]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select:focus,textarea:focus{outline:2px solid #fff;outline-offset:-2px;-webkit-transition:.35s;transition:.35s}input:not([type]).success,input[type=color].success,input[type=date].success,input[type=datetime-local].success,input[type=datetime].success,input[type=email].success,input[type=file].success,input[type=month].success,input[type=number].success,input[type=password].success,input[type=search].success,input[type=tel].success,input[type=text].success,input[type=time].success,input[type=url].success,input[type=week].success,select.success,textarea.success{color:#2abc90;outline-color:#2abc90}input:not([type]).error,input[type=color].error,input[type=date].error,input[type=datetime-local].error,input[type=datetime].error,input[type=email].error,input[type=file].error,input[type=month].error,input[type=number].error,input[type=password].error,input[type=search].error,input[type=tel].error,input[type=text].error,input[type=time].error,input[type=url].error,input[type=week].error,select.error,textarea.error{color:#d84955;outline-color:#d84955}select{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTE2LjU5IDguNTlMMTIgMTMuMTcgNy40MSA4LjU5IDYgMTBsNiA2IDYtNnoiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:right 10px center}select[multiple]{background:none;height:auto}textarea{min-height:6.5rem;resize:vertical}label,legend{display:block;font-size:1rem;font-weight:400}fieldset{border-width:0;padding:0}input[type=checkbox],input[type=radio]{display:inline}input:disabled{opacity:.59}.form{position:relative;max-width:100%;padding:0 16px}.form .item{margin:6px 0 .75em;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;width:100%;max-width:100%;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.form .item,.form .item>label,.form label{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.form .item>label,.form label{margin:0;color:#fff;font-size:.8579rem;font-weight:700;text-transform:none}.form .item>input[type=file]{opacity:0;position:absolute;top:0;left:0;height:100%;cursor:default}.form .group,.form .item>.group{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}.form .group>*,.form .item>.group>*{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}.form .group>:last-child,.form .item>.group>:last-child{margin-left:-1px}.form .group>:not(:first-child):not(:last-child),.form .item>.group>:not(:first-child):not(:last-child){margin-left:-1px;margin-right:0}.form .group>.buttons,.form .item>.group>.buttons{-webkit-box-shadow:none;box-shadow:none}.form .group>.button,.form .item>.group>.button{height:2.5rem;-webkit-box-shadow:none;box-shadow:none}.form .group>.button:first-child,.form .item>.group>.button:first-child{border-bottom-right-radius:0;border-top-right-radius:0}.form .group>.button:last-child:not(:first-child),.form .item>.group>.button:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.form .items{margin:6px 0 .75em;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form .items>.item{margin:6px 6px .75em}.form .two.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.5 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.5 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .two.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .three.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.333333333333333 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.333333333333333 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .three.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .four.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.25 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.25 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .four.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .five.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.2 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.2 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .five.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .six.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.166666666666667 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.166666666666667 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .six.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .seven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.142857142857143 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.142857142857143 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .seven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .eight.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.125 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.125 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .eight.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .nine.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.111111111111111 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.111111111111111 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .nine.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .ten.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.1 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.1 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .ten.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .eleven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.090909090909091 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.090909090909091 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .eleven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .twelve.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.083333333333333 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.083333333333333 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .twelve.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .thirteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.076923076923077 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.076923076923077 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .thirteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .fourteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.071428571428571 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.071428571428571 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .fourteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .fifteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.066666666666667 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.066666666666667 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .fifteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .sixteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.0625 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.0625 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .sixteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form.small input:not([type]),.form.small input[type=color],.form.small input[type=date],.form.small input[type=datetime-local],.form.small input[type=datetime],.form.small input[type=email],.form.small input[type=file],.form.small input[type=month],.form.small input[type=number],.form.small input[type=password],.form.small input[type=search],.form.small input[type=tel],.form.small input[type=text],.form.small input[type=time],.form.small input[type=url],.form.small input[type=week],.form.small select,.form.small textarea{height:1.9rem;font-size:1em}.form.small .button{height:1.9rem!important;font-size:.979em!important;padding:.645rem 1.4rem!important}.form.small>.item>label,.form.small>.items>.item>label,.form.small label{font-size:1em}.form.large input:not([type]),.form.large input[type=color],.form.large input[type=date],.form.large input[type=datetime-local],.form.large input[type=datetime],.form.large input[type=email],.form.large input[type=file],.form.large input[type=month],.form.large input[type=number],.form.large input[type=password],.form.large input[type=search],.form.large input[type=tel],.form.large input[type=text],.form.large input[type=time],.form.large input[type=url],.form.large input[type=week],.form.large select,.form.large textarea{height:2.9rem;font-size:1.2em}.form.large .button{height:2.9rem!important;font-size:1.25em!important;padding:1.15rem 2.1rem!important}.form.large>.item>label,.form.large>.items>.item>label,.form.large label{font-size:1.2em}.checkbox,.radio{position:relative}.checkbox label,.radio label{padding:0 1.2rem 0 1.7rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:400;margin:0}.checkbox input,.radio input{left:0;opacity:0;position:absolute;top:0}.checkbox input+label:after,.checkbox input+label:before,.radio input+label:after,.radio input+label:before{position:absolute;-webkit-transition:opacity .11s ease-in-out;transition:opacity .11s ease-in-out;font-family:Material Icons;font-style:normal;font-weight:400;text-transform:none;font-size:1.35rem;top:-8px;left:0}.checkbox input+label:before,.radio input+label:before{opacity:1}.checkbox input+label:after,.radio input+label:after{opacity:0}.checkbox input:checked+label:after,.radio input:checked+label:after{opacity:1}.checkbox input+label:before{content:"check_box_outline_blank";color:#fff}.checkbox input+label:after{content:"check_box";color:#10a6fa}.radio input+label:before{content:"radio_button_unchecked";color:#fff}.radio input+label:after{content:"radio_button_checked";color:#10a6fa}h1{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h1,h1{font-size:2rem;font-weight:900}@media only screen and (max-width:768px){.h1,h1{font-size:1.7rem}}h2{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h2,h2{font-size:1.8rem;font-weight:900}@media only screen and (max-width:768px){.h2,h2{font-size:1.5rem}}h3{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h3,h3{font-size:1.6rem;font-weight:900}@media only screen and (max-width:768px){.h3,h3{font-size:1.3rem}}h4{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h4,h4{font-size:1.4rem;font-weight:900}@media only screen and (max-width:768px){.h4,h4{font-size:1.1rem}}h5{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h5,h5{font-size:1.2rem;font-weight:900}@media only screen and (max-width:768px){.h5,h5{font-size:.9rem}}h6{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h6,h6{font-size:1rem;font-weight:900}@media only screen and (max-width:768px){.h6,h6{font-size:inherit}}.h1.bordered,.h2.bordered,.h3.bordered,.h4.bordered,.h5.bordered,.h6.bordered,h1.bordered,h2.bordered,h3.bordered,h4.bordered,h5.bordered,h6.bordered{border-width:0 0 1px!important;padding-bottom:10px;margin-bottom:20px}p{margin:0 0 1em;font-size:1.0495rem}a,ins,u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}abbr[title]{border-bottom:1px dotted;cursor:help;text-decoration:none}blockquote{border-left:.1rem dotted #3a3c42;margin-left:0;padding:.4rem .8rem;font-style:italic;color:#fff}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}.table{position:relative;border-collapse:collapse;border-spacing:0;width:100%;max-width:100%;text-align:left;margin-bottom:1.5rem}.table.striped tbody tr.active,.table.striped tbody tr:nth-of-type(odd),.table.striped tr.active,.table.striped tr:nth-of-type(odd){background:#2b2d2f}.table.striped thead tr{background:transparent!important}.table.hovered tbody tr:hover,.table.hovered tr:hover{background:#2b2d2f;color:#fff}.table.hovered thead tr{background:transparent!important}.table tbody tr,.table tr{-webkit-transition:all .3s;transition:all .3s}.table tbody tr.active,.table tbody tr.active:hover,.table tr.active,.table tr.active:hover{background:#2b2d2f}.table td,.table th{border-bottom:1px solid #2b2d2f;padding:5px 7px;text-align:inherit}.table thead tr{background:transparent}.table thead tr th{border-bottom-width:1px;border-bottom-color:#5d5f69;font-weight:400;color:#6c6e79}.material-icons{font-size:1.1rem;line-height:1;vertical-align:middle}.label,a.label{background-color:#26272b;color:#fff;display:inline-block;font-weight:700;line-height:1.2;margin:.1rem .05rem;border-radius:4px;text-decoration:none;border:1px solid #5d5f69;-webkit-box-shadow:0 .155em 0 rgba(0,0,0,.095);box-shadow:0 .155em 0 rgba(0,0,0,.095);border-color:#5d5f69;padding:.28rem .9rem;font-size:.9195em}.label>.material-icons,.label>i,a.label>.material-icons,a.label>i{vertical-align:text-top}.label.primary,a.label.primary{background-color:#10a6fa;color:#fff;border-color:#0592e2}.label.success,a.label.success{background-color:#2abc90;color:#fff;border-color:#239f7a}.label.warning,a.label.warning{background-color:#b78343;color:#fff;border-color:#9d7039}.label.error,a.label.error{background-color:#d84955;color:#fff;border-color:#d12d3a}.label.dark,a.label.dark{background-color:#3a3c42;color:#fff;border-color:#2a2b2f}.label.small,a.label.small{padding:.18rem .85rem;font-size:.8195em}.label.large,a.label.large{padding:.415rem 1.159rem;font-size:1em}.alert{color:#fff;display:block;border:1px solid #5d5f69;border-radius:4px;padding:.6rem;margin:0 0 8px;width:100%;font-weight:700}.alert a{color:#fff;text-decoration:underline}.alert a.active,.alert a:active,.alert a:focus,.alert a:hover{opacity:.75}.alert p:last-child{margin-bottom:0}.alert>.material-icons,.alert>i{vertical-align:text-top}.alert.primary{background-color:#10a6fa;color:#fff;border-color:#0599ec}.alert.success{background-color:#2abc90;color:#fff;border-color:#25a780}.alert.warning{background-color:#b78343;color:#fff;border-color:#a4763c}.alert.error{background-color:#d84955;color:#fff;border-color:#d43441}.alert.dark{background-color:#3a3c42;color:#fff;border-color:#2e3034}.alert.small{padding:.4rem;font-size:.749rem}.alert.large{padding:.8rem;font-size:1.1rem}.badge{background-color:#26272b;color:#fff;position:relative;white-space:nowrap;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-weight:700;border-radius:500px;padding:1px 6px;font-size:.854rem}.badge.primary{background-color:#10a6fa;color:#fff}.badge.success{background-color:#2abc90;color:#fff}.badge.warning{background-color:#b78343;color:#fff}.badge.error{background-color:#d84955;color:#fff}.badge.dark{background-color:#3a3c42;color:#fff}.badge.tiny{padding:0 4px;font-size:.659rem}.badge.small{padding:1px 4px;font-size:.749rem}.badge.large{padding:2px 8px;font-size:1.1rem}.billboard{background-color:#26272b;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:4.5rem 2.5rem;border-color:#1b1c1f;border:1px solid #5d5f69}.billboard.primary{background-color:#10a6fa;color:#fff;border-color:#059aee}.billboard.success{background-color:#2abc90;color:#fff;border-color:#26a982}.billboard.warning{background-color:#b78343;color:#fff;border-color:#a6773d}.billboard.error{background-color:#d84955;color:#fff;border-color:#d43643}.billboard.dark{background-color:#3a3c42;color:#fff;border-color:#303136}.billboard.small{font-size:1em}.billboard.small,.billboard.small .body{padding:2.5rem 1.5rem}.billboard.small p{font-size:1em}.billboard.large{font-size:1.6em}.billboard.large,.billboard.large .body{padding:7.5rem 4rem}.billboard.large p{font-size:1.6em}.billboard .media{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.billboard .body{padding:4.5rem 2.5rem;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.cover{min-height:100vh;max-height:100%;min-width:100%;border:0;background-size:cover;background-position:50%;background-repeat:no-repeat}@media only screen and (max-width:768px){.billboard{padding:2.5rem 1rem;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.billboard .media img{width:100%}.billboard .body{padding:2.5rem 1rem}.billboard.small,.billboard.small .body{padding:1rem}.billboard.small p{font-size:1em}.billboard.large,.billboard.large .body{padding:1rem}.billboard.large p{font-size:1.358em}}.breadcrumb{display:inline-block;white-space:nowrap}.breadcrumb .item,.breadcrumb a.item{text-decoration:none;font-size:inherit;font-weight:600}.breadcrumb .item.active,.breadcrumb .item:active,.breadcrumb .item:focus,.breadcrumb .item:hover,.breadcrumb a.item.active,.breadcrumb a.item:active,.breadcrumb a.item:focus,.breadcrumb a.item:hover{color:#10a6fa}.breadcrumb .item:after,.breadcrumb a.item:after{font-family:Material Icons;content:"keyboard_arrow_right";color:#10a6fa;padding:0 .25em;vertical-align:middle;font-size:1.4rem;cursor:auto}.breadcrumb .item:first-child,.breadcrumb a.item:first-child{margin-left:0}.breadcrumb .item.active,.breadcrumb a.item.active{color:#10a6fa;font-weight:700}.breadcrumb .item.active:after,.breadcrumb a.item.active:after{content:none}.breadcrumb.small .item{font-size:.9589em}.breadcrumb.small .item:after{padding:.15em;font-size:1.25rem}.breadcrumb.large .item{font-size:1.18em}.breadcrumb.large .item:after{padding:.18em;font-size:1.7rem}@media only screen and (max-width:768px){.breadcrumb .item:after{font-size:1rem;vertical-align:middle}}.cards{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.cards.two>.card{-ms-flex:0 0 calc(100% * 0.5 - 20px);flex:0 0 calc(100% * 0.5 - 20px)}.cards.three>.card,.cards.two>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.three>.card{-ms-flex:0 0 calc(100% * 0.333333333333333 - 20px);flex:0 0 calc(100% * 0.333333333333333 - 20px)}.cards.four>.card{-ms-flex:0 0 calc(100% * 0.25 - 20px);flex:0 0 calc(100% * 0.25 - 20px)}.cards.five>.card,.cards.four>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.five>.card{-ms-flex:0 0 calc(100% * 0.2 - 20px);flex:0 0 calc(100% * 0.2 - 20px)}.cards.six>.card{-ms-flex:0 0 calc(100% * 0.166666666666667 - 20px);flex:0 0 calc(100% * 0.166666666666667 - 20px)}.cards.seven>.card,.cards.six>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.seven>.card{-ms-flex:0 0 calc(100% * 0.142857142857143 - 20px);flex:0 0 calc(100% * 0.142857142857143 - 20px)}.cards.eight>.card{-ms-flex:0 0 calc(100% * 0.125 - 20px);flex:0 0 calc(100% * 0.125 - 20px)}.cards.eight>.card,.cards.nine>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.nine>.card{-ms-flex:0 0 calc(100% * 0.111111111111111 - 20px);flex:0 0 calc(100% * 0.111111111111111 - 20px)}.cards.ten>.card{-ms-flex:0 0 calc(100% * 0.1 - 20px);flex:0 0 calc(100% * 0.1 - 20px)}.cards.eleven>.card,.cards.ten>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.eleven>.card{-ms-flex:0 0 calc(100% * 0.090909090909091 - 20px);flex:0 0 calc(100% * 0.090909090909091 - 20px)}.cards.twelve>.card{-ms-flex:0 0 calc(100% * 0.083333333333333 - 20px);flex:0 0 calc(100% * 0.083333333333333 - 20px)}.cards.thirteen>.card,.cards.twelve>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.thirteen>.card{-ms-flex:0 0 calc(100% * 0.076923076923077 - 20px);flex:0 0 calc(100% * 0.076923076923077 - 20px)}.cards.fourteen>.card{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.071428571428571 - 20px);flex:0 0 calc(100% * 0.071428571428571 - 20px);height:auto;margin:10px}.cards.fifteen>.card{-ms-flex:0 0 calc(100% * 0.066666666666667 - 20px);flex:0 0 calc(100% * 0.066666666666667 - 20px)}.cards.fifteen>.card,.cards.sixteen>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.sixteen>.card{-ms-flex:0 0 calc(100% * 0.0625 - 20px);flex:0 0 calc(100% * 0.0625 - 20px)}.card{background-color:#26272b;border:1px solid #5d5f69;border-radius:4px;-webkit-box-shadow:0 4px 8px rgba(0,0,0,.2);box-shadow:0 4px 8px rgba(0,0,0,.2);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:240px;height:100%;overflow:hidden}.card .title,.card>.body .title{color:#fff;line-height:normal}.card .title>.subtitle,.card>.body .title>.subtitle{color:#6c6e79;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}.card .actions,.card .description,.card .title{padding:16px}.card .description{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;color:#fff}.card>.media{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.card>.media img{display:block;width:100%}.card>.media.two{padding-bottom:0!important;height:auto}.card>.media.two>a,.card>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.three{padding-bottom:0!important;height:auto}.card>.media.three>a,.card>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.four{padding-bottom:0!important;height:auto}.card>.media.four>a,.card>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.five{padding-bottom:0!important;height:auto}.card>.media.five>a,.card>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.six{padding-bottom:0!important;height:auto}.card>.media.six>a,.card>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.seven{padding-bottom:0!important;height:auto}.card>.media.seven>a,.card>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.eight{padding-bottom:0!important;height:auto}.card>.media.eight>a,.card>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.nine{padding-bottom:0!important;height:auto}.card>.media.nine>a,.card>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.ten{padding-bottom:0!important;height:auto}.card>.media.ten>a,.card>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.eleven{padding-bottom:0!important;height:auto}.card>.media.eleven>a,.card>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.twelve{padding-bottom:0!important;height:auto}.card>.media.twelve>a,.card>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.thirteen{padding-bottom:0!important;height:auto}.card>.media.thirteen>a,.card>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.fourteen{padding-bottom:0!important;height:auto}.card>.media.fourteen>a,.card>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.fifteen{padding-bottom:0!important;height:auto}.card>.media.fifteen>a,.card>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.sixteen{padding-bottom:0!important;height:auto}.card>.media.sixteen>a,.card>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card.horizontal{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:15px}.card.horizontal>.media{-ms-flex-item-align:normal;align-self:normal;width:100%}.card.horizontal>.media img{width:auto;-o-object-fit:cover;object-fit:cover}.card.horizontal>.body{-webkit-box-flex:inherit;-ms-flex:inherit;flex:inherit}.card.horizontal>.body .description,.card.horizontal>.body .title{padding:8px 16px}.card.horizontal>.body .description{-webkit-box-flex:1;-ms-flex:1;flex:1}@media only screen and (max-width:768px){.card,.cards>.card{-webkit-box-flex:0!important;-ms-flex:0 0 100%!important;flex:0 0 100%!important;width:100%;height:-webkit-fit-content!important;height:-moz-fit-content!important;height:fit-content!important}.card.horizontal{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.list{list-style:none;margin:1rem 0}.list>.item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:.55em;margin:0;-webkit-transition:.15s;transition:.15s}.list>.item>.material-icons,.list>.item>i,.list>.item>img{margin-right:1rem}.list>.item>.body{-webkit-box-flex:1;-ms-flex:1;flex:1;line-height:1.4;text-align:left}.list>.item>.body>.subtitle,.list>.item>.body>.title{display:block}.list>.item>.body>.title{font-size:1.28rem;font-weight:900;line-height:1}.list>.item>.body>.subtitle{font-size:.889em;font-weight:400;color:#10a6fa;margin-bottom:7px}.list>.item>.actions{margin-left:auto;width:auto;margin-left:1rem}.list>.item.active{background:#0c0c0d}.list.divided>.item{border-bottom:1px solid #5d5f69}.list.divided>.item:last-child{border-bottom:none}.list.striped>.item:nth-of-type(odd){background:#2b2d2f}.list.hovered>.item:hover{background:#2b2d2f;-webkit-transition:.15s;transition:.15s}.menu{background-color:#26272b;border-radius:0;list-style:none;margin:0;width:100%;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;padding:.9rem;-webkit-box-shadow:0 7px 10px rgba(0,0,0,.15);box-shadow:0 7px 10px rgba(0,0,0,.15);z-index:300}.menu .title{font-size:1.25em;min-height:2rem;color:#fff;padding:.6rem 0;font-weight:700;letter-spacing:-.015rem}.menu .item{padding:0;position:relative;text-decoration:none;text-align:left}.menu .item>a{display:block;width:100%;padding:.28rem .9rem;text-decoration:none;font-size:1em;font-weight:600}.menu .item>a,.menu .item>a:hover{color:#fff;-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.menu .item>a:hover{background:#0c0c0d}.menu .item>a.active,.menu .item>a:active,.menu .item>a:focus{background:#0c0c0d;color:#fff;-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.menu .item i,.menu .item span.material-icons{color:#6c6e79;font-size:1.2rem;margin-right:10px;vertical-align:text-bottom}.menu .item .menu{padding:.4rem}.menu .badge{position:absolute;right:0;top:4px;padding:0 4px;font-size:.93em}.menu.small>.item a{font-size:.879em}.menu.divided .item{border-bottom:1px solid #2f3035}.menu.divided .item:last-child{border-bottom:none}.navbar{-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;min-height:80px;background:#0592e2;color:#fff}.navbar,.navbar .container{width:100%}.navbar,.navbar .brand,.navbar .container{display:-webkit-box;display:-ms-flexbox;display:flex}.navbar .brand{padding:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:1rem}.navbar .brand img{max-height:60px;padding:8px}.navbar .brand a,.navbar .brand a:visited{font-size:1.1em;text-decoration:none;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;font-weight:700}.navbar .burger,.navbar input[type=checkbox]#burger{display:none}.navbar .burger:before{content:"dehaze";font-family:Material Icons;font-size:2.459rem;display:none;min-height:80px;min-width:80px;position:absolute;cursor:pointer;right:0;top:0}.navbar section.links,.navbar section.links div.section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.navbar section.links div.section{height:100%}.navbar section.links div.section:not(:first-child):last-child{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.navbar section.links div.section input[type=text]{background-color:#0592e2;color:#fff;border-color:#38b5fb}.navbar section.links div.section input[type=text]::-webkit-input-placeholder{color:#fff}.navbar section.links div.section input[type=text]::-moz-placeholder{color:#fff}.navbar section.links div.section input[type=text]::-ms-input-placeholder{color:#fff}.navbar section.links div.section input[type=text]::placeholder{color:#fff}.navbar section.links div.section input[type=text]:focus{outline:2px solid #92d6fd}.navbar.fixed{position:fixed;top:0;left:0;right:0;margin-top:0;-webkit-transform:translateY(0);transform:translateY(0);z-index:5}.navbar .buttons{height:100%;min-height:100%;-webkit-box-shadow:none;box-shadow:none}.navbar .buttons .button{background:transparent;border-color:transparent;border:none;color:#fff;min-height:100%}.navbar .buttons .button i,.navbar .buttons .button span.material-icons{color:#fff}.navbar .button,.navbar .dropdown .button{font-size:1.1em;padding:.935rem 1.4rem;font-weight:700}.navbar.light{background:#fff;color:#000}.navbar.light .buttons .button{color:#000;min-height:100%}.navbar.light .brand a,.navbar.light .brand a:visited,.navbar.light .buttons .button i,.navbar.light .buttons .button span.material-icons{color:#000}.navbar.light section.links div.section input[type=text]{background-color:#fff;border-color:#3a3c42;color:#000}.navbar.light section.links div.section input[type=text]::-webkit-input-placeholder{color:#000}.navbar.light section.links div.section input[type=text]::-moz-placeholder{color:#000}.navbar.light section.links div.section input[type=text]::-ms-input-placeholder{color:#000}.navbar.light section.links div.section input[type=text]::placeholder{color:#000}.navbar.light section.links div.section input[type=text]:focus{outline:2px solid #595c65}.navbar.dark{background:#2e3034;color:#fff}.navbar.dark .buttons .button{color:#fff;min-height:100%}.navbar.dark .brand a,.navbar.dark .brand a:visited,.navbar.dark .buttons .button i,.navbar.dark .buttons .button span.material-icons{color:#fff}.navbar.dark section.links div.section input[type=text]{background-color:#4b4d55;border-color:#636670;color:#fff}.navbar.dark section.links div.section input[type=text]::-webkit-input-placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]::-moz-placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]::-ms-input-placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]::placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]:focus{outline:2px solid #838692}.navbar-spacer{margin-top:100px}@media only screen and (max-width:768px){.navbar-spacer{margin-top:0}.navbar .container{padding:0}.navbar.fixed{position:relative}.navbar section.links{position:absolute;display:block;width:100%;height:0;top:80px;left:0;overflow-x:auto;overflow-y:hidden;background:#2b2d2f;z-index:1;margin:0!important;padding:0!important;-webkit-box-shadow:0 4px 8px rgba(0,0,0,.2);box-shadow:0 4px 8px rgba(0,0,0,.2)}.navbar section.links .section,.navbar section.links .section .buttons,.navbar section.links .section .buttons .button,.navbar section.links .section .buttons .dropdown,.navbar section.links .section .buttons .dropdown .button,.navbar section.links .section .buttons .dropdown .menu,.navbar section.links .section .buttons .dropdown .menu .button{display:block!important;width:100%;text-align:left;position:relative}.navbar section.links .section .buttons .button,.navbar section.links .section .buttons .dropdown .button{color:#fff}.navbar section.links .section .buttons .button i,.navbar section.links .section .buttons .button span.material-icons,.navbar section.links .section .buttons .dropdown .button i,.navbar section.links .section .buttons .dropdown .button span.material-icons{display:none}.navbar section.links .section .buttons .dropdown .menu{max-height:100%;-webkit-box-shadow:none;box-shadow:none}.navbar .burger{min-height:80px;min-width:80px}.navbar .burger,.navbar .burger:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.navbar .burger:before{content:"close"}.navbar input[type=checkbox]#burger:not(:checked)~section.links{height:0}.navbar input[type=checkbox]#burger:checked~section.links{height:auto}.navbar input[type=checkbox]#burger:not(:checked)~.burger:before{content:"dehaze"}.navbar input[type=checkbox]#burger:checked~.burger:before{content:"close"}}.panel{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;border:1px solid #5d5f69;border-radius:4px;-webkit-box-shadow:0 4px 8px rgba(0,0,0,.2);box-shadow:0 4px 8px rgba(0,0,0,.2);background-color:#26272b;margin:16px 0}.panel,.panel>.bottom,.panel>.header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal}.panel>.bottom,.panel>.header{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.panel>.bottom .actions,.panel>.header .actions{margin-left:auto}.panel>.bottom .actions:before,.panel>.header .actions:before{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.panel>.header{border-bottom:1px solid #5d5f69;padding:12px 16px}.panel>.header.dashed{border-bottom-style:dashed}.panel>.header.dotted{border-bottom-style:dotted}.panel>.header .title{font-size:1.185rem;font-weight:900}.panel>.content{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:16px;height:auto}.panel>.content>.media{min-width:0;-webkit-box-flex:1;-ms-flex:auto;flex:auto;margin-bottom:32px;-ms-flex-wrap:wrap;flex-wrap:wrap;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;padding-bottom:56.25%!important;height:0;overflow:hidden;max-width:100%;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.panel>.content>.media embed,.panel>.content>.media iframe,.panel>.content>.media object{position:absolute;top:0;left:0;width:100%;height:100%}.panel>.content>.media video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.panel>.content>.media img{display:block}.panel>.content>.media.two{padding-bottom:0!important;height:auto}.panel>.content>.media.two>a,.panel>.content>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.three{padding-bottom:0!important;height:auto}.panel>.content>.media.three>a,.panel>.content>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.four{padding-bottom:0!important;height:auto}.panel>.content>.media.four>a,.panel>.content>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.five{padding-bottom:0!important;height:auto}.panel>.content>.media.five>a,.panel>.content>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.six{padding-bottom:0!important;height:auto}.panel>.content>.media.six>a,.panel>.content>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.seven{padding-bottom:0!important;height:auto}.panel>.content>.media.seven>a,.panel>.content>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.eight{padding-bottom:0!important;height:auto}.panel>.content>.media.eight>a,.panel>.content>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.nine{padding-bottom:0!important;height:auto}.panel>.content>.media.nine>a,.panel>.content>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.ten{padding-bottom:0!important;height:auto}.panel>.content>.media.ten>a,.panel>.content>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.eleven{padding-bottom:0!important;height:auto}.panel>.content>.media.eleven>a,.panel>.content>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.twelve{padding-bottom:0!important;height:auto}.panel>.content>.media.twelve>a,.panel>.content>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.thirteen{padding-bottom:0!important;height:auto}.panel>.content>.media.thirteen>a,.panel>.content>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.fourteen{padding-bottom:0!important;height:auto}.panel>.content>.media.fourteen>a,.panel>.content>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.fifteen{padding-bottom:0!important;height:auto}.panel>.content>.media.fifteen>a,.panel>.content>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.sixteen{padding-bottom:0!important;height:auto}.panel>.content>.media.sixteen>a,.panel>.content>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content .headline,.panel>.content p.headline{font-size:1.39em;line-height:1.5;margin-bottom:26px;color:#d6d6d6;letter-spacing:-.0158em}.panel>.bottom{min-height:50px;border-top:1px solid #5d5f69;padding:6px}.process{-ms-flex-wrap:nowrap;flex-wrap:nowrap;margin:1em 0 5em;width:100%;list-style:none}.process,.process .item{display:-webkit-box;display:-ms-flexbox;display:flex}.process .item{-webkit-box-flex:1;-ms-flex:1 1 0px;flex:1 1 0;min-height:4rem;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;word-break:break-word;line-height:1.3;text-align:center}.process .item:not(:first-child):before{background:#10a6fa;content:"";height:6px;left:-50%;position:absolute;top:0;width:100%}.process .item a{color:#fff;display:inline-block;padding:10px 10px 0;text-decoration:none;font-weight:700}.process .item a:before{position:absolute;content:"";background:#10a6fa;top:0;left:50%;height:.8rem;width:3px;z-index:1}.process .item a:first-child:before{left:calc(50% - 2px)}.process .item.active a{color:#10a6fa;font-weight:700}.process .item.active a:after{content:"beenhere";font-family:Material Icons;position:absolute;top:calc(-15px - 1.8rem);left:calc(50% - 15px);color:#10a6fa;font-size:1.8rem}.process .item.active~.item:before{background:#5d5f69}.process .item.active~.item a{color:#fff}.process .item.active~.item a:hover{color:#10a6fa}.process .item.active~.item a:before{background:#5d5f69}.process.success .item:not(:first-child):before{background:#2abc90}.process.success .item a{padding:10px}.process.success .item a:before{background:#2abc90}.process.success .item.active a,.process.success .item.active a:after{color:#2abc90}.process.success .item.active~.item:before{background:#5d5f69}.process.warning .item:not(:first-child):before{background:#b78343}.process.warning .item a{padding:10px}.process.warning .item a:before{background:#b78343}.process.warning .item.active a,.process.warning .item.active a:after{color:#b78343}.process.warning .item.active~.item:before{background:#5d5f69}.process.error .item:not(:first-child):before{background:#d84955}.process.error .item a{padding:10px}.process.error .item a:before{background:#d84955}.process.error .item.active a,.process.error .item.active a:after{color:#d84955}.process.error .item.active~.item:before{background:#5d5f69}.process.dark .item:not(:first-child):before{background:#3a3c42}.process.dark .item a{padding:10px}.process.dark .item a:before{background:#3a3c42}.process.dark .item.active a,.process.dark .item.active a:after{color:#3a3c42}.process.dark .item.active~.item:before{background:#5d5f69}.process.vertical{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;margin:1em 0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.process.vertical .item{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:100%;min-width:100%;border-bottom:1px solid #5d5f69;border-right:1px solid #5d5f69;padding-left:20px}.process.vertical .item:first-child{border-top:1px solid #5d5f69}.process.vertical .item:not(:first-child):before{width:3px;height:100%;left:0}.process.vertical .item a:before{width:9px}.process.vertical .item a:first-child:before{left:0;height:100%}.process.vertical .item.active a{font-weight:700}.process.vertical .item.active a:after{top:15px;left:calc(-15px - 1.8rem)}.process.vertical.reversed{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.process.vertical.reversed .item:last-child{border-top:1px solid #5d5f69}.process.vertical.reversed .item:first-child{border-top:none}@media only screen and (max-width:768px){.process{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;margin:1em 0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.process .item{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:100%;min-width:100%;border-bottom:1px solid #5d5f69;border-right:1px solid #5d5f69;padding-left:20px}.process .item:first-child{border-top:1px solid #5d5f69}.process .item:not(:first-child):before{width:3px;height:100%;left:0}.process .item a:before{width:9px}.process .item a:first-child:before{left:0;height:100%}.process .item.active a{font-weight:700}.process .item.active a:after{top:15px;left:calc(-15px - 1.8rem)}.process.reversed{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.process.reversed .item:last-child{border-top:1px solid #5d5f69}.process.reversed .item:first-child{border-top:none}}.progress{width:100%;height:12px;background:#2b2d2f;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.15);box-shadow:inset 0 1px 2px rgba(0,0,0,.15);border-radius:16px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.progress::-webkit-progress-bar{background:transparent;border-radius:16px}.progress::-webkit-progress-value{background:#10a6fa;border-radius:16px}.progress::-moz-progress-bar{background:#10a6fa;border-radius:16px}.progress.success::-webkit-progress-value{background:#2abc90}.progress.warning::-webkit-progress-value{background:#b78343}.progress.error::-webkit-progress-value{background:#d84955}.progress.dark::-webkit-progress-value{background:#3a3c42}.tab{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;border-bottom:2px solid #2b2d2f;padding:0}.tab>.buttons{-webkit-box-shadow:none;box-shadow:none;border-radius:0}.tab>.button,.tab>.buttons>.button,.tab>.buttons>.dropdown>.button,.tab>.buttons>.dropdown>a.button,.tab>.buttons>a.button,.tab>.dropdown>.button,.tab>.dropdown>a.button,.tab>a.button{background:transparent;border:none;border-bottom:2px solid transparent;border-radius:0!important;margin-bottom:-2px;line-height:normal;font-size:1.025em;-webkit-transition:border-bottom-color,color .2s;transition:border-bottom-color,color .2s;color:#fff;padding:.935rem 1.4rem;-webkit-box-shadow:none;box-shadow:none}.tab>.button:hover,.tab>.buttons>.button:hover,.tab>.buttons>.dropdown>.button:hover,.tab>.buttons>.dropdown>a.button:hover,.tab>.buttons>a.button:hover,.tab>.dropdown>.button:hover,.tab>.dropdown>a.button:hover,.tab>a.button:hover{color:#fff;border-bottom-color:#6c6e79;-webkit-transition:border-bottom-color,color .2s;transition:border-bottom-color,color .2s}.tab>.button.disabled,.tab>.buttons>.button.disabled,.tab>.buttons>.dropdown>.button.disabled,.tab>.buttons>.dropdown>a.button.disabled,.tab>.buttons>a.button.disabled,.tab>.dropdown>.button.disabled,.tab>.dropdown>a.button.disabled,.tab>a.button.disabled{opacity:.45}.tab>.button.active,.tab>.buttons>.button.active,.tab>.buttons>.dropdown>.button.active,.tab>.buttons>.dropdown>a.button.active,.tab>.buttons>a.button.active,.tab>.dropdown>.button.active,.tab>.dropdown>a.button.active,.tab>a.button.active{color:#10a6fa;border-bottom-color:#10a6fa;font-weight:700}.tab>.button.active [class^=material-icons],.tab>.button.active i,.tab>.buttons>.button.active [class^=material-icons],.tab>.buttons>.button.active i,.tab>.buttons>.dropdown>.button.active [class^=material-icons],.tab>.buttons>.dropdown>.button.active i,.tab>.buttons>.dropdown>a.button.active [class^=material-icons],.tab>.buttons>.dropdown>a.button.active i,.tab>.buttons>a.button.active [class^=material-icons],.tab>.buttons>a.button.active i,.tab>.dropdown>.button.active [class^=material-icons],.tab>.dropdown>.button.active i,.tab>.dropdown>a.button.active [class^=material-icons],.tab>.dropdown>a.button.active i,.tab>a.button.active [class^=material-icons],.tab>a.button.active i{color:inherit}.tab.success .button.active,.tab.success .dropdown .button.active,.tab.success .dropdown a.button.active,.tab.success a.button.active{color:#2abc90;border-bottom-color:#2abc90}.tab.warning .button.active,.tab.warning .dropdown .button.active,.tab.warning .dropdown a.button.active,.tab.warning a.button.active{color:#b78343;border-bottom-color:#b78343}.tab.error .button.active,.tab.error .dropdown .button.active,.tab.error .dropdown a.button.active,.tab.error a.button.active{color:#d84955;border-bottom-color:#d84955}.tab.dark .button.active,.tab.dark .dropdown .button.active,.tab.dark .dropdown a.button.active,.tab.dark a.button.active{color:#fff;border-bottom-color:#3a3c42}.timeline .activity{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;position:relative;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.timeline .activity:before{content:"";display:block;position:absolute;top:0;bottom:0;left:0;width:1px;background-color:#5d5f69}.timeline .activity:target .type{border-color:#10a6fa;-webkit-box-shadow:0 0 .2em #10a6fa;box-shadow:0 0 .2em #10a6fa}.timeline .activity .type{position:absolute;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;width:32px;height:32px;top:13px;left:-15px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#2b2d2f;border:2px solid #5d5f69;border-radius:50%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-negative:0;flex-shrink:0;-webkit-box-shadow:0 4px 8px rgba(0,0,0,.2);box-shadow:0 4px 8px rgba(0,0,0,.2)}.timeline .activity .type.primary{background-color:#10a6fa;color:#fff;border-color:#0599ec}.timeline .activity .type.success{background-color:#2abc90;color:#fff;border-color:#25a780}.timeline .activity .type.warning{background-color:#b78343;color:#fff;border-color:#a4763c}.timeline .activity .type.error{background-color:#d84955;color:#fff;border-color:#d43441}.timeline .activity .type.dark{background-color:#3a3c42;color:#fff;border-color:#2e3034}.timeline .activity .actions,.timeline .activity .author,.timeline .activity .body,.timeline .activity .date,.timeline .activity .media{min-width:0;max-width:100%;color:#fff;-webkit-box-flex:1;-ms-flex:auto;flex:auto;margin-left:10px;width:100%}.timeline .activity .author{font-weight:700;font-size:1rem;color:#e0e0e0}.timeline .activity .date{font-size:.9em;opacity:.6}.timeline .activity .media{margin-top:16px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative;padding-bottom:56.25%!important;height:0;overflow:hidden;max-width:100%;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.timeline .activity .media embed,.timeline .activity .media iframe,.timeline .activity .media object{position:absolute;top:0;left:0;width:100%;height:100%}.timeline .activity .media video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.timeline .activity .media img{display:block}.timeline .activity>.media.two{padding-bottom:0!important;height:auto}.timeline .activity>.media.two>a,.timeline .activity>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.three{padding-bottom:0!important;height:auto}.timeline .activity>.media.three>a,.timeline .activity>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.four{padding-bottom:0!important;height:auto}.timeline .activity>.media.four>a,.timeline .activity>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.five{padding-bottom:0!important;height:auto}.timeline .activity>.media.five>a,.timeline .activity>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.six{padding-bottom:0!important;height:auto}.timeline .activity>.media.six>a,.timeline .activity>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.seven{padding-bottom:0!important;height:auto}.timeline .activity>.media.seven>a,.timeline .activity>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.eight{padding-bottom:0!important;height:auto}.timeline .activity>.media.eight>a,.timeline .activity>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.nine{padding-bottom:0!important;height:auto}.timeline .activity>.media.nine>a,.timeline .activity>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.ten{padding-bottom:0!important;height:auto}.timeline .activity>.media.ten>a,.timeline .activity>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.eleven{padding-bottom:0!important;height:auto}.timeline .activity>.media.eleven>a,.timeline .activity>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.twelve{padding-bottom:0!important;height:auto}.timeline .activity>.media.twelve>a,.timeline .activity>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.thirteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.thirteen>a,.timeline .activity>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.fourteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.fourteen>a,.timeline .activity>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.fifteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.fifteen>a,.timeline .activity>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.sixteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.sixteen>a,.timeline .activity>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity .actions{margin-top:16px}.timeline .activity:last-child:before{background:-webkit-gradient(linear,left top,left bottom,color-stop(45%,#5d5f69),to(hsla(0,0%,100%,0)));background:linear-gradient(180deg,#5d5f69 45%,hsla(0,0%,100%,0))}.timeline .activity:first-child:before{background:-webkit-gradient(linear,left bottom,left top,color-stop(45%,#5d5f69),to(hsla(0,0%,100%,0)));background:linear-gradient(0deg,#5d5f69 45%,hsla(0,0%,100%,0))}.tooltip{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;cursor:default}.tooltip .text{position:absolute;color:#fff;font-size:.9em;font-weight:600;text-align:center;visibility:hidden;background-color:#3a3c42;border-radius:4px;min-width:100px;max-width:180px;padding:5px;top:120%;opacity:0;-webkit-transition:opacity .18s;transition:opacity .18s;z-index:1}.tooltip .text:after{content:"";position:absolute;top:auto;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:transparent transparent #3a3c42}.tooltip:hover .text{visibility:visible;opacity:1}.m-0{margin:0!important}.m-5{margin:5px!important}.m-10{margin:10px!important}.m-15{margin:15px!important}.m-20{margin:20px!important}.m-30{margin:30px!important}.m-40{margin:40px!important}.m-50{margin:50px!important}.mt-0{margin-top:0!important}.mt-5{margin-top:5px!important}.mt-10{margin-top:10px!important}.mt-15{margin-top:15px!important}.mt-20{margin-top:20px!important}.mt-30{margin-top:30px!important}.mt-40{margin-top:40px!important}.mt-50{margin-top:50px!important}.mr-0{margin-right:0!important}.mr-5{margin-right:5px!important}.mr-10{margin-right:10px!important}.mr-15{margin-right:15px!important}.mr-20{margin-right:20px!important}.mr-30{margin-right:30px!important}.mr-40{margin-right:40px!important}.mr-50{margin-right:50px!important}.mb-0{margin-bottom:0!important}.mb-5{margin-bottom:5px!important}.mb-10{margin-bottom:10px!important}.mb-15{margin-bottom:15px!important}.mb-20{margin-bottom:20px!important}.mb-30{margin-bottom:30px!important}.mb-40{margin-bottom:40px!important}.mb-50{margin-bottom:50px!important}.ml-0{margin-left:0!important}.ml-5{margin-left:5px!important}.ml-10{margin-left:10px!important}.ml-15{margin-left:15px!important}.ml-20{margin-left:20px!important}.ml-30{margin-left:30px!important}.ml-40{margin-left:40px!important}.ml-50{margin-left:50px!important}.m-auto{margin:auto!important}.mt-auto{margin-top:auto!important}.mr-auto{margin-right:auto!important}.mb-auto{margin-bottom:auto!important}.ml-auto{margin-left:auto!important}.p-0{padding:0!important}.p-5{padding:5px!important}.p-10{padding:10px!important}.p-15{padding:15px!important}.p-20{padding:20px!important}.p-30{padding:30px!important}.p-40{padding:40px!important}.p-50{padding:50px!important}.pt-0{padding-top:0!important}.pt-5{padding-top:5px!important}.pt-10{padding-top:10px!important}.pt-15{padding-top:15px!important}.pt-20{padding-top:20px!important}.pt-30{padding-top:30px!important}.pt-40{padding-top:40px!important}.pt-50{padding-top:50px!important}.pr-0{padding-right:0!important}.pr-5{padding-right:5px!important}.pr-10{padding-right:10px!important}.pr-15{padding-right:15px!important}.pr-20{padding-right:20px!important}.pr-30{padding-right:30px!important}.pr-40{padding-right:40px!important}.pr-50{padding-right:50px!important}.pb-0{padding-bottom:0!important}.pb-5{padding-bottom:5px!important}.pb-10{padding-bottom:10px!important}.pb-15{padding-bottom:15px!important}.pb-20{padding-bottom:20px!important}.pb-30{padding-bottom:30px!important}.pb-40{padding-bottom:40px!important}.pb-50{padding-bottom:50px!important}.pl-0{padding-left:0!important}.pl-5{padding-left:5px!important}.pl-10{padding-left:10px!important}.pl-15{padding-left:15px!important}.pl-20{padding-left:20px!important}.pl-30{padding-left:30px!important}.pl-40{padding-left:40px!important}.pl-50{padding-left:50px!important}.p-auto{padding:auto!important}.pt-auto{padding-top:auto!important}.pr-auto{padding-right:auto!important}.pb-auto{padding-bottom:auto!important}.pl-auto{padding-left:auto!important}.fw-100{font-weight:100!important}.fw-200{font-weight:200!important}.fw-300{font-weight:300!important}.fw-400{font-weight:400!important}.fw-500{font-weight:500!important}.fw-600{font-weight:600!important}.fw-700{font-weight:700!important}.fw-800{font-weight:800!important}.fw-900{font-weight:900!important}.mini-text{font-size:60%!important}.tiny-text{font-size:73%!important}.small-text{font-size:85%!important}.large-text{font-size:120%!important}.big-text{font-size:175%!important}.huge-text{font-size:200%!important}.giant-text{font-size:350%!important}.color-grey{color:#6c6e79!important}.color-white{color:#fff!important}.color-black{color:#000!important}.color-primary{color:#10a6fa!important}.color-success{color:#2abc90!important}.color-warning{color:#b78343!important}.color-error{color:#d84955!important}.bg-grey{background-color:#6c6e79!important}.bg-secondary{background-color:#2b2d2f!important}.bg-white{background-color:#fff!important}.bg-black{background-color:#000!important}.bg-dark{background-color:#3a3c42!important}.bg-primary{background-color:#10a6fa!important}.bg-success{background-color:#2abc90!important}.bg-warning{background-color:#b78343!important}.bg-error{background-color:#d84955!important}.cursor-alias{cursor:alias!important}.cursor-default{cursor:default!important}.cursor-grab{cursor:-webkit-grab!important;cursor:grab!important}.cursor-help{cursor:help!important}.cursor-move{cursor:move!important}.cursor-pointer{cursor:pointer!important}.cursor-wait{cursor:wait!important}.cursor-zoom-in{cursor:-webkit-zoom-in!important;cursor:zoom-in!important}.cursor-zoom-out{cursor:-webkit-zoom-out!important;cursor:zoom-out!important}.display-inline{display:inline!important}.display-flex{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important}.display-inline-flex{display:-webkit-inline-box!important;display:-ms-inline-flexbox!important;display:inline-flex!important}.display-grid{display:grid!important}.display-inline-grid{display:inline-grid!important}.display-block{display:block!important}.display-inline-block{display:inline-block!important}.display-table{display:table!important}.display-inline-table{display:inline-table!important}.display-table-row{display:table-row!important}.display-table-column{display:table-column!important}.display-table-cell{display:table-cell!important}.align-items-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.align-items-flex-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.align-items-flex-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.align-items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.align-items-stretch{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.align-items-initial{-webkit-box-align:initial;-ms-flex-align:initial;align-items:initial}.align-items-inherit{-webkit-box-align:inherit;-ms-flex-align:inherit;align-items:inherit}.align-self-auto{-ms-flex-item-align:auto;align-self:auto}.align-self-baseline{-ms-flex-item-align:baseline;align-self:baseline}.align-self-flex-start{-ms-flex-item-align:start;align-self:flex-start}.align-self-flex-end{-ms-flex-item-align:end;align-self:flex-end}.align-self-center{-ms-flex-item-align:center;align-self:center}.align-self-stretch{-ms-flex-item-align:stretch;align-self:stretch}.align-self-initial{-ms-flex-item-align:initial;align-self:auto}.align-self-inherit{-ms-flex-item-align:inherit;align-self:inherit}.justify-content-baseline{-webkit-box-pack:baseline;-ms-flex-pack:baseline;justify-content:baseline}.justify-content-flex-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-content-flex-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-content-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-content-space-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-content-space-around{-ms-flex-pack:distribute;justify-content:space-around}.justify-content-initial{-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:initial}.justify-content-inherit{-webkit-box-pack:inherit;-ms-flex-pack:inherit;justify-content:inherit}.filter-invert{-webkit-filter:invert(100%);filter:invert(100%)}.filter-gray{-webkit-filter:grayscale(100%);filter:grayscale(100%)}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-x-visible{overflow-x:visible}.overflow-x-scroll{overflow-x:scroll}.overflow-y-auto{overflow-y:auto}.overflow-y-hidden{overflow-y:hidden}.overflow-y-visible{overflow-y:visible}.overflow-y-scroll{overflow-y:scroll}.position-static{position:static}.position-absolute{position:absolute}.position-fixed{position:fixed}.position-relative{position:relative}.position-sticky{position:-webkit-sticky;position:sticky}.position-initial{position:static}.position-inherit{position:inherit}.z--1{z-index:-1!important}.z-0{z-index:0!important}.z-1{z-index:1!important}.z-10{z-index:10!important}.z-20{z-index:20!important}.z-30{z-index:30!important}.z-40{z-index:40!important}.z-50{z-index:50!important}.z-100{z-index:100!important}.z-999{z-index:999!important}.z-9999{z-index:9999!important}.flex-direction-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.flex-direction-row-reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.flex-direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.flex-direction-column-reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-direction-initial{-webkit-box-orient:initial;-webkit-box-direction:initial;-ms-flex-direction:initial;flex-direction:row}.flex-direction-inherit{-webkit-box-orient:inherit;-webkit-box-direction:inherit;-ms-flex-direction:inherit;flex-direction:inherit}.user-select-none{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.user-select-auto{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.user-select-text{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.user-select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.top-0{top:0}.top-auto{top:auto}.bottom-0{bottom:0}.bottom-auto{bottom:auto}.left-0{left:0}.left-auto{left:auto}.right-0{right:0}.right-auto{right:auto}.line-height-0{line-height:0!important}.line-height-1{line-height:1!important}.line-height-2{line-height:2!important}.line-height-3{line-height:3!important}.line-height-4{line-height:4!important}.line-height-5{line-height:5!important}.radius-4{border-radius:4px!important}.radius-8{border-radius:8px!important}.radius-10{border-radius:10px!important}.radius-12{border-radius:12px!important}.radius-14{border-radius:14px!important}.radius-16{border-radius:16px!important}.radius-500{border-radius:500px!important}.backdrop-4{-webkit-backdrop-filter:4px;backdrop-filter:4px}.backdrop-7{-webkit-backdrop-filter:7px;backdrop-filter:7px}.backdrop-10{-webkit-backdrop-filter:10px;backdrop-filter:10px}.backdrop-12{-webkit-backdrop-filter:12px;backdrop-filter:12px}.backdrop-16{-webkit-backdrop-filter:16px;backdrop-filter:16px}.backdrop-20{-webkit-backdrop-filter:20px;backdrop-filter:20px}.centered{margin:0 auto}.align.right{text-align:right!important}.align.left{text-align:left!important}.align.center{text-align:center!important}.align.justify{text-align:justify!important}.float.right{float:right}.float.left{float:left}.full.width{width:100%;max-width:100%;min-width:100%}.full.height{height:100%;min-height:100%;max-height:100%}.fade{opacity:0}.hide{display:none}.spacer{-webkit-box-flex:1!important;-ms-flex-positive:1!important;flex-grow:1!important;outline:none}.avatar{display:inline-block;border-radius:50%}.reset{padding:0!important;margin:0!important}.reverse{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);-ms-transform:rotateY(180deg);unicode-bidi:bidi-override;direction:rtl}.truncate{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transparent{background:transparent!important}.pure,.pure>div{background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none}.bordered{border:1px solid #5d5f69}.borderless{border:none!important}.rounded{border-radius:4px}.radiusless{border-radius:0!important}.shadowed{-webkit-box-shadow:0 4px 8px rgba(0,0,0,.2);box-shadow:0 4px 8px rgba(0,0,0,.2)}.shadowless{-webkit-box-shadow:none!important;box-shadow:none!important}.inset-0{top:0;right:0;bottom:0;left:0}.inset-auto{top:auto;right:auto;bottom:auto;left:auto} \ No newline at end of file diff --git a/dist/punica.css b/dist/punica.css deleted file mode 100644 index a20d63e7..00000000 --- a/dist/punica.css +++ /dev/null @@ -1,9159 +0,0 @@ -@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;900&display=swap);*, *:after, *:before { - -webkit-box-sizing: inherit; - box-sizing: inherit; -} - -* { - margin: 0; - padding: 0; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - text-rendering: optimizeLegibility; - text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004) !important; -} - -html { - -webkit-box-sizing: border-box; - box-sizing: border-box; - -webkit-text-size-adjust: 100%; - -webkit-tap-highlight-color: transparent; -} - -body { - font-family: "Nunito",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; - font-size: 13px; - font-weight: 400; - line-height: 1.7; - color: #3f4143; -} - -html, body { - min-height: 100%; - height: 100%; - padding: 0; - margin: 0; - border: none; -} - -::-webkit-scrollbar { - width: 6px; -} - -::-webkit-scrollbar-track { - background: #e6e6e6; -} - -::-webkit-scrollbar-thumb { - background: #414552; -} - -::-moz-selection { - background-color: #0a8fff; - color: #fff; -} - -::selection { - background-color: #0a8fff; - color: #fff; -} - -a { - color: #3f4143; - outline: none; - text-decoration: none; -} - -a:focus, a:hover, a:active, a.active { - color: #007ae0; - text-decoration: underline; -} - -a:visited { - color: #3f4143; -} - -hr { - margin: 15px 0; - -webkit-box-shadow: 0 0.05rem 0.2rem rgba(48, 55, 66, 0.3); - box-shadow: 0 0.05rem 0.2rem rgba(48, 55, 66, 0.3); - background-color: #ccc; - border: none; - height: 1px; -} - -ul, ol { - margin: .8rem 0 .8rem .8rem; - padding: 0; -} - -ul ul, ul ol, ol ul, ol ol { - margin: .8rem 0 .8rem .8rem; -} - -ul li, ol li { - margin-top: .4rem; -} - -ul { - list-style: disc inside; -} - -ol { - list-style: decimal inside; -} - -dl dt { - font-weight: bold; -} - -img, canvas, embed, object, video { - max-width: 100%; - height: auto; - -webkit-box-sizing: border-box; - box-sizing: border-box; -} - -img { - border-style: none; -} - -iframe { - outline: 0; -} - -:not(pre) > code, :not(pre) > kbd, :not(pre) > samp { - color: #d62828; - white-space: nowrap; - padding: 2px 6px; - font-size: .935em; -} - -.container { - width: 100%; - margin: 0 auto; - padding: 0 40px; -} - -.row { - display: grid; - grid-gap: 6px; - grid-template-columns: repeat(16, 1fr); -} - -.row > [class^="col"] { - height: -webkit-fit-content; - height: -moz-fit-content; - height: fit-content; - padding: .3rem; - min-height: .125rem; -} - -.row.equal > [class^="col"] { - height: auto; -} - -@media only screen and (max-width: 768px) { - .container { - padding: 0 13.33333px; - } -} - -@media only screen and (min-width: 0) { - .col-1, .col-xs-1 { - grid-column: span 1; - } - .col-xs-1.offset-xs-2 { - grid-column: 2 / span 1; - } - .col-xs-1.offset-xs-3 { - grid-column: 3 / span 1; - } - .col-xs-1.offset-xs-4 { - grid-column: 4 / span 1; - } - .col-xs-1.offset-xs-5 { - grid-column: 5 / span 1; - } - .col-xs-1.offset-xs-6 { - grid-column: 6 / span 1; - } - .col-xs-1.offset-xs-7 { - grid-column: 7 / span 1; - } - .col-xs-1.offset-xs-8 { - grid-column: 8 / span 1; - } - .col-xs-1.offset-xs-9 { - grid-column: 9 / span 1; - } - .col-xs-1.offset-xs-10 { - grid-column: 10 / span 1; - } - .col-xs-1.offset-xs-11 { - grid-column: 11 / span 1; - } - .col-xs-1.offset-xs-12 { - grid-column: 12 / span 1; - } - .col-xs-1.offset-xs-13 { - grid-column: 13 / span 1; - } - .col-xs-1.offset-xs-14 { - grid-column: 14 / span 1; - } - .col-xs-1.offset-xs-15 { - grid-column: 15 / span 1; - } - .col-xs-1.offset-xs-16 { - grid-column: 16 / span 1; - } - .col-2, .col-xs-2 { - grid-column: span 2; - } - .col-xs-2.offset-xs-2 { - grid-column: 2 / span 2; - } - .col-xs-2.offset-xs-3 { - grid-column: 3 / span 2; - } - .col-xs-2.offset-xs-4 { - grid-column: 4 / span 2; - } - .col-xs-2.offset-xs-5 { - grid-column: 5 / span 2; - } - .col-xs-2.offset-xs-6 { - grid-column: 6 / span 2; - } - .col-xs-2.offset-xs-7 { - grid-column: 7 / span 2; - } - .col-xs-2.offset-xs-8 { - grid-column: 8 / span 2; - } - .col-xs-2.offset-xs-9 { - grid-column: 9 / span 2; - } - .col-xs-2.offset-xs-10 { - grid-column: 10 / span 2; - } - .col-xs-2.offset-xs-11 { - grid-column: 11 / span 2; - } - .col-xs-2.offset-xs-12 { - grid-column: 12 / span 2; - } - .col-xs-2.offset-xs-13 { - grid-column: 13 / span 2; - } - .col-xs-2.offset-xs-14 { - grid-column: 14 / span 2; - } - .col-xs-2.offset-xs-15 { - grid-column: 15 / span 2; - } - .col-xs-2.offset-xs-16 { - grid-column: 16 / span 2; - } - .col-3, .col-xs-3 { - grid-column: span 3; - } - .col-xs-3.offset-xs-2 { - grid-column: 2 / span 3; - } - .col-xs-3.offset-xs-3 { - grid-column: 3 / span 3; - } - .col-xs-3.offset-xs-4 { - grid-column: 4 / span 3; - } - .col-xs-3.offset-xs-5 { - grid-column: 5 / span 3; - } - .col-xs-3.offset-xs-6 { - grid-column: 6 / span 3; - } - .col-xs-3.offset-xs-7 { - grid-column: 7 / span 3; - } - .col-xs-3.offset-xs-8 { - grid-column: 8 / span 3; - } - .col-xs-3.offset-xs-9 { - grid-column: 9 / span 3; - } - .col-xs-3.offset-xs-10 { - grid-column: 10 / span 3; - } - .col-xs-3.offset-xs-11 { - grid-column: 11 / span 3; - } - .col-xs-3.offset-xs-12 { - grid-column: 12 / span 3; - } - .col-xs-3.offset-xs-13 { - grid-column: 13 / span 3; - } - .col-xs-3.offset-xs-14 { - grid-column: 14 / span 3; - } - .col-xs-3.offset-xs-15 { - grid-column: 15 / span 3; - } - .col-xs-3.offset-xs-16 { - grid-column: 16 / span 3; - } - .col-4, .col-xs-4 { - grid-column: span 4; - } - .col-xs-4.offset-xs-2 { - grid-column: 2 / span 4; - } - .col-xs-4.offset-xs-3 { - grid-column: 3 / span 4; - } - .col-xs-4.offset-xs-4 { - grid-column: 4 / span 4; - } - .col-xs-4.offset-xs-5 { - grid-column: 5 / span 4; - } - .col-xs-4.offset-xs-6 { - grid-column: 6 / span 4; - } - .col-xs-4.offset-xs-7 { - grid-column: 7 / span 4; - } - .col-xs-4.offset-xs-8 { - grid-column: 8 / span 4; - } - .col-xs-4.offset-xs-9 { - grid-column: 9 / span 4; - } - .col-xs-4.offset-xs-10 { - grid-column: 10 / span 4; - } - .col-xs-4.offset-xs-11 { - grid-column: 11 / span 4; - } - .col-xs-4.offset-xs-12 { - grid-column: 12 / span 4; - } - .col-xs-4.offset-xs-13 { - grid-column: 13 / span 4; - } - .col-xs-4.offset-xs-14 { - grid-column: 14 / span 4; - } - .col-xs-4.offset-xs-15 { - grid-column: 15 / span 4; - } - .col-xs-4.offset-xs-16 { - grid-column: 16 / span 4; - } - .col-5, .col-xs-5 { - grid-column: span 5; - } - .col-xs-5.offset-xs-2 { - grid-column: 2 / span 5; - } - .col-xs-5.offset-xs-3 { - grid-column: 3 / span 5; - } - .col-xs-5.offset-xs-4 { - grid-column: 4 / span 5; - } - .col-xs-5.offset-xs-5 { - grid-column: 5 / span 5; - } - .col-xs-5.offset-xs-6 { - grid-column: 6 / span 5; - } - .col-xs-5.offset-xs-7 { - grid-column: 7 / span 5; - } - .col-xs-5.offset-xs-8 { - grid-column: 8 / span 5; - } - .col-xs-5.offset-xs-9 { - grid-column: 9 / span 5; - } - .col-xs-5.offset-xs-10 { - grid-column: 10 / span 5; - } - .col-xs-5.offset-xs-11 { - grid-column: 11 / span 5; - } - .col-xs-5.offset-xs-12 { - grid-column: 12 / span 5; - } - .col-xs-5.offset-xs-13 { - grid-column: 13 / span 5; - } - .col-xs-5.offset-xs-14 { - grid-column: 14 / span 5; - } - .col-xs-5.offset-xs-15 { - grid-column: 15 / span 5; - } - .col-xs-5.offset-xs-16 { - grid-column: 16 / span 5; - } - .col-6, .col-xs-6 { - grid-column: span 6; - } - .col-xs-6.offset-xs-2 { - grid-column: 2 / span 6; - } - .col-xs-6.offset-xs-3 { - grid-column: 3 / span 6; - } - .col-xs-6.offset-xs-4 { - grid-column: 4 / span 6; - } - .col-xs-6.offset-xs-5 { - grid-column: 5 / span 6; - } - .col-xs-6.offset-xs-6 { - grid-column: 6 / span 6; - } - .col-xs-6.offset-xs-7 { - grid-column: 7 / span 6; - } - .col-xs-6.offset-xs-8 { - grid-column: 8 / span 6; - } - .col-xs-6.offset-xs-9 { - grid-column: 9 / span 6; - } - .col-xs-6.offset-xs-10 { - grid-column: 10 / span 6; - } - .col-xs-6.offset-xs-11 { - grid-column: 11 / span 6; - } - .col-xs-6.offset-xs-12 { - grid-column: 12 / span 6; - } - .col-xs-6.offset-xs-13 { - grid-column: 13 / span 6; - } - .col-xs-6.offset-xs-14 { - grid-column: 14 / span 6; - } - .col-xs-6.offset-xs-15 { - grid-column: 15 / span 6; - } - .col-xs-6.offset-xs-16 { - grid-column: 16 / span 6; - } - .col-7, .col-xs-7 { - grid-column: span 7; - } - .col-xs-7.offset-xs-2 { - grid-column: 2 / span 7; - } - .col-xs-7.offset-xs-3 { - grid-column: 3 / span 7; - } - .col-xs-7.offset-xs-4 { - grid-column: 4 / span 7; - } - .col-xs-7.offset-xs-5 { - grid-column: 5 / span 7; - } - .col-xs-7.offset-xs-6 { - grid-column: 6 / span 7; - } - .col-xs-7.offset-xs-7 { - grid-column: 7 / span 7; - } - .col-xs-7.offset-xs-8 { - grid-column: 8 / span 7; - } - .col-xs-7.offset-xs-9 { - grid-column: 9 / span 7; - } - .col-xs-7.offset-xs-10 { - grid-column: 10 / span 7; - } - .col-xs-7.offset-xs-11 { - grid-column: 11 / span 7; - } - .col-xs-7.offset-xs-12 { - grid-column: 12 / span 7; - } - .col-xs-7.offset-xs-13 { - grid-column: 13 / span 7; - } - .col-xs-7.offset-xs-14 { - grid-column: 14 / span 7; - } - .col-xs-7.offset-xs-15 { - grid-column: 15 / span 7; - } - .col-xs-7.offset-xs-16 { - grid-column: 16 / span 7; - } - .col-8, .col-xs-8 { - grid-column: span 8; - } - .col-xs-8.offset-xs-2 { - grid-column: 2 / span 8; - } - .col-xs-8.offset-xs-3 { - grid-column: 3 / span 8; - } - .col-xs-8.offset-xs-4 { - grid-column: 4 / span 8; - } - .col-xs-8.offset-xs-5 { - grid-column: 5 / span 8; - } - .col-xs-8.offset-xs-6 { - grid-column: 6 / span 8; - } - .col-xs-8.offset-xs-7 { - grid-column: 7 / span 8; - } - .col-xs-8.offset-xs-8 { - grid-column: 8 / span 8; - } - .col-xs-8.offset-xs-9 { - grid-column: 9 / span 8; - } - .col-xs-8.offset-xs-10 { - grid-column: 10 / span 8; - } - .col-xs-8.offset-xs-11 { - grid-column: 11 / span 8; - } - .col-xs-8.offset-xs-12 { - grid-column: 12 / span 8; - } - .col-xs-8.offset-xs-13 { - grid-column: 13 / span 8; - } - .col-xs-8.offset-xs-14 { - grid-column: 14 / span 8; - } - .col-xs-8.offset-xs-15 { - grid-column: 15 / span 8; - } - .col-xs-8.offset-xs-16 { - grid-column: 16 / span 8; - } - .col-9, .col-xs-9 { - grid-column: span 9; - } - .col-xs-9.offset-xs-2 { - grid-column: 2 / span 9; - } - .col-xs-9.offset-xs-3 { - grid-column: 3 / span 9; - } - .col-xs-9.offset-xs-4 { - grid-column: 4 / span 9; - } - .col-xs-9.offset-xs-5 { - grid-column: 5 / span 9; - } - .col-xs-9.offset-xs-6 { - grid-column: 6 / span 9; - } - .col-xs-9.offset-xs-7 { - grid-column: 7 / span 9; - } - .col-xs-9.offset-xs-8 { - grid-column: 8 / span 9; - } - .col-xs-9.offset-xs-9 { - grid-column: 9 / span 9; - } - .col-xs-9.offset-xs-10 { - grid-column: 10 / span 9; - } - .col-xs-9.offset-xs-11 { - grid-column: 11 / span 9; - } - .col-xs-9.offset-xs-12 { - grid-column: 12 / span 9; - } - .col-xs-9.offset-xs-13 { - grid-column: 13 / span 9; - } - .col-xs-9.offset-xs-14 { - grid-column: 14 / span 9; - } - .col-xs-9.offset-xs-15 { - grid-column: 15 / span 9; - } - .col-xs-9.offset-xs-16 { - grid-column: 16 / span 9; - } - .col-10, .col-xs-10 { - grid-column: span 10; - } - .col-xs-10.offset-xs-2 { - grid-column: 2 / span 10; - } - .col-xs-10.offset-xs-3 { - grid-column: 3 / span 10; - } - .col-xs-10.offset-xs-4 { - grid-column: 4 / span 10; - } - .col-xs-10.offset-xs-5 { - grid-column: 5 / span 10; - } - .col-xs-10.offset-xs-6 { - grid-column: 6 / span 10; - } - .col-xs-10.offset-xs-7 { - grid-column: 7 / span 10; - } - .col-xs-10.offset-xs-8 { - grid-column: 8 / span 10; - } - .col-xs-10.offset-xs-9 { - grid-column: 9 / span 10; - } - .col-xs-10.offset-xs-10 { - grid-column: 10 / span 10; - } - .col-xs-10.offset-xs-11 { - grid-column: 11 / span 10; - } - .col-xs-10.offset-xs-12 { - grid-column: 12 / span 10; - } - .col-xs-10.offset-xs-13 { - grid-column: 13 / span 10; - } - .col-xs-10.offset-xs-14 { - grid-column: 14 / span 10; - } - .col-xs-10.offset-xs-15 { - grid-column: 15 / span 10; - } - .col-xs-10.offset-xs-16 { - grid-column: 16 / span 10; - } - .col-11, .col-xs-11 { - grid-column: span 11; - } - .col-xs-11.offset-xs-2 { - grid-column: 2 / span 11; - } - .col-xs-11.offset-xs-3 { - grid-column: 3 / span 11; - } - .col-xs-11.offset-xs-4 { - grid-column: 4 / span 11; - } - .col-xs-11.offset-xs-5 { - grid-column: 5 / span 11; - } - .col-xs-11.offset-xs-6 { - grid-column: 6 / span 11; - } - .col-xs-11.offset-xs-7 { - grid-column: 7 / span 11; - } - .col-xs-11.offset-xs-8 { - grid-column: 8 / span 11; - } - .col-xs-11.offset-xs-9 { - grid-column: 9 / span 11; - } - .col-xs-11.offset-xs-10 { - grid-column: 10 / span 11; - } - .col-xs-11.offset-xs-11 { - grid-column: 11 / span 11; - } - .col-xs-11.offset-xs-12 { - grid-column: 12 / span 11; - } - .col-xs-11.offset-xs-13 { - grid-column: 13 / span 11; - } - .col-xs-11.offset-xs-14 { - grid-column: 14 / span 11; - } - .col-xs-11.offset-xs-15 { - grid-column: 15 / span 11; - } - .col-xs-11.offset-xs-16 { - grid-column: 16 / span 11; - } - .col-12, .col-xs-12 { - grid-column: span 12; - } - .col-xs-12.offset-xs-2 { - grid-column: 2 / span 12; - } - .col-xs-12.offset-xs-3 { - grid-column: 3 / span 12; - } - .col-xs-12.offset-xs-4 { - grid-column: 4 / span 12; - } - .col-xs-12.offset-xs-5 { - grid-column: 5 / span 12; - } - .col-xs-12.offset-xs-6 { - grid-column: 6 / span 12; - } - .col-xs-12.offset-xs-7 { - grid-column: 7 / span 12; - } - .col-xs-12.offset-xs-8 { - grid-column: 8 / span 12; - } - .col-xs-12.offset-xs-9 { - grid-column: 9 / span 12; - } - .col-xs-12.offset-xs-10 { - grid-column: 10 / span 12; - } - .col-xs-12.offset-xs-11 { - grid-column: 11 / span 12; - } - .col-xs-12.offset-xs-12 { - grid-column: 12 / span 12; - } - .col-xs-12.offset-xs-13 { - grid-column: 13 / span 12; - } - .col-xs-12.offset-xs-14 { - grid-column: 14 / span 12; - } - .col-xs-12.offset-xs-15 { - grid-column: 15 / span 12; - } - .col-xs-12.offset-xs-16 { - grid-column: 16 / span 12; - } - .col-13, .col-xs-13 { - grid-column: span 13; - } - .col-xs-13.offset-xs-2 { - grid-column: 2 / span 13; - } - .col-xs-13.offset-xs-3 { - grid-column: 3 / span 13; - } - .col-xs-13.offset-xs-4 { - grid-column: 4 / span 13; - } - .col-xs-13.offset-xs-5 { - grid-column: 5 / span 13; - } - .col-xs-13.offset-xs-6 { - grid-column: 6 / span 13; - } - .col-xs-13.offset-xs-7 { - grid-column: 7 / span 13; - } - .col-xs-13.offset-xs-8 { - grid-column: 8 / span 13; - } - .col-xs-13.offset-xs-9 { - grid-column: 9 / span 13; - } - .col-xs-13.offset-xs-10 { - grid-column: 10 / span 13; - } - .col-xs-13.offset-xs-11 { - grid-column: 11 / span 13; - } - .col-xs-13.offset-xs-12 { - grid-column: 12 / span 13; - } - .col-xs-13.offset-xs-13 { - grid-column: 13 / span 13; - } - .col-xs-13.offset-xs-14 { - grid-column: 14 / span 13; - } - .col-xs-13.offset-xs-15 { - grid-column: 15 / span 13; - } - .col-xs-13.offset-xs-16 { - grid-column: 16 / span 13; - } - .col-14, .col-xs-14 { - grid-column: span 14; - } - .col-xs-14.offset-xs-2 { - grid-column: 2 / span 14; - } - .col-xs-14.offset-xs-3 { - grid-column: 3 / span 14; - } - .col-xs-14.offset-xs-4 { - grid-column: 4 / span 14; - } - .col-xs-14.offset-xs-5 { - grid-column: 5 / span 14; - } - .col-xs-14.offset-xs-6 { - grid-column: 6 / span 14; - } - .col-xs-14.offset-xs-7 { - grid-column: 7 / span 14; - } - .col-xs-14.offset-xs-8 { - grid-column: 8 / span 14; - } - .col-xs-14.offset-xs-9 { - grid-column: 9 / span 14; - } - .col-xs-14.offset-xs-10 { - grid-column: 10 / span 14; - } - .col-xs-14.offset-xs-11 { - grid-column: 11 / span 14; - } - .col-xs-14.offset-xs-12 { - grid-column: 12 / span 14; - } - .col-xs-14.offset-xs-13 { - grid-column: 13 / span 14; - } - .col-xs-14.offset-xs-14 { - grid-column: 14 / span 14; - } - .col-xs-14.offset-xs-15 { - grid-column: 15 / span 14; - } - .col-xs-14.offset-xs-16 { - grid-column: 16 / span 14; - } - .col-15, .col-xs-15 { - grid-column: span 15; - } - .col-xs-15.offset-xs-2 { - grid-column: 2 / span 15; - } - .col-xs-15.offset-xs-3 { - grid-column: 3 / span 15; - } - .col-xs-15.offset-xs-4 { - grid-column: 4 / span 15; - } - .col-xs-15.offset-xs-5 { - grid-column: 5 / span 15; - } - .col-xs-15.offset-xs-6 { - grid-column: 6 / span 15; - } - .col-xs-15.offset-xs-7 { - grid-column: 7 / span 15; - } - .col-xs-15.offset-xs-8 { - grid-column: 8 / span 15; - } - .col-xs-15.offset-xs-9 { - grid-column: 9 / span 15; - } - .col-xs-15.offset-xs-10 { - grid-column: 10 / span 15; - } - .col-xs-15.offset-xs-11 { - grid-column: 11 / span 15; - } - .col-xs-15.offset-xs-12 { - grid-column: 12 / span 15; - } - .col-xs-15.offset-xs-13 { - grid-column: 13 / span 15; - } - .col-xs-15.offset-xs-14 { - grid-column: 14 / span 15; - } - .col-xs-15.offset-xs-15 { - grid-column: 15 / span 15; - } - .col-xs-15.offset-xs-16 { - grid-column: 16 / span 15; - } - .col-16, .col-xs-16 { - grid-column: span 16; - } - .col-xs-16.offset-xs-2 { - grid-column: 2 / span 16; - } - .col-xs-16.offset-xs-3 { - grid-column: 3 / span 16; - } - .col-xs-16.offset-xs-4 { - grid-column: 4 / span 16; - } - .col-xs-16.offset-xs-5 { - grid-column: 5 / span 16; - } - .col-xs-16.offset-xs-6 { - grid-column: 6 / span 16; - } - .col-xs-16.offset-xs-7 { - grid-column: 7 / span 16; - } - .col-xs-16.offset-xs-8 { - grid-column: 8 / span 16; - } - .col-xs-16.offset-xs-9 { - grid-column: 9 / span 16; - } - .col-xs-16.offset-xs-10 { - grid-column: 10 / span 16; - } - .col-xs-16.offset-xs-11 { - grid-column: 11 / span 16; - } - .col-xs-16.offset-xs-12 { - grid-column: 12 / span 16; - } - .col-xs-16.offset-xs-13 { - grid-column: 13 / span 16; - } - .col-xs-16.offset-xs-14 { - grid-column: 14 / span 16; - } - .col-xs-16.offset-xs-15 { - grid-column: 15 / span 16; - } - .col-xs-16.offset-xs-16 { - grid-column: 16 / span 16; - } -} - -@media only screen and (min-width: 500px) { - .col-1, .col-sm-1 { - grid-column: span 1; - } - .col-sm-1.offset-sm-2 { - grid-column: 2 / span 1; - } - .col-sm-1.offset-sm-3 { - grid-column: 3 / span 1; - } - .col-sm-1.offset-sm-4 { - grid-column: 4 / span 1; - } - .col-sm-1.offset-sm-5 { - grid-column: 5 / span 1; - } - .col-sm-1.offset-sm-6 { - grid-column: 6 / span 1; - } - .col-sm-1.offset-sm-7 { - grid-column: 7 / span 1; - } - .col-sm-1.offset-sm-8 { - grid-column: 8 / span 1; - } - .col-sm-1.offset-sm-9 { - grid-column: 9 / span 1; - } - .col-sm-1.offset-sm-10 { - grid-column: 10 / span 1; - } - .col-sm-1.offset-sm-11 { - grid-column: 11 / span 1; - } - .col-sm-1.offset-sm-12 { - grid-column: 12 / span 1; - } - .col-sm-1.offset-sm-13 { - grid-column: 13 / span 1; - } - .col-sm-1.offset-sm-14 { - grid-column: 14 / span 1; - } - .col-sm-1.offset-sm-15 { - grid-column: 15 / span 1; - } - .col-sm-1.offset-sm-16 { - grid-column: 16 / span 1; - } - .col-2, .col-sm-2 { - grid-column: span 2; - } - .col-sm-2.offset-sm-2 { - grid-column: 2 / span 2; - } - .col-sm-2.offset-sm-3 { - grid-column: 3 / span 2; - } - .col-sm-2.offset-sm-4 { - grid-column: 4 / span 2; - } - .col-sm-2.offset-sm-5 { - grid-column: 5 / span 2; - } - .col-sm-2.offset-sm-6 { - grid-column: 6 / span 2; - } - .col-sm-2.offset-sm-7 { - grid-column: 7 / span 2; - } - .col-sm-2.offset-sm-8 { - grid-column: 8 / span 2; - } - .col-sm-2.offset-sm-9 { - grid-column: 9 / span 2; - } - .col-sm-2.offset-sm-10 { - grid-column: 10 / span 2; - } - .col-sm-2.offset-sm-11 { - grid-column: 11 / span 2; - } - .col-sm-2.offset-sm-12 { - grid-column: 12 / span 2; - } - .col-sm-2.offset-sm-13 { - grid-column: 13 / span 2; - } - .col-sm-2.offset-sm-14 { - grid-column: 14 / span 2; - } - .col-sm-2.offset-sm-15 { - grid-column: 15 / span 2; - } - .col-sm-2.offset-sm-16 { - grid-column: 16 / span 2; - } - .col-3, .col-sm-3 { - grid-column: span 3; - } - .col-sm-3.offset-sm-2 { - grid-column: 2 / span 3; - } - .col-sm-3.offset-sm-3 { - grid-column: 3 / span 3; - } - .col-sm-3.offset-sm-4 { - grid-column: 4 / span 3; - } - .col-sm-3.offset-sm-5 { - grid-column: 5 / span 3; - } - .col-sm-3.offset-sm-6 { - grid-column: 6 / span 3; - } - .col-sm-3.offset-sm-7 { - grid-column: 7 / span 3; - } - .col-sm-3.offset-sm-8 { - grid-column: 8 / span 3; - } - .col-sm-3.offset-sm-9 { - grid-column: 9 / span 3; - } - .col-sm-3.offset-sm-10 { - grid-column: 10 / span 3; - } - .col-sm-3.offset-sm-11 { - grid-column: 11 / span 3; - } - .col-sm-3.offset-sm-12 { - grid-column: 12 / span 3; - } - .col-sm-3.offset-sm-13 { - grid-column: 13 / span 3; - } - .col-sm-3.offset-sm-14 { - grid-column: 14 / span 3; - } - .col-sm-3.offset-sm-15 { - grid-column: 15 / span 3; - } - .col-sm-3.offset-sm-16 { - grid-column: 16 / span 3; - } - .col-4, .col-sm-4 { - grid-column: span 4; - } - .col-sm-4.offset-sm-2 { - grid-column: 2 / span 4; - } - .col-sm-4.offset-sm-3 { - grid-column: 3 / span 4; - } - .col-sm-4.offset-sm-4 { - grid-column: 4 / span 4; - } - .col-sm-4.offset-sm-5 { - grid-column: 5 / span 4; - } - .col-sm-4.offset-sm-6 { - grid-column: 6 / span 4; - } - .col-sm-4.offset-sm-7 { - grid-column: 7 / span 4; - } - .col-sm-4.offset-sm-8 { - grid-column: 8 / span 4; - } - .col-sm-4.offset-sm-9 { - grid-column: 9 / span 4; - } - .col-sm-4.offset-sm-10 { - grid-column: 10 / span 4; - } - .col-sm-4.offset-sm-11 { - grid-column: 11 / span 4; - } - .col-sm-4.offset-sm-12 { - grid-column: 12 / span 4; - } - .col-sm-4.offset-sm-13 { - grid-column: 13 / span 4; - } - .col-sm-4.offset-sm-14 { - grid-column: 14 / span 4; - } - .col-sm-4.offset-sm-15 { - grid-column: 15 / span 4; - } - .col-sm-4.offset-sm-16 { - grid-column: 16 / span 4; - } - .col-5, .col-sm-5 { - grid-column: span 5; - } - .col-sm-5.offset-sm-2 { - grid-column: 2 / span 5; - } - .col-sm-5.offset-sm-3 { - grid-column: 3 / span 5; - } - .col-sm-5.offset-sm-4 { - grid-column: 4 / span 5; - } - .col-sm-5.offset-sm-5 { - grid-column: 5 / span 5; - } - .col-sm-5.offset-sm-6 { - grid-column: 6 / span 5; - } - .col-sm-5.offset-sm-7 { - grid-column: 7 / span 5; - } - .col-sm-5.offset-sm-8 { - grid-column: 8 / span 5; - } - .col-sm-5.offset-sm-9 { - grid-column: 9 / span 5; - } - .col-sm-5.offset-sm-10 { - grid-column: 10 / span 5; - } - .col-sm-5.offset-sm-11 { - grid-column: 11 / span 5; - } - .col-sm-5.offset-sm-12 { - grid-column: 12 / span 5; - } - .col-sm-5.offset-sm-13 { - grid-column: 13 / span 5; - } - .col-sm-5.offset-sm-14 { - grid-column: 14 / span 5; - } - .col-sm-5.offset-sm-15 { - grid-column: 15 / span 5; - } - .col-sm-5.offset-sm-16 { - grid-column: 16 / span 5; - } - .col-6, .col-sm-6 { - grid-column: span 6; - } - .col-sm-6.offset-sm-2 { - grid-column: 2 / span 6; - } - .col-sm-6.offset-sm-3 { - grid-column: 3 / span 6; - } - .col-sm-6.offset-sm-4 { - grid-column: 4 / span 6; - } - .col-sm-6.offset-sm-5 { - grid-column: 5 / span 6; - } - .col-sm-6.offset-sm-6 { - grid-column: 6 / span 6; - } - .col-sm-6.offset-sm-7 { - grid-column: 7 / span 6; - } - .col-sm-6.offset-sm-8 { - grid-column: 8 / span 6; - } - .col-sm-6.offset-sm-9 { - grid-column: 9 / span 6; - } - .col-sm-6.offset-sm-10 { - grid-column: 10 / span 6; - } - .col-sm-6.offset-sm-11 { - grid-column: 11 / span 6; - } - .col-sm-6.offset-sm-12 { - grid-column: 12 / span 6; - } - .col-sm-6.offset-sm-13 { - grid-column: 13 / span 6; - } - .col-sm-6.offset-sm-14 { - grid-column: 14 / span 6; - } - .col-sm-6.offset-sm-15 { - grid-column: 15 / span 6; - } - .col-sm-6.offset-sm-16 { - grid-column: 16 / span 6; - } - .col-7, .col-sm-7 { - grid-column: span 7; - } - .col-sm-7.offset-sm-2 { - grid-column: 2 / span 7; - } - .col-sm-7.offset-sm-3 { - grid-column: 3 / span 7; - } - .col-sm-7.offset-sm-4 { - grid-column: 4 / span 7; - } - .col-sm-7.offset-sm-5 { - grid-column: 5 / span 7; - } - .col-sm-7.offset-sm-6 { - grid-column: 6 / span 7; - } - .col-sm-7.offset-sm-7 { - grid-column: 7 / span 7; - } - .col-sm-7.offset-sm-8 { - grid-column: 8 / span 7; - } - .col-sm-7.offset-sm-9 { - grid-column: 9 / span 7; - } - .col-sm-7.offset-sm-10 { - grid-column: 10 / span 7; - } - .col-sm-7.offset-sm-11 { - grid-column: 11 / span 7; - } - .col-sm-7.offset-sm-12 { - grid-column: 12 / span 7; - } - .col-sm-7.offset-sm-13 { - grid-column: 13 / span 7; - } - .col-sm-7.offset-sm-14 { - grid-column: 14 / span 7; - } - .col-sm-7.offset-sm-15 { - grid-column: 15 / span 7; - } - .col-sm-7.offset-sm-16 { - grid-column: 16 / span 7; - } - .col-8, .col-sm-8 { - grid-column: span 8; - } - .col-sm-8.offset-sm-2 { - grid-column: 2 / span 8; - } - .col-sm-8.offset-sm-3 { - grid-column: 3 / span 8; - } - .col-sm-8.offset-sm-4 { - grid-column: 4 / span 8; - } - .col-sm-8.offset-sm-5 { - grid-column: 5 / span 8; - } - .col-sm-8.offset-sm-6 { - grid-column: 6 / span 8; - } - .col-sm-8.offset-sm-7 { - grid-column: 7 / span 8; - } - .col-sm-8.offset-sm-8 { - grid-column: 8 / span 8; - } - .col-sm-8.offset-sm-9 { - grid-column: 9 / span 8; - } - .col-sm-8.offset-sm-10 { - grid-column: 10 / span 8; - } - .col-sm-8.offset-sm-11 { - grid-column: 11 / span 8; - } - .col-sm-8.offset-sm-12 { - grid-column: 12 / span 8; - } - .col-sm-8.offset-sm-13 { - grid-column: 13 / span 8; - } - .col-sm-8.offset-sm-14 { - grid-column: 14 / span 8; - } - .col-sm-8.offset-sm-15 { - grid-column: 15 / span 8; - } - .col-sm-8.offset-sm-16 { - grid-column: 16 / span 8; - } - .col-9, .col-sm-9 { - grid-column: span 9; - } - .col-sm-9.offset-sm-2 { - grid-column: 2 / span 9; - } - .col-sm-9.offset-sm-3 { - grid-column: 3 / span 9; - } - .col-sm-9.offset-sm-4 { - grid-column: 4 / span 9; - } - .col-sm-9.offset-sm-5 { - grid-column: 5 / span 9; - } - .col-sm-9.offset-sm-6 { - grid-column: 6 / span 9; - } - .col-sm-9.offset-sm-7 { - grid-column: 7 / span 9; - } - .col-sm-9.offset-sm-8 { - grid-column: 8 / span 9; - } - .col-sm-9.offset-sm-9 { - grid-column: 9 / span 9; - } - .col-sm-9.offset-sm-10 { - grid-column: 10 / span 9; - } - .col-sm-9.offset-sm-11 { - grid-column: 11 / span 9; - } - .col-sm-9.offset-sm-12 { - grid-column: 12 / span 9; - } - .col-sm-9.offset-sm-13 { - grid-column: 13 / span 9; - } - .col-sm-9.offset-sm-14 { - grid-column: 14 / span 9; - } - .col-sm-9.offset-sm-15 { - grid-column: 15 / span 9; - } - .col-sm-9.offset-sm-16 { - grid-column: 16 / span 9; - } - .col-10, .col-sm-10 { - grid-column: span 10; - } - .col-sm-10.offset-sm-2 { - grid-column: 2 / span 10; - } - .col-sm-10.offset-sm-3 { - grid-column: 3 / span 10; - } - .col-sm-10.offset-sm-4 { - grid-column: 4 / span 10; - } - .col-sm-10.offset-sm-5 { - grid-column: 5 / span 10; - } - .col-sm-10.offset-sm-6 { - grid-column: 6 / span 10; - } - .col-sm-10.offset-sm-7 { - grid-column: 7 / span 10; - } - .col-sm-10.offset-sm-8 { - grid-column: 8 / span 10; - } - .col-sm-10.offset-sm-9 { - grid-column: 9 / span 10; - } - .col-sm-10.offset-sm-10 { - grid-column: 10 / span 10; - } - .col-sm-10.offset-sm-11 { - grid-column: 11 / span 10; - } - .col-sm-10.offset-sm-12 { - grid-column: 12 / span 10; - } - .col-sm-10.offset-sm-13 { - grid-column: 13 / span 10; - } - .col-sm-10.offset-sm-14 { - grid-column: 14 / span 10; - } - .col-sm-10.offset-sm-15 { - grid-column: 15 / span 10; - } - .col-sm-10.offset-sm-16 { - grid-column: 16 / span 10; - } - .col-11, .col-sm-11 { - grid-column: span 11; - } - .col-sm-11.offset-sm-2 { - grid-column: 2 / span 11; - } - .col-sm-11.offset-sm-3 { - grid-column: 3 / span 11; - } - .col-sm-11.offset-sm-4 { - grid-column: 4 / span 11; - } - .col-sm-11.offset-sm-5 { - grid-column: 5 / span 11; - } - .col-sm-11.offset-sm-6 { - grid-column: 6 / span 11; - } - .col-sm-11.offset-sm-7 { - grid-column: 7 / span 11; - } - .col-sm-11.offset-sm-8 { - grid-column: 8 / span 11; - } - .col-sm-11.offset-sm-9 { - grid-column: 9 / span 11; - } - .col-sm-11.offset-sm-10 { - grid-column: 10 / span 11; - } - .col-sm-11.offset-sm-11 { - grid-column: 11 / span 11; - } - .col-sm-11.offset-sm-12 { - grid-column: 12 / span 11; - } - .col-sm-11.offset-sm-13 { - grid-column: 13 / span 11; - } - .col-sm-11.offset-sm-14 { - grid-column: 14 / span 11; - } - .col-sm-11.offset-sm-15 { - grid-column: 15 / span 11; - } - .col-sm-11.offset-sm-16 { - grid-column: 16 / span 11; - } - .col-12, .col-sm-12 { - grid-column: span 12; - } - .col-sm-12.offset-sm-2 { - grid-column: 2 / span 12; - } - .col-sm-12.offset-sm-3 { - grid-column: 3 / span 12; - } - .col-sm-12.offset-sm-4 { - grid-column: 4 / span 12; - } - .col-sm-12.offset-sm-5 { - grid-column: 5 / span 12; - } - .col-sm-12.offset-sm-6 { - grid-column: 6 / span 12; - } - .col-sm-12.offset-sm-7 { - grid-column: 7 / span 12; - } - .col-sm-12.offset-sm-8 { - grid-column: 8 / span 12; - } - .col-sm-12.offset-sm-9 { - grid-column: 9 / span 12; - } - .col-sm-12.offset-sm-10 { - grid-column: 10 / span 12; - } - .col-sm-12.offset-sm-11 { - grid-column: 11 / span 12; - } - .col-sm-12.offset-sm-12 { - grid-column: 12 / span 12; - } - .col-sm-12.offset-sm-13 { - grid-column: 13 / span 12; - } - .col-sm-12.offset-sm-14 { - grid-column: 14 / span 12; - } - .col-sm-12.offset-sm-15 { - grid-column: 15 / span 12; - } - .col-sm-12.offset-sm-16 { - grid-column: 16 / span 12; - } - .col-13, .col-sm-13 { - grid-column: span 13; - } - .col-sm-13.offset-sm-2 { - grid-column: 2 / span 13; - } - .col-sm-13.offset-sm-3 { - grid-column: 3 / span 13; - } - .col-sm-13.offset-sm-4 { - grid-column: 4 / span 13; - } - .col-sm-13.offset-sm-5 { - grid-column: 5 / span 13; - } - .col-sm-13.offset-sm-6 { - grid-column: 6 / span 13; - } - .col-sm-13.offset-sm-7 { - grid-column: 7 / span 13; - } - .col-sm-13.offset-sm-8 { - grid-column: 8 / span 13; - } - .col-sm-13.offset-sm-9 { - grid-column: 9 / span 13; - } - .col-sm-13.offset-sm-10 { - grid-column: 10 / span 13; - } - .col-sm-13.offset-sm-11 { - grid-column: 11 / span 13; - } - .col-sm-13.offset-sm-12 { - grid-column: 12 / span 13; - } - .col-sm-13.offset-sm-13 { - grid-column: 13 / span 13; - } - .col-sm-13.offset-sm-14 { - grid-column: 14 / span 13; - } - .col-sm-13.offset-sm-15 { - grid-column: 15 / span 13; - } - .col-sm-13.offset-sm-16 { - grid-column: 16 / span 13; - } - .col-14, .col-sm-14 { - grid-column: span 14; - } - .col-sm-14.offset-sm-2 { - grid-column: 2 / span 14; - } - .col-sm-14.offset-sm-3 { - grid-column: 3 / span 14; - } - .col-sm-14.offset-sm-4 { - grid-column: 4 / span 14; - } - .col-sm-14.offset-sm-5 { - grid-column: 5 / span 14; - } - .col-sm-14.offset-sm-6 { - grid-column: 6 / span 14; - } - .col-sm-14.offset-sm-7 { - grid-column: 7 / span 14; - } - .col-sm-14.offset-sm-8 { - grid-column: 8 / span 14; - } - .col-sm-14.offset-sm-9 { - grid-column: 9 / span 14; - } - .col-sm-14.offset-sm-10 { - grid-column: 10 / span 14; - } - .col-sm-14.offset-sm-11 { - grid-column: 11 / span 14; - } - .col-sm-14.offset-sm-12 { - grid-column: 12 / span 14; - } - .col-sm-14.offset-sm-13 { - grid-column: 13 / span 14; - } - .col-sm-14.offset-sm-14 { - grid-column: 14 / span 14; - } - .col-sm-14.offset-sm-15 { - grid-column: 15 / span 14; - } - .col-sm-14.offset-sm-16 { - grid-column: 16 / span 14; - } - .col-15, .col-sm-15 { - grid-column: span 15; - } - .col-sm-15.offset-sm-2 { - grid-column: 2 / span 15; - } - .col-sm-15.offset-sm-3 { - grid-column: 3 / span 15; - } - .col-sm-15.offset-sm-4 { - grid-column: 4 / span 15; - } - .col-sm-15.offset-sm-5 { - grid-column: 5 / span 15; - } - .col-sm-15.offset-sm-6 { - grid-column: 6 / span 15; - } - .col-sm-15.offset-sm-7 { - grid-column: 7 / span 15; - } - .col-sm-15.offset-sm-8 { - grid-column: 8 / span 15; - } - .col-sm-15.offset-sm-9 { - grid-column: 9 / span 15; - } - .col-sm-15.offset-sm-10 { - grid-column: 10 / span 15; - } - .col-sm-15.offset-sm-11 { - grid-column: 11 / span 15; - } - .col-sm-15.offset-sm-12 { - grid-column: 12 / span 15; - } - .col-sm-15.offset-sm-13 { - grid-column: 13 / span 15; - } - .col-sm-15.offset-sm-14 { - grid-column: 14 / span 15; - } - .col-sm-15.offset-sm-15 { - grid-column: 15 / span 15; - } - .col-sm-15.offset-sm-16 { - grid-column: 16 / span 15; - } - .col-16, .col-sm-16 { - grid-column: span 16; - } - .col-sm-16.offset-sm-2 { - grid-column: 2 / span 16; - } - .col-sm-16.offset-sm-3 { - grid-column: 3 / span 16; - } - .col-sm-16.offset-sm-4 { - grid-column: 4 / span 16; - } - .col-sm-16.offset-sm-5 { - grid-column: 5 / span 16; - } - .col-sm-16.offset-sm-6 { - grid-column: 6 / span 16; - } - .col-sm-16.offset-sm-7 { - grid-column: 7 / span 16; - } - .col-sm-16.offset-sm-8 { - grid-column: 8 / span 16; - } - .col-sm-16.offset-sm-9 { - grid-column: 9 / span 16; - } - .col-sm-16.offset-sm-10 { - grid-column: 10 / span 16; - } - .col-sm-16.offset-sm-11 { - grid-column: 11 / span 16; - } - .col-sm-16.offset-sm-12 { - grid-column: 12 / span 16; - } - .col-sm-16.offset-sm-13 { - grid-column: 13 / span 16; - } - .col-sm-16.offset-sm-14 { - grid-column: 14 / span 16; - } - .col-sm-16.offset-sm-15 { - grid-column: 15 / span 16; - } - .col-sm-16.offset-sm-16 { - grid-column: 16 / span 16; - } -} - -@media only screen and (min-width: 768px) { - .col-1, .col-md-1 { - grid-column: span 1; - } - .col-md-1.offset-md-2 { - grid-column: 2 / span 1; - } - .col-md-1.offset-md-3 { - grid-column: 3 / span 1; - } - .col-md-1.offset-md-4 { - grid-column: 4 / span 1; - } - .col-md-1.offset-md-5 { - grid-column: 5 / span 1; - } - .col-md-1.offset-md-6 { - grid-column: 6 / span 1; - } - .col-md-1.offset-md-7 { - grid-column: 7 / span 1; - } - .col-md-1.offset-md-8 { - grid-column: 8 / span 1; - } - .col-md-1.offset-md-9 { - grid-column: 9 / span 1; - } - .col-md-1.offset-md-10 { - grid-column: 10 / span 1; - } - .col-md-1.offset-md-11 { - grid-column: 11 / span 1; - } - .col-md-1.offset-md-12 { - grid-column: 12 / span 1; - } - .col-md-1.offset-md-13 { - grid-column: 13 / span 1; - } - .col-md-1.offset-md-14 { - grid-column: 14 / span 1; - } - .col-md-1.offset-md-15 { - grid-column: 15 / span 1; - } - .col-md-1.offset-md-16 { - grid-column: 16 / span 1; - } - .col-2, .col-md-2 { - grid-column: span 2; - } - .col-md-2.offset-md-2 { - grid-column: 2 / span 2; - } - .col-md-2.offset-md-3 { - grid-column: 3 / span 2; - } - .col-md-2.offset-md-4 { - grid-column: 4 / span 2; - } - .col-md-2.offset-md-5 { - grid-column: 5 / span 2; - } - .col-md-2.offset-md-6 { - grid-column: 6 / span 2; - } - .col-md-2.offset-md-7 { - grid-column: 7 / span 2; - } - .col-md-2.offset-md-8 { - grid-column: 8 / span 2; - } - .col-md-2.offset-md-9 { - grid-column: 9 / span 2; - } - .col-md-2.offset-md-10 { - grid-column: 10 / span 2; - } - .col-md-2.offset-md-11 { - grid-column: 11 / span 2; - } - .col-md-2.offset-md-12 { - grid-column: 12 / span 2; - } - .col-md-2.offset-md-13 { - grid-column: 13 / span 2; - } - .col-md-2.offset-md-14 { - grid-column: 14 / span 2; - } - .col-md-2.offset-md-15 { - grid-column: 15 / span 2; - } - .col-md-2.offset-md-16 { - grid-column: 16 / span 2; - } - .col-3, .col-md-3 { - grid-column: span 3; - } - .col-md-3.offset-md-2 { - grid-column: 2 / span 3; - } - .col-md-3.offset-md-3 { - grid-column: 3 / span 3; - } - .col-md-3.offset-md-4 { - grid-column: 4 / span 3; - } - .col-md-3.offset-md-5 { - grid-column: 5 / span 3; - } - .col-md-3.offset-md-6 { - grid-column: 6 / span 3; - } - .col-md-3.offset-md-7 { - grid-column: 7 / span 3; - } - .col-md-3.offset-md-8 { - grid-column: 8 / span 3; - } - .col-md-3.offset-md-9 { - grid-column: 9 / span 3; - } - .col-md-3.offset-md-10 { - grid-column: 10 / span 3; - } - .col-md-3.offset-md-11 { - grid-column: 11 / span 3; - } - .col-md-3.offset-md-12 { - grid-column: 12 / span 3; - } - .col-md-3.offset-md-13 { - grid-column: 13 / span 3; - } - .col-md-3.offset-md-14 { - grid-column: 14 / span 3; - } - .col-md-3.offset-md-15 { - grid-column: 15 / span 3; - } - .col-md-3.offset-md-16 { - grid-column: 16 / span 3; - } - .col-4, .col-md-4 { - grid-column: span 4; - } - .col-md-4.offset-md-2 { - grid-column: 2 / span 4; - } - .col-md-4.offset-md-3 { - grid-column: 3 / span 4; - } - .col-md-4.offset-md-4 { - grid-column: 4 / span 4; - } - .col-md-4.offset-md-5 { - grid-column: 5 / span 4; - } - .col-md-4.offset-md-6 { - grid-column: 6 / span 4; - } - .col-md-4.offset-md-7 { - grid-column: 7 / span 4; - } - .col-md-4.offset-md-8 { - grid-column: 8 / span 4; - } - .col-md-4.offset-md-9 { - grid-column: 9 / span 4; - } - .col-md-4.offset-md-10 { - grid-column: 10 / span 4; - } - .col-md-4.offset-md-11 { - grid-column: 11 / span 4; - } - .col-md-4.offset-md-12 { - grid-column: 12 / span 4; - } - .col-md-4.offset-md-13 { - grid-column: 13 / span 4; - } - .col-md-4.offset-md-14 { - grid-column: 14 / span 4; - } - .col-md-4.offset-md-15 { - grid-column: 15 / span 4; - } - .col-md-4.offset-md-16 { - grid-column: 16 / span 4; - } - .col-5, .col-md-5 { - grid-column: span 5; - } - .col-md-5.offset-md-2 { - grid-column: 2 / span 5; - } - .col-md-5.offset-md-3 { - grid-column: 3 / span 5; - } - .col-md-5.offset-md-4 { - grid-column: 4 / span 5; - } - .col-md-5.offset-md-5 { - grid-column: 5 / span 5; - } - .col-md-5.offset-md-6 { - grid-column: 6 / span 5; - } - .col-md-5.offset-md-7 { - grid-column: 7 / span 5; - } - .col-md-5.offset-md-8 { - grid-column: 8 / span 5; - } - .col-md-5.offset-md-9 { - grid-column: 9 / span 5; - } - .col-md-5.offset-md-10 { - grid-column: 10 / span 5; - } - .col-md-5.offset-md-11 { - grid-column: 11 / span 5; - } - .col-md-5.offset-md-12 { - grid-column: 12 / span 5; - } - .col-md-5.offset-md-13 { - grid-column: 13 / span 5; - } - .col-md-5.offset-md-14 { - grid-column: 14 / span 5; - } - .col-md-5.offset-md-15 { - grid-column: 15 / span 5; - } - .col-md-5.offset-md-16 { - grid-column: 16 / span 5; - } - .col-6, .col-md-6 { - grid-column: span 6; - } - .col-md-6.offset-md-2 { - grid-column: 2 / span 6; - } - .col-md-6.offset-md-3 { - grid-column: 3 / span 6; - } - .col-md-6.offset-md-4 { - grid-column: 4 / span 6; - } - .col-md-6.offset-md-5 { - grid-column: 5 / span 6; - } - .col-md-6.offset-md-6 { - grid-column: 6 / span 6; - } - .col-md-6.offset-md-7 { - grid-column: 7 / span 6; - } - .col-md-6.offset-md-8 { - grid-column: 8 / span 6; - } - .col-md-6.offset-md-9 { - grid-column: 9 / span 6; - } - .col-md-6.offset-md-10 { - grid-column: 10 / span 6; - } - .col-md-6.offset-md-11 { - grid-column: 11 / span 6; - } - .col-md-6.offset-md-12 { - grid-column: 12 / span 6; - } - .col-md-6.offset-md-13 { - grid-column: 13 / span 6; - } - .col-md-6.offset-md-14 { - grid-column: 14 / span 6; - } - .col-md-6.offset-md-15 { - grid-column: 15 / span 6; - } - .col-md-6.offset-md-16 { - grid-column: 16 / span 6; - } - .col-7, .col-md-7 { - grid-column: span 7; - } - .col-md-7.offset-md-2 { - grid-column: 2 / span 7; - } - .col-md-7.offset-md-3 { - grid-column: 3 / span 7; - } - .col-md-7.offset-md-4 { - grid-column: 4 / span 7; - } - .col-md-7.offset-md-5 { - grid-column: 5 / span 7; - } - .col-md-7.offset-md-6 { - grid-column: 6 / span 7; - } - .col-md-7.offset-md-7 { - grid-column: 7 / span 7; - } - .col-md-7.offset-md-8 { - grid-column: 8 / span 7; - } - .col-md-7.offset-md-9 { - grid-column: 9 / span 7; - } - .col-md-7.offset-md-10 { - grid-column: 10 / span 7; - } - .col-md-7.offset-md-11 { - grid-column: 11 / span 7; - } - .col-md-7.offset-md-12 { - grid-column: 12 / span 7; - } - .col-md-7.offset-md-13 { - grid-column: 13 / span 7; - } - .col-md-7.offset-md-14 { - grid-column: 14 / span 7; - } - .col-md-7.offset-md-15 { - grid-column: 15 / span 7; - } - .col-md-7.offset-md-16 { - grid-column: 16 / span 7; - } - .col-8, .col-md-8 { - grid-column: span 8; - } - .col-md-8.offset-md-2 { - grid-column: 2 / span 8; - } - .col-md-8.offset-md-3 { - grid-column: 3 / span 8; - } - .col-md-8.offset-md-4 { - grid-column: 4 / span 8; - } - .col-md-8.offset-md-5 { - grid-column: 5 / span 8; - } - .col-md-8.offset-md-6 { - grid-column: 6 / span 8; - } - .col-md-8.offset-md-7 { - grid-column: 7 / span 8; - } - .col-md-8.offset-md-8 { - grid-column: 8 / span 8; - } - .col-md-8.offset-md-9 { - grid-column: 9 / span 8; - } - .col-md-8.offset-md-10 { - grid-column: 10 / span 8; - } - .col-md-8.offset-md-11 { - grid-column: 11 / span 8; - } - .col-md-8.offset-md-12 { - grid-column: 12 / span 8; - } - .col-md-8.offset-md-13 { - grid-column: 13 / span 8; - } - .col-md-8.offset-md-14 { - grid-column: 14 / span 8; - } - .col-md-8.offset-md-15 { - grid-column: 15 / span 8; - } - .col-md-8.offset-md-16 { - grid-column: 16 / span 8; - } - .col-9, .col-md-9 { - grid-column: span 9; - } - .col-md-9.offset-md-2 { - grid-column: 2 / span 9; - } - .col-md-9.offset-md-3 { - grid-column: 3 / span 9; - } - .col-md-9.offset-md-4 { - grid-column: 4 / span 9; - } - .col-md-9.offset-md-5 { - grid-column: 5 / span 9; - } - .col-md-9.offset-md-6 { - grid-column: 6 / span 9; - } - .col-md-9.offset-md-7 { - grid-column: 7 / span 9; - } - .col-md-9.offset-md-8 { - grid-column: 8 / span 9; - } - .col-md-9.offset-md-9 { - grid-column: 9 / span 9; - } - .col-md-9.offset-md-10 { - grid-column: 10 / span 9; - } - .col-md-9.offset-md-11 { - grid-column: 11 / span 9; - } - .col-md-9.offset-md-12 { - grid-column: 12 / span 9; - } - .col-md-9.offset-md-13 { - grid-column: 13 / span 9; - } - .col-md-9.offset-md-14 { - grid-column: 14 / span 9; - } - .col-md-9.offset-md-15 { - grid-column: 15 / span 9; - } - .col-md-9.offset-md-16 { - grid-column: 16 / span 9; - } - .col-10, .col-md-10 { - grid-column: span 10; - } - .col-md-10.offset-md-2 { - grid-column: 2 / span 10; - } - .col-md-10.offset-md-3 { - grid-column: 3 / span 10; - } - .col-md-10.offset-md-4 { - grid-column: 4 / span 10; - } - .col-md-10.offset-md-5 { - grid-column: 5 / span 10; - } - .col-md-10.offset-md-6 { - grid-column: 6 / span 10; - } - .col-md-10.offset-md-7 { - grid-column: 7 / span 10; - } - .col-md-10.offset-md-8 { - grid-column: 8 / span 10; - } - .col-md-10.offset-md-9 { - grid-column: 9 / span 10; - } - .col-md-10.offset-md-10 { - grid-column: 10 / span 10; - } - .col-md-10.offset-md-11 { - grid-column: 11 / span 10; - } - .col-md-10.offset-md-12 { - grid-column: 12 / span 10; - } - .col-md-10.offset-md-13 { - grid-column: 13 / span 10; - } - .col-md-10.offset-md-14 { - grid-column: 14 / span 10; - } - .col-md-10.offset-md-15 { - grid-column: 15 / span 10; - } - .col-md-10.offset-md-16 { - grid-column: 16 / span 10; - } - .col-11, .col-md-11 { - grid-column: span 11; - } - .col-md-11.offset-md-2 { - grid-column: 2 / span 11; - } - .col-md-11.offset-md-3 { - grid-column: 3 / span 11; - } - .col-md-11.offset-md-4 { - grid-column: 4 / span 11; - } - .col-md-11.offset-md-5 { - grid-column: 5 / span 11; - } - .col-md-11.offset-md-6 { - grid-column: 6 / span 11; - } - .col-md-11.offset-md-7 { - grid-column: 7 / span 11; - } - .col-md-11.offset-md-8 { - grid-column: 8 / span 11; - } - .col-md-11.offset-md-9 { - grid-column: 9 / span 11; - } - .col-md-11.offset-md-10 { - grid-column: 10 / span 11; - } - .col-md-11.offset-md-11 { - grid-column: 11 / span 11; - } - .col-md-11.offset-md-12 { - grid-column: 12 / span 11; - } - .col-md-11.offset-md-13 { - grid-column: 13 / span 11; - } - .col-md-11.offset-md-14 { - grid-column: 14 / span 11; - } - .col-md-11.offset-md-15 { - grid-column: 15 / span 11; - } - .col-md-11.offset-md-16 { - grid-column: 16 / span 11; - } - .col-12, .col-md-12 { - grid-column: span 12; - } - .col-md-12.offset-md-2 { - grid-column: 2 / span 12; - } - .col-md-12.offset-md-3 { - grid-column: 3 / span 12; - } - .col-md-12.offset-md-4 { - grid-column: 4 / span 12; - } - .col-md-12.offset-md-5 { - grid-column: 5 / span 12; - } - .col-md-12.offset-md-6 { - grid-column: 6 / span 12; - } - .col-md-12.offset-md-7 { - grid-column: 7 / span 12; - } - .col-md-12.offset-md-8 { - grid-column: 8 / span 12; - } - .col-md-12.offset-md-9 { - grid-column: 9 / span 12; - } - .col-md-12.offset-md-10 { - grid-column: 10 / span 12; - } - .col-md-12.offset-md-11 { - grid-column: 11 / span 12; - } - .col-md-12.offset-md-12 { - grid-column: 12 / span 12; - } - .col-md-12.offset-md-13 { - grid-column: 13 / span 12; - } - .col-md-12.offset-md-14 { - grid-column: 14 / span 12; - } - .col-md-12.offset-md-15 { - grid-column: 15 / span 12; - } - .col-md-12.offset-md-16 { - grid-column: 16 / span 12; - } - .col-13, .col-md-13 { - grid-column: span 13; - } - .col-md-13.offset-md-2 { - grid-column: 2 / span 13; - } - .col-md-13.offset-md-3 { - grid-column: 3 / span 13; - } - .col-md-13.offset-md-4 { - grid-column: 4 / span 13; - } - .col-md-13.offset-md-5 { - grid-column: 5 / span 13; - } - .col-md-13.offset-md-6 { - grid-column: 6 / span 13; - } - .col-md-13.offset-md-7 { - grid-column: 7 / span 13; - } - .col-md-13.offset-md-8 { - grid-column: 8 / span 13; - } - .col-md-13.offset-md-9 { - grid-column: 9 / span 13; - } - .col-md-13.offset-md-10 { - grid-column: 10 / span 13; - } - .col-md-13.offset-md-11 { - grid-column: 11 / span 13; - } - .col-md-13.offset-md-12 { - grid-column: 12 / span 13; - } - .col-md-13.offset-md-13 { - grid-column: 13 / span 13; - } - .col-md-13.offset-md-14 { - grid-column: 14 / span 13; - } - .col-md-13.offset-md-15 { - grid-column: 15 / span 13; - } - .col-md-13.offset-md-16 { - grid-column: 16 / span 13; - } - .col-14, .col-md-14 { - grid-column: span 14; - } - .col-md-14.offset-md-2 { - grid-column: 2 / span 14; - } - .col-md-14.offset-md-3 { - grid-column: 3 / span 14; - } - .col-md-14.offset-md-4 { - grid-column: 4 / span 14; - } - .col-md-14.offset-md-5 { - grid-column: 5 / span 14; - } - .col-md-14.offset-md-6 { - grid-column: 6 / span 14; - } - .col-md-14.offset-md-7 { - grid-column: 7 / span 14; - } - .col-md-14.offset-md-8 { - grid-column: 8 / span 14; - } - .col-md-14.offset-md-9 { - grid-column: 9 / span 14; - } - .col-md-14.offset-md-10 { - grid-column: 10 / span 14; - } - .col-md-14.offset-md-11 { - grid-column: 11 / span 14; - } - .col-md-14.offset-md-12 { - grid-column: 12 / span 14; - } - .col-md-14.offset-md-13 { - grid-column: 13 / span 14; - } - .col-md-14.offset-md-14 { - grid-column: 14 / span 14; - } - .col-md-14.offset-md-15 { - grid-column: 15 / span 14; - } - .col-md-14.offset-md-16 { - grid-column: 16 / span 14; - } - .col-15, .col-md-15 { - grid-column: span 15; - } - .col-md-15.offset-md-2 { - grid-column: 2 / span 15; - } - .col-md-15.offset-md-3 { - grid-column: 3 / span 15; - } - .col-md-15.offset-md-4 { - grid-column: 4 / span 15; - } - .col-md-15.offset-md-5 { - grid-column: 5 / span 15; - } - .col-md-15.offset-md-6 { - grid-column: 6 / span 15; - } - .col-md-15.offset-md-7 { - grid-column: 7 / span 15; - } - .col-md-15.offset-md-8 { - grid-column: 8 / span 15; - } - .col-md-15.offset-md-9 { - grid-column: 9 / span 15; - } - .col-md-15.offset-md-10 { - grid-column: 10 / span 15; - } - .col-md-15.offset-md-11 { - grid-column: 11 / span 15; - } - .col-md-15.offset-md-12 { - grid-column: 12 / span 15; - } - .col-md-15.offset-md-13 { - grid-column: 13 / span 15; - } - .col-md-15.offset-md-14 { - grid-column: 14 / span 15; - } - .col-md-15.offset-md-15 { - grid-column: 15 / span 15; - } - .col-md-15.offset-md-16 { - grid-column: 16 / span 15; - } - .col-16, .col-md-16 { - grid-column: span 16; - } - .col-md-16.offset-md-2 { - grid-column: 2 / span 16; - } - .col-md-16.offset-md-3 { - grid-column: 3 / span 16; - } - .col-md-16.offset-md-4 { - grid-column: 4 / span 16; - } - .col-md-16.offset-md-5 { - grid-column: 5 / span 16; - } - .col-md-16.offset-md-6 { - grid-column: 6 / span 16; - } - .col-md-16.offset-md-7 { - grid-column: 7 / span 16; - } - .col-md-16.offset-md-8 { - grid-column: 8 / span 16; - } - .col-md-16.offset-md-9 { - grid-column: 9 / span 16; - } - .col-md-16.offset-md-10 { - grid-column: 10 / span 16; - } - .col-md-16.offset-md-11 { - grid-column: 11 / span 16; - } - .col-md-16.offset-md-12 { - grid-column: 12 / span 16; - } - .col-md-16.offset-md-13 { - grid-column: 13 / span 16; - } - .col-md-16.offset-md-14 { - grid-column: 14 / span 16; - } - .col-md-16.offset-md-15 { - grid-column: 15 / span 16; - } - .col-md-16.offset-md-16 { - grid-column: 16 / span 16; - } -} - -@media only screen and (min-width: 992px) { - .col-1, .col-lg-1 { - grid-column: span 1; - } - .col-lg-1.offset-lg-2 { - grid-column: 2 / span 1; - } - .col-lg-1.offset-lg-3 { - grid-column: 3 / span 1; - } - .col-lg-1.offset-lg-4 { - grid-column: 4 / span 1; - } - .col-lg-1.offset-lg-5 { - grid-column: 5 / span 1; - } - .col-lg-1.offset-lg-6 { - grid-column: 6 / span 1; - } - .col-lg-1.offset-lg-7 { - grid-column: 7 / span 1; - } - .col-lg-1.offset-lg-8 { - grid-column: 8 / span 1; - } - .col-lg-1.offset-lg-9 { - grid-column: 9 / span 1; - } - .col-lg-1.offset-lg-10 { - grid-column: 10 / span 1; - } - .col-lg-1.offset-lg-11 { - grid-column: 11 / span 1; - } - .col-lg-1.offset-lg-12 { - grid-column: 12 / span 1; - } - .col-lg-1.offset-lg-13 { - grid-column: 13 / span 1; - } - .col-lg-1.offset-lg-14 { - grid-column: 14 / span 1; - } - .col-lg-1.offset-lg-15 { - grid-column: 15 / span 1; - } - .col-lg-1.offset-lg-16 { - grid-column: 16 / span 1; - } - .col-2, .col-lg-2 { - grid-column: span 2; - } - .col-lg-2.offset-lg-2 { - grid-column: 2 / span 2; - } - .col-lg-2.offset-lg-3 { - grid-column: 3 / span 2; - } - .col-lg-2.offset-lg-4 { - grid-column: 4 / span 2; - } - .col-lg-2.offset-lg-5 { - grid-column: 5 / span 2; - } - .col-lg-2.offset-lg-6 { - grid-column: 6 / span 2; - } - .col-lg-2.offset-lg-7 { - grid-column: 7 / span 2; - } - .col-lg-2.offset-lg-8 { - grid-column: 8 / span 2; - } - .col-lg-2.offset-lg-9 { - grid-column: 9 / span 2; - } - .col-lg-2.offset-lg-10 { - grid-column: 10 / span 2; - } - .col-lg-2.offset-lg-11 { - grid-column: 11 / span 2; - } - .col-lg-2.offset-lg-12 { - grid-column: 12 / span 2; - } - .col-lg-2.offset-lg-13 { - grid-column: 13 / span 2; - } - .col-lg-2.offset-lg-14 { - grid-column: 14 / span 2; - } - .col-lg-2.offset-lg-15 { - grid-column: 15 / span 2; - } - .col-lg-2.offset-lg-16 { - grid-column: 16 / span 2; - } - .col-3, .col-lg-3 { - grid-column: span 3; - } - .col-lg-3.offset-lg-2 { - grid-column: 2 / span 3; - } - .col-lg-3.offset-lg-3 { - grid-column: 3 / span 3; - } - .col-lg-3.offset-lg-4 { - grid-column: 4 / span 3; - } - .col-lg-3.offset-lg-5 { - grid-column: 5 / span 3; - } - .col-lg-3.offset-lg-6 { - grid-column: 6 / span 3; - } - .col-lg-3.offset-lg-7 { - grid-column: 7 / span 3; - } - .col-lg-3.offset-lg-8 { - grid-column: 8 / span 3; - } - .col-lg-3.offset-lg-9 { - grid-column: 9 / span 3; - } - .col-lg-3.offset-lg-10 { - grid-column: 10 / span 3; - } - .col-lg-3.offset-lg-11 { - grid-column: 11 / span 3; - } - .col-lg-3.offset-lg-12 { - grid-column: 12 / span 3; - } - .col-lg-3.offset-lg-13 { - grid-column: 13 / span 3; - } - .col-lg-3.offset-lg-14 { - grid-column: 14 / span 3; - } - .col-lg-3.offset-lg-15 { - grid-column: 15 / span 3; - } - .col-lg-3.offset-lg-16 { - grid-column: 16 / span 3; - } - .col-4, .col-lg-4 { - grid-column: span 4; - } - .col-lg-4.offset-lg-2 { - grid-column: 2 / span 4; - } - .col-lg-4.offset-lg-3 { - grid-column: 3 / span 4; - } - .col-lg-4.offset-lg-4 { - grid-column: 4 / span 4; - } - .col-lg-4.offset-lg-5 { - grid-column: 5 / span 4; - } - .col-lg-4.offset-lg-6 { - grid-column: 6 / span 4; - } - .col-lg-4.offset-lg-7 { - grid-column: 7 / span 4; - } - .col-lg-4.offset-lg-8 { - grid-column: 8 / span 4; - } - .col-lg-4.offset-lg-9 { - grid-column: 9 / span 4; - } - .col-lg-4.offset-lg-10 { - grid-column: 10 / span 4; - } - .col-lg-4.offset-lg-11 { - grid-column: 11 / span 4; - } - .col-lg-4.offset-lg-12 { - grid-column: 12 / span 4; - } - .col-lg-4.offset-lg-13 { - grid-column: 13 / span 4; - } - .col-lg-4.offset-lg-14 { - grid-column: 14 / span 4; - } - .col-lg-4.offset-lg-15 { - grid-column: 15 / span 4; - } - .col-lg-4.offset-lg-16 { - grid-column: 16 / span 4; - } - .col-5, .col-lg-5 { - grid-column: span 5; - } - .col-lg-5.offset-lg-2 { - grid-column: 2 / span 5; - } - .col-lg-5.offset-lg-3 { - grid-column: 3 / span 5; - } - .col-lg-5.offset-lg-4 { - grid-column: 4 / span 5; - } - .col-lg-5.offset-lg-5 { - grid-column: 5 / span 5; - } - .col-lg-5.offset-lg-6 { - grid-column: 6 / span 5; - } - .col-lg-5.offset-lg-7 { - grid-column: 7 / span 5; - } - .col-lg-5.offset-lg-8 { - grid-column: 8 / span 5; - } - .col-lg-5.offset-lg-9 { - grid-column: 9 / span 5; - } - .col-lg-5.offset-lg-10 { - grid-column: 10 / span 5; - } - .col-lg-5.offset-lg-11 { - grid-column: 11 / span 5; - } - .col-lg-5.offset-lg-12 { - grid-column: 12 / span 5; - } - .col-lg-5.offset-lg-13 { - grid-column: 13 / span 5; - } - .col-lg-5.offset-lg-14 { - grid-column: 14 / span 5; - } - .col-lg-5.offset-lg-15 { - grid-column: 15 / span 5; - } - .col-lg-5.offset-lg-16 { - grid-column: 16 / span 5; - } - .col-6, .col-lg-6 { - grid-column: span 6; - } - .col-lg-6.offset-lg-2 { - grid-column: 2 / span 6; - } - .col-lg-6.offset-lg-3 { - grid-column: 3 / span 6; - } - .col-lg-6.offset-lg-4 { - grid-column: 4 / span 6; - } - .col-lg-6.offset-lg-5 { - grid-column: 5 / span 6; - } - .col-lg-6.offset-lg-6 { - grid-column: 6 / span 6; - } - .col-lg-6.offset-lg-7 { - grid-column: 7 / span 6; - } - .col-lg-6.offset-lg-8 { - grid-column: 8 / span 6; - } - .col-lg-6.offset-lg-9 { - grid-column: 9 / span 6; - } - .col-lg-6.offset-lg-10 { - grid-column: 10 / span 6; - } - .col-lg-6.offset-lg-11 { - grid-column: 11 / span 6; - } - .col-lg-6.offset-lg-12 { - grid-column: 12 / span 6; - } - .col-lg-6.offset-lg-13 { - grid-column: 13 / span 6; - } - .col-lg-6.offset-lg-14 { - grid-column: 14 / span 6; - } - .col-lg-6.offset-lg-15 { - grid-column: 15 / span 6; - } - .col-lg-6.offset-lg-16 { - grid-column: 16 / span 6; - } - .col-7, .col-lg-7 { - grid-column: span 7; - } - .col-lg-7.offset-lg-2 { - grid-column: 2 / span 7; - } - .col-lg-7.offset-lg-3 { - grid-column: 3 / span 7; - } - .col-lg-7.offset-lg-4 { - grid-column: 4 / span 7; - } - .col-lg-7.offset-lg-5 { - grid-column: 5 / span 7; - } - .col-lg-7.offset-lg-6 { - grid-column: 6 / span 7; - } - .col-lg-7.offset-lg-7 { - grid-column: 7 / span 7; - } - .col-lg-7.offset-lg-8 { - grid-column: 8 / span 7; - } - .col-lg-7.offset-lg-9 { - grid-column: 9 / span 7; - } - .col-lg-7.offset-lg-10 { - grid-column: 10 / span 7; - } - .col-lg-7.offset-lg-11 { - grid-column: 11 / span 7; - } - .col-lg-7.offset-lg-12 { - grid-column: 12 / span 7; - } - .col-lg-7.offset-lg-13 { - grid-column: 13 / span 7; - } - .col-lg-7.offset-lg-14 { - grid-column: 14 / span 7; - } - .col-lg-7.offset-lg-15 { - grid-column: 15 / span 7; - } - .col-lg-7.offset-lg-16 { - grid-column: 16 / span 7; - } - .col-8, .col-lg-8 { - grid-column: span 8; - } - .col-lg-8.offset-lg-2 { - grid-column: 2 / span 8; - } - .col-lg-8.offset-lg-3 { - grid-column: 3 / span 8; - } - .col-lg-8.offset-lg-4 { - grid-column: 4 / span 8; - } - .col-lg-8.offset-lg-5 { - grid-column: 5 / span 8; - } - .col-lg-8.offset-lg-6 { - grid-column: 6 / span 8; - } - .col-lg-8.offset-lg-7 { - grid-column: 7 / span 8; - } - .col-lg-8.offset-lg-8 { - grid-column: 8 / span 8; - } - .col-lg-8.offset-lg-9 { - grid-column: 9 / span 8; - } - .col-lg-8.offset-lg-10 { - grid-column: 10 / span 8; - } - .col-lg-8.offset-lg-11 { - grid-column: 11 / span 8; - } - .col-lg-8.offset-lg-12 { - grid-column: 12 / span 8; - } - .col-lg-8.offset-lg-13 { - grid-column: 13 / span 8; - } - .col-lg-8.offset-lg-14 { - grid-column: 14 / span 8; - } - .col-lg-8.offset-lg-15 { - grid-column: 15 / span 8; - } - .col-lg-8.offset-lg-16 { - grid-column: 16 / span 8; - } - .col-9, .col-lg-9 { - grid-column: span 9; - } - .col-lg-9.offset-lg-2 { - grid-column: 2 / span 9; - } - .col-lg-9.offset-lg-3 { - grid-column: 3 / span 9; - } - .col-lg-9.offset-lg-4 { - grid-column: 4 / span 9; - } - .col-lg-9.offset-lg-5 { - grid-column: 5 / span 9; - } - .col-lg-9.offset-lg-6 { - grid-column: 6 / span 9; - } - .col-lg-9.offset-lg-7 { - grid-column: 7 / span 9; - } - .col-lg-9.offset-lg-8 { - grid-column: 8 / span 9; - } - .col-lg-9.offset-lg-9 { - grid-column: 9 / span 9; - } - .col-lg-9.offset-lg-10 { - grid-column: 10 / span 9; - } - .col-lg-9.offset-lg-11 { - grid-column: 11 / span 9; - } - .col-lg-9.offset-lg-12 { - grid-column: 12 / span 9; - } - .col-lg-9.offset-lg-13 { - grid-column: 13 / span 9; - } - .col-lg-9.offset-lg-14 { - grid-column: 14 / span 9; - } - .col-lg-9.offset-lg-15 { - grid-column: 15 / span 9; - } - .col-lg-9.offset-lg-16 { - grid-column: 16 / span 9; - } - .col-10, .col-lg-10 { - grid-column: span 10; - } - .col-lg-10.offset-lg-2 { - grid-column: 2 / span 10; - } - .col-lg-10.offset-lg-3 { - grid-column: 3 / span 10; - } - .col-lg-10.offset-lg-4 { - grid-column: 4 / span 10; - } - .col-lg-10.offset-lg-5 { - grid-column: 5 / span 10; - } - .col-lg-10.offset-lg-6 { - grid-column: 6 / span 10; - } - .col-lg-10.offset-lg-7 { - grid-column: 7 / span 10; - } - .col-lg-10.offset-lg-8 { - grid-column: 8 / span 10; - } - .col-lg-10.offset-lg-9 { - grid-column: 9 / span 10; - } - .col-lg-10.offset-lg-10 { - grid-column: 10 / span 10; - } - .col-lg-10.offset-lg-11 { - grid-column: 11 / span 10; - } - .col-lg-10.offset-lg-12 { - grid-column: 12 / span 10; - } - .col-lg-10.offset-lg-13 { - grid-column: 13 / span 10; - } - .col-lg-10.offset-lg-14 { - grid-column: 14 / span 10; - } - .col-lg-10.offset-lg-15 { - grid-column: 15 / span 10; - } - .col-lg-10.offset-lg-16 { - grid-column: 16 / span 10; - } - .col-11, .col-lg-11 { - grid-column: span 11; - } - .col-lg-11.offset-lg-2 { - grid-column: 2 / span 11; - } - .col-lg-11.offset-lg-3 { - grid-column: 3 / span 11; - } - .col-lg-11.offset-lg-4 { - grid-column: 4 / span 11; - } - .col-lg-11.offset-lg-5 { - grid-column: 5 / span 11; - } - .col-lg-11.offset-lg-6 { - grid-column: 6 / span 11; - } - .col-lg-11.offset-lg-7 { - grid-column: 7 / span 11; - } - .col-lg-11.offset-lg-8 { - grid-column: 8 / span 11; - } - .col-lg-11.offset-lg-9 { - grid-column: 9 / span 11; - } - .col-lg-11.offset-lg-10 { - grid-column: 10 / span 11; - } - .col-lg-11.offset-lg-11 { - grid-column: 11 / span 11; - } - .col-lg-11.offset-lg-12 { - grid-column: 12 / span 11; - } - .col-lg-11.offset-lg-13 { - grid-column: 13 / span 11; - } - .col-lg-11.offset-lg-14 { - grid-column: 14 / span 11; - } - .col-lg-11.offset-lg-15 { - grid-column: 15 / span 11; - } - .col-lg-11.offset-lg-16 { - grid-column: 16 / span 11; - } - .col-12, .col-lg-12 { - grid-column: span 12; - } - .col-lg-12.offset-lg-2 { - grid-column: 2 / span 12; - } - .col-lg-12.offset-lg-3 { - grid-column: 3 / span 12; - } - .col-lg-12.offset-lg-4 { - grid-column: 4 / span 12; - } - .col-lg-12.offset-lg-5 { - grid-column: 5 / span 12; - } - .col-lg-12.offset-lg-6 { - grid-column: 6 / span 12; - } - .col-lg-12.offset-lg-7 { - grid-column: 7 / span 12; - } - .col-lg-12.offset-lg-8 { - grid-column: 8 / span 12; - } - .col-lg-12.offset-lg-9 { - grid-column: 9 / span 12; - } - .col-lg-12.offset-lg-10 { - grid-column: 10 / span 12; - } - .col-lg-12.offset-lg-11 { - grid-column: 11 / span 12; - } - .col-lg-12.offset-lg-12 { - grid-column: 12 / span 12; - } - .col-lg-12.offset-lg-13 { - grid-column: 13 / span 12; - } - .col-lg-12.offset-lg-14 { - grid-column: 14 / span 12; - } - .col-lg-12.offset-lg-15 { - grid-column: 15 / span 12; - } - .col-lg-12.offset-lg-16 { - grid-column: 16 / span 12; - } - .col-13, .col-lg-13 { - grid-column: span 13; - } - .col-lg-13.offset-lg-2 { - grid-column: 2 / span 13; - } - .col-lg-13.offset-lg-3 { - grid-column: 3 / span 13; - } - .col-lg-13.offset-lg-4 { - grid-column: 4 / span 13; - } - .col-lg-13.offset-lg-5 { - grid-column: 5 / span 13; - } - .col-lg-13.offset-lg-6 { - grid-column: 6 / span 13; - } - .col-lg-13.offset-lg-7 { - grid-column: 7 / span 13; - } - .col-lg-13.offset-lg-8 { - grid-column: 8 / span 13; - } - .col-lg-13.offset-lg-9 { - grid-column: 9 / span 13; - } - .col-lg-13.offset-lg-10 { - grid-column: 10 / span 13; - } - .col-lg-13.offset-lg-11 { - grid-column: 11 / span 13; - } - .col-lg-13.offset-lg-12 { - grid-column: 12 / span 13; - } - .col-lg-13.offset-lg-13 { - grid-column: 13 / span 13; - } - .col-lg-13.offset-lg-14 { - grid-column: 14 / span 13; - } - .col-lg-13.offset-lg-15 { - grid-column: 15 / span 13; - } - .col-lg-13.offset-lg-16 { - grid-column: 16 / span 13; - } - .col-14, .col-lg-14 { - grid-column: span 14; - } - .col-lg-14.offset-lg-2 { - grid-column: 2 / span 14; - } - .col-lg-14.offset-lg-3 { - grid-column: 3 / span 14; - } - .col-lg-14.offset-lg-4 { - grid-column: 4 / span 14; - } - .col-lg-14.offset-lg-5 { - grid-column: 5 / span 14; - } - .col-lg-14.offset-lg-6 { - grid-column: 6 / span 14; - } - .col-lg-14.offset-lg-7 { - grid-column: 7 / span 14; - } - .col-lg-14.offset-lg-8 { - grid-column: 8 / span 14; - } - .col-lg-14.offset-lg-9 { - grid-column: 9 / span 14; - } - .col-lg-14.offset-lg-10 { - grid-column: 10 / span 14; - } - .col-lg-14.offset-lg-11 { - grid-column: 11 / span 14; - } - .col-lg-14.offset-lg-12 { - grid-column: 12 / span 14; - } - .col-lg-14.offset-lg-13 { - grid-column: 13 / span 14; - } - .col-lg-14.offset-lg-14 { - grid-column: 14 / span 14; - } - .col-lg-14.offset-lg-15 { - grid-column: 15 / span 14; - } - .col-lg-14.offset-lg-16 { - grid-column: 16 / span 14; - } - .col-15, .col-lg-15 { - grid-column: span 15; - } - .col-lg-15.offset-lg-2 { - grid-column: 2 / span 15; - } - .col-lg-15.offset-lg-3 { - grid-column: 3 / span 15; - } - .col-lg-15.offset-lg-4 { - grid-column: 4 / span 15; - } - .col-lg-15.offset-lg-5 { - grid-column: 5 / span 15; - } - .col-lg-15.offset-lg-6 { - grid-column: 6 / span 15; - } - .col-lg-15.offset-lg-7 { - grid-column: 7 / span 15; - } - .col-lg-15.offset-lg-8 { - grid-column: 8 / span 15; - } - .col-lg-15.offset-lg-9 { - grid-column: 9 / span 15; - } - .col-lg-15.offset-lg-10 { - grid-column: 10 / span 15; - } - .col-lg-15.offset-lg-11 { - grid-column: 11 / span 15; - } - .col-lg-15.offset-lg-12 { - grid-column: 12 / span 15; - } - .col-lg-15.offset-lg-13 { - grid-column: 13 / span 15; - } - .col-lg-15.offset-lg-14 { - grid-column: 14 / span 15; - } - .col-lg-15.offset-lg-15 { - grid-column: 15 / span 15; - } - .col-lg-15.offset-lg-16 { - grid-column: 16 / span 15; - } - .col-16, .col-lg-16 { - grid-column: span 16; - } - .col-lg-16.offset-lg-2 { - grid-column: 2 / span 16; - } - .col-lg-16.offset-lg-3 { - grid-column: 3 / span 16; - } - .col-lg-16.offset-lg-4 { - grid-column: 4 / span 16; - } - .col-lg-16.offset-lg-5 { - grid-column: 5 / span 16; - } - .col-lg-16.offset-lg-6 { - grid-column: 6 / span 16; - } - .col-lg-16.offset-lg-7 { - grid-column: 7 / span 16; - } - .col-lg-16.offset-lg-8 { - grid-column: 8 / span 16; - } - .col-lg-16.offset-lg-9 { - grid-column: 9 / span 16; - } - .col-lg-16.offset-lg-10 { - grid-column: 10 / span 16; - } - .col-lg-16.offset-lg-11 { - grid-column: 11 / span 16; - } - .col-lg-16.offset-lg-12 { - grid-column: 12 / span 16; - } - .col-lg-16.offset-lg-13 { - grid-column: 13 / span 16; - } - .col-lg-16.offset-lg-14 { - grid-column: 14 / span 16; - } - .col-lg-16.offset-lg-15 { - grid-column: 15 / span 16; - } - .col-lg-16.offset-lg-16 { - grid-column: 16 / span 16; - } -} - -@media only screen and (min-width: 1260px) { - .col-1, .col-xl-1 { - grid-column: span 1; - } - .col-xl-1.offset-xl-2 { - grid-column: 2 / span 1; - } - .col-xl-1.offset-xl-3 { - grid-column: 3 / span 1; - } - .col-xl-1.offset-xl-4 { - grid-column: 4 / span 1; - } - .col-xl-1.offset-xl-5 { - grid-column: 5 / span 1; - } - .col-xl-1.offset-xl-6 { - grid-column: 6 / span 1; - } - .col-xl-1.offset-xl-7 { - grid-column: 7 / span 1; - } - .col-xl-1.offset-xl-8 { - grid-column: 8 / span 1; - } - .col-xl-1.offset-xl-9 { - grid-column: 9 / span 1; - } - .col-xl-1.offset-xl-10 { - grid-column: 10 / span 1; - } - .col-xl-1.offset-xl-11 { - grid-column: 11 / span 1; - } - .col-xl-1.offset-xl-12 { - grid-column: 12 / span 1; - } - .col-xl-1.offset-xl-13 { - grid-column: 13 / span 1; - } - .col-xl-1.offset-xl-14 { - grid-column: 14 / span 1; - } - .col-xl-1.offset-xl-15 { - grid-column: 15 / span 1; - } - .col-xl-1.offset-xl-16 { - grid-column: 16 / span 1; - } - .col-2, .col-xl-2 { - grid-column: span 2; - } - .col-xl-2.offset-xl-2 { - grid-column: 2 / span 2; - } - .col-xl-2.offset-xl-3 { - grid-column: 3 / span 2; - } - .col-xl-2.offset-xl-4 { - grid-column: 4 / span 2; - } - .col-xl-2.offset-xl-5 { - grid-column: 5 / span 2; - } - .col-xl-2.offset-xl-6 { - grid-column: 6 / span 2; - } - .col-xl-2.offset-xl-7 { - grid-column: 7 / span 2; - } - .col-xl-2.offset-xl-8 { - grid-column: 8 / span 2; - } - .col-xl-2.offset-xl-9 { - grid-column: 9 / span 2; - } - .col-xl-2.offset-xl-10 { - grid-column: 10 / span 2; - } - .col-xl-2.offset-xl-11 { - grid-column: 11 / span 2; - } - .col-xl-2.offset-xl-12 { - grid-column: 12 / span 2; - } - .col-xl-2.offset-xl-13 { - grid-column: 13 / span 2; - } - .col-xl-2.offset-xl-14 { - grid-column: 14 / span 2; - } - .col-xl-2.offset-xl-15 { - grid-column: 15 / span 2; - } - .col-xl-2.offset-xl-16 { - grid-column: 16 / span 2; - } - .col-3, .col-xl-3 { - grid-column: span 3; - } - .col-xl-3.offset-xl-2 { - grid-column: 2 / span 3; - } - .col-xl-3.offset-xl-3 { - grid-column: 3 / span 3; - } - .col-xl-3.offset-xl-4 { - grid-column: 4 / span 3; - } - .col-xl-3.offset-xl-5 { - grid-column: 5 / span 3; - } - .col-xl-3.offset-xl-6 { - grid-column: 6 / span 3; - } - .col-xl-3.offset-xl-7 { - grid-column: 7 / span 3; - } - .col-xl-3.offset-xl-8 { - grid-column: 8 / span 3; - } - .col-xl-3.offset-xl-9 { - grid-column: 9 / span 3; - } - .col-xl-3.offset-xl-10 { - grid-column: 10 / span 3; - } - .col-xl-3.offset-xl-11 { - grid-column: 11 / span 3; - } - .col-xl-3.offset-xl-12 { - grid-column: 12 / span 3; - } - .col-xl-3.offset-xl-13 { - grid-column: 13 / span 3; - } - .col-xl-3.offset-xl-14 { - grid-column: 14 / span 3; - } - .col-xl-3.offset-xl-15 { - grid-column: 15 / span 3; - } - .col-xl-3.offset-xl-16 { - grid-column: 16 / span 3; - } - .col-4, .col-xl-4 { - grid-column: span 4; - } - .col-xl-4.offset-xl-2 { - grid-column: 2 / span 4; - } - .col-xl-4.offset-xl-3 { - grid-column: 3 / span 4; - } - .col-xl-4.offset-xl-4 { - grid-column: 4 / span 4; - } - .col-xl-4.offset-xl-5 { - grid-column: 5 / span 4; - } - .col-xl-4.offset-xl-6 { - grid-column: 6 / span 4; - } - .col-xl-4.offset-xl-7 { - grid-column: 7 / span 4; - } - .col-xl-4.offset-xl-8 { - grid-column: 8 / span 4; - } - .col-xl-4.offset-xl-9 { - grid-column: 9 / span 4; - } - .col-xl-4.offset-xl-10 { - grid-column: 10 / span 4; - } - .col-xl-4.offset-xl-11 { - grid-column: 11 / span 4; - } - .col-xl-4.offset-xl-12 { - grid-column: 12 / span 4; - } - .col-xl-4.offset-xl-13 { - grid-column: 13 / span 4; - } - .col-xl-4.offset-xl-14 { - grid-column: 14 / span 4; - } - .col-xl-4.offset-xl-15 { - grid-column: 15 / span 4; - } - .col-xl-4.offset-xl-16 { - grid-column: 16 / span 4; - } - .col-5, .col-xl-5 { - grid-column: span 5; - } - .col-xl-5.offset-xl-2 { - grid-column: 2 / span 5; - } - .col-xl-5.offset-xl-3 { - grid-column: 3 / span 5; - } - .col-xl-5.offset-xl-4 { - grid-column: 4 / span 5; - } - .col-xl-5.offset-xl-5 { - grid-column: 5 / span 5; - } - .col-xl-5.offset-xl-6 { - grid-column: 6 / span 5; - } - .col-xl-5.offset-xl-7 { - grid-column: 7 / span 5; - } - .col-xl-5.offset-xl-8 { - grid-column: 8 / span 5; - } - .col-xl-5.offset-xl-9 { - grid-column: 9 / span 5; - } - .col-xl-5.offset-xl-10 { - grid-column: 10 / span 5; - } - .col-xl-5.offset-xl-11 { - grid-column: 11 / span 5; - } - .col-xl-5.offset-xl-12 { - grid-column: 12 / span 5; - } - .col-xl-5.offset-xl-13 { - grid-column: 13 / span 5; - } - .col-xl-5.offset-xl-14 { - grid-column: 14 / span 5; - } - .col-xl-5.offset-xl-15 { - grid-column: 15 / span 5; - } - .col-xl-5.offset-xl-16 { - grid-column: 16 / span 5; - } - .col-6, .col-xl-6 { - grid-column: span 6; - } - .col-xl-6.offset-xl-2 { - grid-column: 2 / span 6; - } - .col-xl-6.offset-xl-3 { - grid-column: 3 / span 6; - } - .col-xl-6.offset-xl-4 { - grid-column: 4 / span 6; - } - .col-xl-6.offset-xl-5 { - grid-column: 5 / span 6; - } - .col-xl-6.offset-xl-6 { - grid-column: 6 / span 6; - } - .col-xl-6.offset-xl-7 { - grid-column: 7 / span 6; - } - .col-xl-6.offset-xl-8 { - grid-column: 8 / span 6; - } - .col-xl-6.offset-xl-9 { - grid-column: 9 / span 6; - } - .col-xl-6.offset-xl-10 { - grid-column: 10 / span 6; - } - .col-xl-6.offset-xl-11 { - grid-column: 11 / span 6; - } - .col-xl-6.offset-xl-12 { - grid-column: 12 / span 6; - } - .col-xl-6.offset-xl-13 { - grid-column: 13 / span 6; - } - .col-xl-6.offset-xl-14 { - grid-column: 14 / span 6; - } - .col-xl-6.offset-xl-15 { - grid-column: 15 / span 6; - } - .col-xl-6.offset-xl-16 { - grid-column: 16 / span 6; - } - .col-7, .col-xl-7 { - grid-column: span 7; - } - .col-xl-7.offset-xl-2 { - grid-column: 2 / span 7; - } - .col-xl-7.offset-xl-3 { - grid-column: 3 / span 7; - } - .col-xl-7.offset-xl-4 { - grid-column: 4 / span 7; - } - .col-xl-7.offset-xl-5 { - grid-column: 5 / span 7; - } - .col-xl-7.offset-xl-6 { - grid-column: 6 / span 7; - } - .col-xl-7.offset-xl-7 { - grid-column: 7 / span 7; - } - .col-xl-7.offset-xl-8 { - grid-column: 8 / span 7; - } - .col-xl-7.offset-xl-9 { - grid-column: 9 / span 7; - } - .col-xl-7.offset-xl-10 { - grid-column: 10 / span 7; - } - .col-xl-7.offset-xl-11 { - grid-column: 11 / span 7; - } - .col-xl-7.offset-xl-12 { - grid-column: 12 / span 7; - } - .col-xl-7.offset-xl-13 { - grid-column: 13 / span 7; - } - .col-xl-7.offset-xl-14 { - grid-column: 14 / span 7; - } - .col-xl-7.offset-xl-15 { - grid-column: 15 / span 7; - } - .col-xl-7.offset-xl-16 { - grid-column: 16 / span 7; - } - .col-8, .col-xl-8 { - grid-column: span 8; - } - .col-xl-8.offset-xl-2 { - grid-column: 2 / span 8; - } - .col-xl-8.offset-xl-3 { - grid-column: 3 / span 8; - } - .col-xl-8.offset-xl-4 { - grid-column: 4 / span 8; - } - .col-xl-8.offset-xl-5 { - grid-column: 5 / span 8; - } - .col-xl-8.offset-xl-6 { - grid-column: 6 / span 8; - } - .col-xl-8.offset-xl-7 { - grid-column: 7 / span 8; - } - .col-xl-8.offset-xl-8 { - grid-column: 8 / span 8; - } - .col-xl-8.offset-xl-9 { - grid-column: 9 / span 8; - } - .col-xl-8.offset-xl-10 { - grid-column: 10 / span 8; - } - .col-xl-8.offset-xl-11 { - grid-column: 11 / span 8; - } - .col-xl-8.offset-xl-12 { - grid-column: 12 / span 8; - } - .col-xl-8.offset-xl-13 { - grid-column: 13 / span 8; - } - .col-xl-8.offset-xl-14 { - grid-column: 14 / span 8; - } - .col-xl-8.offset-xl-15 { - grid-column: 15 / span 8; - } - .col-xl-8.offset-xl-16 { - grid-column: 16 / span 8; - } - .col-9, .col-xl-9 { - grid-column: span 9; - } - .col-xl-9.offset-xl-2 { - grid-column: 2 / span 9; - } - .col-xl-9.offset-xl-3 { - grid-column: 3 / span 9; - } - .col-xl-9.offset-xl-4 { - grid-column: 4 / span 9; - } - .col-xl-9.offset-xl-5 { - grid-column: 5 / span 9; - } - .col-xl-9.offset-xl-6 { - grid-column: 6 / span 9; - } - .col-xl-9.offset-xl-7 { - grid-column: 7 / span 9; - } - .col-xl-9.offset-xl-8 { - grid-column: 8 / span 9; - } - .col-xl-9.offset-xl-9 { - grid-column: 9 / span 9; - } - .col-xl-9.offset-xl-10 { - grid-column: 10 / span 9; - } - .col-xl-9.offset-xl-11 { - grid-column: 11 / span 9; - } - .col-xl-9.offset-xl-12 { - grid-column: 12 / span 9; - } - .col-xl-9.offset-xl-13 { - grid-column: 13 / span 9; - } - .col-xl-9.offset-xl-14 { - grid-column: 14 / span 9; - } - .col-xl-9.offset-xl-15 { - grid-column: 15 / span 9; - } - .col-xl-9.offset-xl-16 { - grid-column: 16 / span 9; - } - .col-10, .col-xl-10 { - grid-column: span 10; - } - .col-xl-10.offset-xl-2 { - grid-column: 2 / span 10; - } - .col-xl-10.offset-xl-3 { - grid-column: 3 / span 10; - } - .col-xl-10.offset-xl-4 { - grid-column: 4 / span 10; - } - .col-xl-10.offset-xl-5 { - grid-column: 5 / span 10; - } - .col-xl-10.offset-xl-6 { - grid-column: 6 / span 10; - } - .col-xl-10.offset-xl-7 { - grid-column: 7 / span 10; - } - .col-xl-10.offset-xl-8 { - grid-column: 8 / span 10; - } - .col-xl-10.offset-xl-9 { - grid-column: 9 / span 10; - } - .col-xl-10.offset-xl-10 { - grid-column: 10 / span 10; - } - .col-xl-10.offset-xl-11 { - grid-column: 11 / span 10; - } - .col-xl-10.offset-xl-12 { - grid-column: 12 / span 10; - } - .col-xl-10.offset-xl-13 { - grid-column: 13 / span 10; - } - .col-xl-10.offset-xl-14 { - grid-column: 14 / span 10; - } - .col-xl-10.offset-xl-15 { - grid-column: 15 / span 10; - } - .col-xl-10.offset-xl-16 { - grid-column: 16 / span 10; - } - .col-11, .col-xl-11 { - grid-column: span 11; - } - .col-xl-11.offset-xl-2 { - grid-column: 2 / span 11; - } - .col-xl-11.offset-xl-3 { - grid-column: 3 / span 11; - } - .col-xl-11.offset-xl-4 { - grid-column: 4 / span 11; - } - .col-xl-11.offset-xl-5 { - grid-column: 5 / span 11; - } - .col-xl-11.offset-xl-6 { - grid-column: 6 / span 11; - } - .col-xl-11.offset-xl-7 { - grid-column: 7 / span 11; - } - .col-xl-11.offset-xl-8 { - grid-column: 8 / span 11; - } - .col-xl-11.offset-xl-9 { - grid-column: 9 / span 11; - } - .col-xl-11.offset-xl-10 { - grid-column: 10 / span 11; - } - .col-xl-11.offset-xl-11 { - grid-column: 11 / span 11; - } - .col-xl-11.offset-xl-12 { - grid-column: 12 / span 11; - } - .col-xl-11.offset-xl-13 { - grid-column: 13 / span 11; - } - .col-xl-11.offset-xl-14 { - grid-column: 14 / span 11; - } - .col-xl-11.offset-xl-15 { - grid-column: 15 / span 11; - } - .col-xl-11.offset-xl-16 { - grid-column: 16 / span 11; - } - .col-12, .col-xl-12 { - grid-column: span 12; - } - .col-xl-12.offset-xl-2 { - grid-column: 2 / span 12; - } - .col-xl-12.offset-xl-3 { - grid-column: 3 / span 12; - } - .col-xl-12.offset-xl-4 { - grid-column: 4 / span 12; - } - .col-xl-12.offset-xl-5 { - grid-column: 5 / span 12; - } - .col-xl-12.offset-xl-6 { - grid-column: 6 / span 12; - } - .col-xl-12.offset-xl-7 { - grid-column: 7 / span 12; - } - .col-xl-12.offset-xl-8 { - grid-column: 8 / span 12; - } - .col-xl-12.offset-xl-9 { - grid-column: 9 / span 12; - } - .col-xl-12.offset-xl-10 { - grid-column: 10 / span 12; - } - .col-xl-12.offset-xl-11 { - grid-column: 11 / span 12; - } - .col-xl-12.offset-xl-12 { - grid-column: 12 / span 12; - } - .col-xl-12.offset-xl-13 { - grid-column: 13 / span 12; - } - .col-xl-12.offset-xl-14 { - grid-column: 14 / span 12; - } - .col-xl-12.offset-xl-15 { - grid-column: 15 / span 12; - } - .col-xl-12.offset-xl-16 { - grid-column: 16 / span 12; - } - .col-13, .col-xl-13 { - grid-column: span 13; - } - .col-xl-13.offset-xl-2 { - grid-column: 2 / span 13; - } - .col-xl-13.offset-xl-3 { - grid-column: 3 / span 13; - } - .col-xl-13.offset-xl-4 { - grid-column: 4 / span 13; - } - .col-xl-13.offset-xl-5 { - grid-column: 5 / span 13; - } - .col-xl-13.offset-xl-6 { - grid-column: 6 / span 13; - } - .col-xl-13.offset-xl-7 { - grid-column: 7 / span 13; - } - .col-xl-13.offset-xl-8 { - grid-column: 8 / span 13; - } - .col-xl-13.offset-xl-9 { - grid-column: 9 / span 13; - } - .col-xl-13.offset-xl-10 { - grid-column: 10 / span 13; - } - .col-xl-13.offset-xl-11 { - grid-column: 11 / span 13; - } - .col-xl-13.offset-xl-12 { - grid-column: 12 / span 13; - } - .col-xl-13.offset-xl-13 { - grid-column: 13 / span 13; - } - .col-xl-13.offset-xl-14 { - grid-column: 14 / span 13; - } - .col-xl-13.offset-xl-15 { - grid-column: 15 / span 13; - } - .col-xl-13.offset-xl-16 { - grid-column: 16 / span 13; - } - .col-14, .col-xl-14 { - grid-column: span 14; - } - .col-xl-14.offset-xl-2 { - grid-column: 2 / span 14; - } - .col-xl-14.offset-xl-3 { - grid-column: 3 / span 14; - } - .col-xl-14.offset-xl-4 { - grid-column: 4 / span 14; - } - .col-xl-14.offset-xl-5 { - grid-column: 5 / span 14; - } - .col-xl-14.offset-xl-6 { - grid-column: 6 / span 14; - } - .col-xl-14.offset-xl-7 { - grid-column: 7 / span 14; - } - .col-xl-14.offset-xl-8 { - grid-column: 8 / span 14; - } - .col-xl-14.offset-xl-9 { - grid-column: 9 / span 14; - } - .col-xl-14.offset-xl-10 { - grid-column: 10 / span 14; - } - .col-xl-14.offset-xl-11 { - grid-column: 11 / span 14; - } - .col-xl-14.offset-xl-12 { - grid-column: 12 / span 14; - } - .col-xl-14.offset-xl-13 { - grid-column: 13 / span 14; - } - .col-xl-14.offset-xl-14 { - grid-column: 14 / span 14; - } - .col-xl-14.offset-xl-15 { - grid-column: 15 / span 14; - } - .col-xl-14.offset-xl-16 { - grid-column: 16 / span 14; - } - .col-15, .col-xl-15 { - grid-column: span 15; - } - .col-xl-15.offset-xl-2 { - grid-column: 2 / span 15; - } - .col-xl-15.offset-xl-3 { - grid-column: 3 / span 15; - } - .col-xl-15.offset-xl-4 { - grid-column: 4 / span 15; - } - .col-xl-15.offset-xl-5 { - grid-column: 5 / span 15; - } - .col-xl-15.offset-xl-6 { - grid-column: 6 / span 15; - } - .col-xl-15.offset-xl-7 { - grid-column: 7 / span 15; - } - .col-xl-15.offset-xl-8 { - grid-column: 8 / span 15; - } - .col-xl-15.offset-xl-9 { - grid-column: 9 / span 15; - } - .col-xl-15.offset-xl-10 { - grid-column: 10 / span 15; - } - .col-xl-15.offset-xl-11 { - grid-column: 11 / span 15; - } - .col-xl-15.offset-xl-12 { - grid-column: 12 / span 15; - } - .col-xl-15.offset-xl-13 { - grid-column: 13 / span 15; - } - .col-xl-15.offset-xl-14 { - grid-column: 14 / span 15; - } - .col-xl-15.offset-xl-15 { - grid-column: 15 / span 15; - } - .col-xl-15.offset-xl-16 { - grid-column: 16 / span 15; - } - .col-16, .col-xl-16 { - grid-column: span 16; - } - .col-xl-16.offset-xl-2 { - grid-column: 2 / span 16; - } - .col-xl-16.offset-xl-3 { - grid-column: 3 / span 16; - } - .col-xl-16.offset-xl-4 { - grid-column: 4 / span 16; - } - .col-xl-16.offset-xl-5 { - grid-column: 5 / span 16; - } - .col-xl-16.offset-xl-6 { - grid-column: 6 / span 16; - } - .col-xl-16.offset-xl-7 { - grid-column: 7 / span 16; - } - .col-xl-16.offset-xl-8 { - grid-column: 8 / span 16; - } - .col-xl-16.offset-xl-9 { - grid-column: 9 / span 16; - } - .col-xl-16.offset-xl-10 { - grid-column: 10 / span 16; - } - .col-xl-16.offset-xl-11 { - grid-column: 11 / span 16; - } - .col-xl-16.offset-xl-12 { - grid-column: 12 / span 16; - } - .col-xl-16.offset-xl-13 { - grid-column: 13 / span 16; - } - .col-xl-16.offset-xl-14 { - grid-column: 14 / span 16; - } - .col-xl-16.offset-xl-15 { - grid-column: 15 / span 16; - } - .col-xl-16.offset-xl-16 { - grid-column: 16 / span 16; - } -} - -a.button, .button { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - font-family: "Nunito",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; - font-size: 1em; - font-weight: 700; - text-decoration: none; - white-space: nowrap; - outline: none; - width: -webkit-min-content; - width: -moz-min-content; - width: min-content; - text-shadow: 0 1px 1px #fff; - background: #fff; - background-image: none; - border: 1px solid #ccc; - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - color: #3f4143; - border-radius: 3px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - cursor: pointer; - line-height: 1; - padding: 0.935rem 1.6rem; - -webkit-transition: background .2s, color .2s; - transition: background .2s, color .2s; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - -webkit-box-shadow: none; - box-shadow: none; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - overflow: visible; - text-align: center; -} - -a.button:focus, a.button:hover, .button:focus, .button:hover { - color: #3f4143; - background: #f0f0f0; - background-image: none; - -webkit-transition: background .2s, color .2s; - transition: background .2s, color .2s; -} - -a.button:active, .button:active { - color: #3f4143; - background: #fff; -} - -a.button:focus, .button:focus { - background: #fff; -} - -a.button:focus > i, a.button:focus > [class^="material-icons"], .button:focus > i, .button:focus > [class^="material-icons"] { - color: #0a8fff; -} - -a.button.active, .button.active { - color: #3f4143; - background: #e6e6e6; - background-image: none; - text-decoration: none; -} - -a.button.active:focus, a.button.active:hover, .button.active:focus, .button.active:hover { - color: #3f4143; - background: #f0f0f0; -} - -a.button.active i, a.button.active [class^="material-icons"], .button.active i, .button.active [class^="material-icons"] { - color: #3f4143; - text-shadow: none; -} - -a.button[disabled], a.button:disabled, a.button.disabled, .button[disabled], .button:disabled, .button.disabled { - cursor: default; - opacity: .59; - pointer-events: none; -} - -a.button.primary, .button.primary { - background: #0a8fff; - color: #fff; - text-shadow: 0 1px 1px #007fea; - background-image: none; - border: none; -} - -a.button.primary:hover, .button.primary:hover { - background: #30a0ff; - color: #fff; - background-image: none; -} - -a.button.primary:active, a.button.primary.active, .button.primary:active, .button.primary.active { - background: #30a0ff; - color: #fff; -} - -a.button.primary.inactive, .button.primary.inactive { - background: #007be3; -} - -a.button.primary i, a.button.primary [class^="material-icons"], .button.primary i, .button.primary [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -a.button.success, .button.success { - background: #2ec4b6; - color: #fff; - text-shadow: 0 1px 1px #28ab9f; - background-image: none; - border: none; -} - -a.button.success:hover, .button.success:hover { - background: #45d3c6; - color: #fff; - background-image: none; -} - -a.button.success:active, a.button.success.active, .button.success:active, .button.success.active { - background: #45d3c6; - color: #fff; -} - -a.button.success.inactive, .button.success.inactive { - background: #27a599; -} - -a.button.success i, a.button.success [class^="material-icons"], .button.success i, .button.success [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -a.button.warning, .button.warning { - background: #de9e36; - color: #fff; - text-shadow: 0 1px 1px #d39023; - background-image: none; - border: none; -} - -a.button.warning:hover, .button.warning:hover { - background: #e3ae57; - color: #fff; - background-image: none; -} - -a.button.warning:active, a.button.warning.active, .button.warning:active, .button.warning.active { - background: #e3ae57; - color: #fff; -} - -a.button.warning.inactive, .button.warning.inactive { - background: #cc8b22; -} - -a.button.warning i, a.button.warning [class^="material-icons"], .button.warning i, .button.warning [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -a.button.error, .button.error { - background: #d62828; - color: #fff; - text-shadow: 0 1px 1px #bc2323; - background-image: none; - border: none; -} - -a.button.error:hover, .button.error:hover { - background: #dd4848; - color: #fff; - background-image: none; -} - -a.button.error:active, a.button.error.active, .button.error:active, .button.error.active { - background: #dd4848; - color: #fff; -} - -a.button.error.inactive, .button.error.inactive { - background: #b62222; -} - -a.button.error i, a.button.error [class^="material-icons"], .button.error i, .button.error [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -a.button.dark, .button.dark { - background: #414552; - color: #fff; - text-shadow: 0 1px 1px #333741; - background-image: none; - border: none; -} - -a.button.dark:hover, .button.dark:hover { - background: #525767; - color: #fff; - background-image: none; -} - -a.button.dark:active, a.button.dark.active, .button.dark:active, .button.dark.active { - background: #525767; - color: #fff; -} - -a.button.dark.inactive, .button.dark.inactive { - background: #30333d; -} - -a.button.dark i, a.button.dark [class^="material-icons"], .button.dark i, .button.dark [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -a.button.link.button, a.button.link > .button, .button.link.button, .button.link > .button { - background: rgba(0, 0, 0, 0); - color: #3f4143; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0); - background-image: none; - border: none; -} - -a.button.link.button:hover, a.button.link > .button:hover, .button.link.button:hover, .button.link > .button:hover { - background: rgba(19, 19, 19, 0); - color: #3f4143; - background-image: none; -} - -a.button.link.button:active, a.button.link.button.active, a.button.link > .button:active, a.button.link > .button.active, .button.link.button:active, .button.link.button.active, .button.link > .button:active, .button.link > .button.active { - background: rgba(19, 19, 19, 0); - color: #3f4143; -} - -a.button.link.button.inactive, a.button.link > .button.inactive, .button.link.button.inactive, .button.link > .button.inactive { - background: rgba(0, 0, 0, 0); -} - -a.button.link.button i, a.button.link.button [class^="material-icons"], a.button.link > .button i, a.button.link > .button [class^="material-icons"], .button.link.button i, .button.link.button [class^="material-icons"], .button.link > .button i, .button.link > .button [class^="material-icons"] { - color: #3f4143; - text-shadow: none; -} - -a.button.link.button:hover, a.button.link > .button:hover, .button.link.button:hover, .button.link > .button:hover { - background: #e6e6e6; -} - -a.button.tiny, .button.tiny { - font-size: .809em; - padding: 0.415rem 0.5rem; - font-weight: 700; -} - -a.button.mini, .button.mini { - font-size: .909em; - padding: 0.445rem 0.9rem; - font-weight: 700; -} - -a.button.small, .button.small { - font-size: .979em; - padding: 0.645rem 1.4rem; - font-weight: 700; -} - -a.button.large, .button.large { - font-size: 1.25em; - padding: 1.15rem 2.1rem; - font-weight: 700; -} - -a.button.huge, .button.huge { - font-size: 1.45em; - padding: 1.3rem 2.4rem; - font-weight: 700; -} - -a.button.block, .button.block { - display: block; - width: 100%; -} - -a.button i, a.button [class^="material-icons"], .button i, .button [class^="material-icons"] { - font-size: 1.35em; - color: #3f4143; - text-shadow: none; -} - -a.button.secondary, .button.secondary { - color: #3f4143; - background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(60%, #ededed), to(#e6e6e6)); - background-image: linear-gradient(to bottom, #fff 0%, #ededed 60%, #e6e6e6 100%); -} - -a.button.secondary:focus, a.button.secondary:hover, a.button.secondary:active, a.button.secondary.active, .button.secondary:focus, .button.secondary:hover, .button.secondary:active, .button.secondary.active { - color: #3f4143; - background-image: -webkit-gradient(linear, left top, left bottom, from(#e1e1e1), color-stop(11%, #e1e1e1), color-stop(22%, #e8e8e8), color-stop(43%, #eee), to(#fafafa)); - background-image: linear-gradient(to bottom, #e1e1e1 0%, #e1e1e1 11%, #e8e8e8 22%, #eee 43%, #fafafa 100%); - z-index: 1; - border-color: #c6c6c6; -} - -a.button.secondary:focus i, a.button.secondary:focus [class^="material-icons"], a.button.secondary:hover i, a.button.secondary:hover [class^="material-icons"], a.button.secondary:active i, a.button.secondary:active [class^="material-icons"], a.button.secondary.active i, a.button.secondary.active [class^="material-icons"], .button.secondary:focus i, .button.secondary:focus [class^="material-icons"], .button.secondary:hover i, .button.secondary:hover [class^="material-icons"], .button.secondary:active i, .button.secondary:active [class^="material-icons"], .button.secondary.active i, .button.secondary.active [class^="material-icons"] { - color: #3f4143; -} - -.buttons { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - -ms-flex-negative: 0; - flex-shrink: 0; - border-radius: 3px; - -webkit-box-shadow: 0 0.155em 0 rgba(0, 0, 0, 0.095); - box-shadow: 0 0.155em 0 rgba(0, 0, 0, 0.095); -} - -.buttons .button:first-child:not(:last-child) { - border-bottom-right-radius: 0; - border-top-right-radius: 0; -} - -.buttons .button:not(:first-child):not(:last-child) { - border-radius: 0; - margin-left: -1px; -} - -.buttons .button:last-child:not(:first-child) { - border-bottom-left-radius: 0; - border-top-left-radius: 0; - margin-left: -1px; -} - -.buttons.secondary > .button { - color: #3f4143; - background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(60%, #ededed), to(#e6e6e6)); - background-image: linear-gradient(to bottom, #fff 0%, #ededed 60%, #e6e6e6 100%); -} - -.buttons.secondary > .button:focus, .buttons.secondary > .button:hover, .buttons.secondary > .button:active, .buttons.secondary > .button.active { - color: #3f4143; - background-image: -webkit-gradient(linear, left top, left bottom, from(#e1e1e1), color-stop(11%, #e1e1e1), color-stop(22%, #e8e8e8), color-stop(43%, #eee), to(#fafafa)); - background-image: linear-gradient(to bottom, #e1e1e1 0%, #e1e1e1 11%, #e8e8e8 22%, #eee 43%, #fafafa 100%); - z-index: 1; - border-color: #c6c6c6; -} - -.buttons.secondary > .button:focus i, .buttons.secondary > .button:focus [class^="material-icons"], .buttons.secondary > .button:hover i, .buttons.secondary > .button:hover [class^="material-icons"], .buttons.secondary > .button:active i, .buttons.secondary > .button:active [class^="material-icons"], .buttons.secondary > .button.active i, .buttons.secondary > .button.active [class^="material-icons"] { - color: #3f4143; -} - -.buttons.block { - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.buttons.block .button { - -webkit-box-flex: 1; - -ms-flex: 1 0 0px; - flex: 1 0 0; -} - -.buttons .inactive { - padding-left: 0.45rem !important; - padding-right: 0.45rem !important; - pointer-events: none; - cursor: default; - background-image: none !important; -} - -.buttons.tiny > .button, .buttons.tiny > .dropdown > .button { - font-size: .809em; - padding: 0.415rem 0.5rem; - font-weight: 700; -} - -.buttons.mini > .button, .buttons.mini > .dropdown > .button { - font-size: .909em; - padding: 0.445rem 0.9rem; - font-weight: 700; -} - -.buttons.small > .button, .buttons.small > .dropdown > .button { - font-size: .979em; - padding: 0.645rem 1.4rem; - font-weight: 700; -} - -.buttons.large > .button, .buttons.large > .dropdown > .button { - font-size: 1.25em; - padding: 1.15rem 2.1rem; - font-weight: 700; -} - -.buttons.huge > .button, .buttons.huge > .dropdown > .button { - font-size: 1.45em; - padding: 1.3rem 2.4rem; - font-weight: 700; -} - -.buttons.primary > .button, .buttons.primary > .dropdown > .button { - background: #0a8fff; - color: #fff; - text-shadow: 0 1px 1px #007fea; - background-image: none; - border: none; - border: 1px solid #007fea; -} - -.buttons.primary > .button:hover, .buttons.primary > .dropdown > .button:hover { - background: #30a0ff; - color: #fff; - background-image: none; -} - -.buttons.primary > .button:active, .buttons.primary > .button.active, .buttons.primary > .dropdown > .button:active, .buttons.primary > .dropdown > .button.active { - background: #30a0ff; - color: #fff; -} - -.buttons.primary > .button.inactive, .buttons.primary > .dropdown > .button.inactive { - background: #007be3; -} - -.buttons.primary > .button i, .buttons.primary > .button [class^="material-icons"], .buttons.primary > .dropdown > .button i, .buttons.primary > .dropdown > .button [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -.buttons.success > .button, .buttons.success > .dropdown > .button { - background: #2ec4b6; - color: #fff; - text-shadow: 0 1px 1px #28ab9f; - background-image: none; - border: none; - border: 1px solid #28ab9f; -} - -.buttons.success > .button:hover, .buttons.success > .dropdown > .button:hover { - background: #45d3c6; - color: #fff; - background-image: none; -} - -.buttons.success > .button:active, .buttons.success > .button.active, .buttons.success > .dropdown > .button:active, .buttons.success > .dropdown > .button.active { - background: #45d3c6; - color: #fff; -} - -.buttons.success > .button.inactive, .buttons.success > .dropdown > .button.inactive { - background: #27a599; -} - -.buttons.success > .button i, .buttons.success > .button [class^="material-icons"], .buttons.success > .dropdown > .button i, .buttons.success > .dropdown > .button [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -.buttons.warning > .button, .buttons.warning > .dropdown > .button { - background: #de9e36; - color: #fff; - text-shadow: 0 1px 1px #d39023; - background-image: none; - border: none; - border: 1px solid #d39023; -} - -.buttons.warning > .button:hover, .buttons.warning > .dropdown > .button:hover { - background: #e3ae57; - color: #fff; - background-image: none; -} - -.buttons.warning > .button:active, .buttons.warning > .button.active, .buttons.warning > .dropdown > .button:active, .buttons.warning > .dropdown > .button.active { - background: #e3ae57; - color: #fff; -} - -.buttons.warning > .button.inactive, .buttons.warning > .dropdown > .button.inactive { - background: #cc8b22; -} - -.buttons.warning > .button i, .buttons.warning > .button [class^="material-icons"], .buttons.warning > .dropdown > .button i, .buttons.warning > .dropdown > .button [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -.buttons.error > .button, .buttons.error > .dropdown > .button { - background: #d62828; - color: #fff; - text-shadow: 0 1px 1px #bc2323; - background-image: none; - border: none; - border: 1px solid #bc2323; -} - -.buttons.error > .button:hover, .buttons.error > .dropdown > .button:hover { - background: #dd4848; - color: #fff; - background-image: none; -} - -.buttons.error > .button:active, .buttons.error > .button.active, .buttons.error > .dropdown > .button:active, .buttons.error > .dropdown > .button.active { - background: #dd4848; - color: #fff; -} - -.buttons.error > .button.inactive, .buttons.error > .dropdown > .button.inactive { - background: #b62222; -} - -.buttons.error > .button i, .buttons.error > .button [class^="material-icons"], .buttons.error > .dropdown > .button i, .buttons.error > .dropdown > .button [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -.buttons.dark > .button, .buttons.dark > .dropdown > .button { - background: #414552; - color: #fff; - text-shadow: 0 1px 1px #333741; - background-image: none; - border: none; - border: 1px solid #333741; -} - -.buttons.dark > .button:hover, .buttons.dark > .dropdown > .button:hover { - background: #525767; - color: #fff; - background-image: none; -} - -.buttons.dark > .button:active, .buttons.dark > .button.active, .buttons.dark > .dropdown > .button:active, .buttons.dark > .dropdown > .button.active { - background: #525767; - color: #fff; -} - -.buttons.dark > .button.inactive, .buttons.dark > .dropdown > .button.inactive { - background: #30333d; -} - -.buttons.dark > .button i, .buttons.dark > .button [class^="material-icons"], .buttons.dark > .dropdown > .button i, .buttons.dark > .dropdown > .button [class^="material-icons"] { - color: #fff; - text-shadow: none; -} - -.buttons.link.button, .buttons.link > .button { - background: rgba(0, 0, 0, 0); - color: #3f4143; - text-shadow: 0 1px 1px rgba(0, 0, 0, 0); - background-image: none; - border: none; -} - -.buttons.link.button:hover, .buttons.link > .button:hover { - background: rgba(19, 19, 19, 0); - color: #3f4143; - background-image: none; -} - -.buttons.link.button:active, .buttons.link.button.active, .buttons.link > .button:active, .buttons.link > .button.active { - background: rgba(19, 19, 19, 0); - color: #3f4143; -} - -.buttons.link.button.inactive, .buttons.link > .button.inactive { - background: rgba(0, 0, 0, 0); -} - -.buttons.link.button i, .buttons.link.button [class^="material-icons"], .buttons.link > .button i, .buttons.link > .button [class^="material-icons"] { - color: #3f4143; - text-shadow: none; -} - -.buttons.link.button:hover, .buttons.link > .button:hover { - background: #e6e6e6; -} - -.buttons .dropdown:last-child:not(:first-child), .buttons .dropdown:last-child:not(:first-child) > .button { - border-bottom-left-radius: 0; - border-top-left-radius: 0; - margin-left: -1px; -} - -.buttons .dropdown:last-child, .buttons .dropdown:last-child > .button:first-child, .buttons .dropdown:last-child > .button:last-child { - border-bottom-right-radius: 3px; - border-top-right-radius: 3px; -} - -.buttons .dropdown:not(:first-child):not(:last-child) > .button { - border-radius: 0; - margin-left: -1px; -} - -@media only screen and (max-width: 768px) { - .buttons { - -webkit-box-shadow: none; - box-shadow: none; - } -} - -.buttons.vertical { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-flow: column; - flex-flow: column; -} - -.buttons.vertical > .button, .buttons.vertical.block, .buttons.vertical.block > .button, .buttons.vertical > .dropdown > .button { - width: 100%; -} - -.buttons.vertical > .button { - border-radius: 0; -} - -.buttons.vertical > .button:last-child:not(:first-child), .buttons.vertical > .button:not(:first-child):not(:last-child) { - margin: -1px 0 0; -} - -.buttons.vertical.block { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; -} - -.buttons.vertical > .dropdown:last-child:not(:first-child), .buttons.vertical > .dropdown:last-child:not(:first-child) > .button, .buttons.vertical > .dropdown:not(:first-child):not(:last-child) > .button { - margin: -1px 0 0; - border-radius: 0; -} - -.buttons.vertical > .primary.button, .buttons.vertical > .dropdown > .primary.button { - border: 1px solid #007fea; -} - -.buttons.vertical > .success.button, .buttons.vertical > .dropdown > .success.button { - border: 1px solid #28ab9f; -} - -.buttons.vertical > .warning.button, .buttons.vertical > .dropdown > .warning.button { - border: 1px solid #d39023; -} - -.buttons.vertical > .error.button, .buttons.vertical > .dropdown > .error.button { - border: 1px solid #bc2323; -} - -.buttons.vertical > .dark.button, .buttons.vertical > .dropdown > .dark.button { - border: 1px solid #333741; -} - -.dropdown { - display: inline-block; - position: relative; -} - -.dropdown > .menu { - -webkit-animation: slide-down .15s ease 1; - animation: slide-down .15s ease 1; - display: none; - left: 0; - max-height: 45vh; - overflow-y: auto; - position: absolute; - top: 100%; - z-index: 301; - width: auto; -} - -.dropdown > .menu > .item > a { - padding: 0.1rem .9rem; -} - -.dropdown.right > .menu, .dropdown.left > .menu { - top: 0; -} - -.dropdown.right > .menu { - left: 100%; - right: auto; -} - -.dropdown.left > .menu { - left: auto; - right: 100%; -} - -.dropdown.top.left > .menu { - right: auto !important; - left: 0 !important; -} - -.dropdown.top.right > .menu { - right: 0 !important; - left: auto !important; -} - -.dropdown.top > .menu { - bottom: 100%; - top: auto; - right: 0; - left: auto; - -webkit-box-shadow: 0 -3px 10px rgba(0, 0, 0, 0.15); - box-shadow: 0 -3px 10px rgba(0, 0, 0, 0.15); -} - -.dropdown.bottom.left > .menu, .dropdown.bottom.right > .menu { - top: 100%; -} - -.dropdown.bottom.left > .menu { - right: auto !important; - left: 0 !important; -} - -.dropdown.bottom.right > .menu { - right: 0 !important; - left: auto !important; -} - -.dropdown.active > .menu, .dropdown > .toggle:focus + .menu, .dropdown > .toggle:hover + .menu, .dropdown > .menu:focus, .dropdown > .menu:hover { - display: block; -} - -.dropdown.clickable > .toggle:hover + .menu { - display: none; -} - -.dropdown.clickable > .toggle:focus ~ .menu, .dropdown.clickable > .toggle:active ~ .menu { - display: block; -} - -.dropdown > .buttons > .toggle:nth-last-child(2) { - border-bottom-right-radius: 3px; - border-top-right-radius: 3px; -} - -.dropdown.tiny > .button, .dropdown.tiny > .dropdown > .button { - font-size: .809em; - padding: 0.415rem 0.5rem; - font-weight: 700; -} - -.dropdown.mini > .button, .dropdown.mini > .dropdown > .button { - font-size: .909em; - padding: 0.445rem 0.9rem; - font-weight: 700; -} - -.dropdown.small > .button, .dropdown.small > .dropdown > .button { - font-size: .979em; - padding: 0.645rem 1.4rem; - font-weight: 700; -} - -.dropdown.large > .button, .dropdown.large > .dropdown > .button { - font-size: 1.25em; - padding: 1.15rem 2.1rem; - font-weight: 700; -} - -.dropdown.huge > .button, .dropdown.huge > .dropdown > .button { - font-size: 1.45em; - padding: 1.3rem 2.4rem; - font-weight: 700; -} - -input[type='color'], input[type='date'], input[type='time'], input[type='datetime'], input[type='datetime-local'], input[type='email'], input[type='month'], input[type='number'], input[type='password'], input[type='search'], input[type='tel'], input[type='text'], input[type='url'], input[type='week'], input[type='file'], input:not([type]), textarea, select { - -webkit-appearance: none; - background-color: #fff; - border: 1px solid #c6c6c6; - height: 2.5rem; - border-radius: 0; - outline: 2px solid transparent; - -webkit-box-shadow: none; - box-shadow: none; - -webkit-box-sizing: inherit; - box-sizing: inherit; - outline-offset: -2px; - padding: 0.4rem 0.5rem; - width: 100%; - max-width: 100%; - font-family: inherit; - color: #414552; - font-size: 1.088em; -} - -input[type='color']:focus, input[type='date']:focus, input[type='time']:focus, input[type='datetime']:focus, input[type='datetime-local']:focus, input[type='email']:focus, input[type='month']:focus, input[type='number']:focus, input[type='password']:focus, input[type='search']:focus, input[type='tel']:focus, input[type='text']:focus, input[type='url']:focus, input[type='week']:focus, input[type='file']:focus, input:not([type]):focus, textarea:focus, select:focus { - outline: 2px solid #414552; - outline-offset: -2px; - -webkit-transition: .35s; - transition: .35s; -} - -input[type='color'].success, input[type='date'].success, input[type='time'].success, input[type='datetime'].success, input[type='datetime-local'].success, input[type='email'].success, input[type='month'].success, input[type='number'].success, input[type='password'].success, input[type='search'].success, input[type='tel'].success, input[type='text'].success, input[type='url'].success, input[type='week'].success, input[type='file'].success, input:not([type]).success, textarea.success, select.success { - color: #2ec4b6; - outline-color: #2ec4b6; -} - -input[type='color'].error, input[type='date'].error, input[type='time'].error, input[type='datetime'].error, input[type='datetime-local'].error, input[type='email'].error, input[type='month'].error, input[type='number'].error, input[type='password'].error, input[type='search'].error, input[type='tel'].error, input[type='text'].error, input[type='url'].error, input[type='week'].error, input[type='file'].error, input:not([type]).error, textarea.error, select.error { - color: #d62828; - outline-color: #d62828; -} - -select { - background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTE2LjU5IDguNTlMMTIgMTMuMTcgNy40MSA4LjU5IDYgMTBsNiA2IDYtNnoiLz48L3N2Zz4="); - background-repeat: no-repeat; - background-position: right 10px center; -} - -select[multiple] { - background: none; - height: auto; -} - -textarea { - min-height: 6.5rem; - resize: vertical; -} - -label, legend { - display: block; - font-size: 1rem; - font-weight: 400; -} - -fieldset { - border-width: 0; - padding: 0; -} - -input[type='checkbox'], input[type='radio'] { - display: inline; -} - -input:disabled { - opacity: .59; -} - -.form { - position: relative; - max-width: 100%; - padding: 0 16px; -} - -.form .item { - height: -webkit-fit-content; - height: -moz-fit-content; - height: fit-content; - margin: 6px 0 0.75em; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - width: 100%; - max-width: 100%; - position: relative; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.form label, .form .item > label { - margin: 0; - color: #22242b; - font-size: .8579rem; - font-weight: 700; - text-transform: none; - height: -webkit-fit-content; - height: -moz-fit-content; - height: fit-content; -} - -.form .item > input[type="file"] { - opacity: 0; - position: absolute; - top: 0; - left: 0; - height: 100%; - cursor: default; -} - -.form .group, .form .item > .group { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - width: 100%; -} - -.form .group > *, .form .item > .group > * { - -webkit-box-flex: 1; - -ms-flex: 1 1 auto; - flex: 1 1 auto; -} - -.form .group > *:last-child, .form .item > .group > *:last-child { - margin-left: -1px; -} - -.form .group > *:not(:first-child):not(:last-child), .form .item > .group > *:not(:first-child):not(:last-child) { - margin-left: -1px; - margin-right: 0; -} - -.form .group > .buttons, .form .item > .group > .buttons { - -webkit-box-shadow: none; - box-shadow: none; -} - -.form .group > .button, .form .item > .group > .button { - height: 2.5rem; - font-size: 1em; - padding: 0.935rem 1.6rem; - font-weight: 700; -} - -.form .group > .button:first-child, .form .item > .group > .button:first-child { - border-bottom-right-radius: 0; - border-top-right-radius: 0; -} - -.form .group > .button:last-child:not(:first-child), .form .item > .group > .button:last-child:not(:first-child) { - border-bottom-left-radius: 0; - border-top-left-radius: 0; -} - -.form .items { - margin: 6px 0 0.75em; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; -} - -.form .items > .item { - margin: 6px 6px 0.75em; -} - -.form .two.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 2) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 2) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .two.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .three.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 3) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 3) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .three.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .four.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 4) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 4) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .four.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .five.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 5) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 5) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .five.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .six.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 6) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 6) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .six.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .seven.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 7) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 7) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .seven.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .eight.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 8) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 8) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .eight.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .nine.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 9) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 9) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .nine.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .ten.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 10) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 10) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .ten.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .eleven.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 11) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 11) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .eleven.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .twelve.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 12) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 12) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .twelve.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .thirteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 13) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 13) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .thirteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .fourteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 14) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 14) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .fourteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .fifteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 15) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 15) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .fifteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form .sixteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 16) - (2 * 6px 6px 0.75em)); - flex: 0 0 calc(100% * (1 / 16) - (2 * 6px 6px 0.75em)); -} - -@media only screen and (max-width: 768px) { - .form .sixteen.items > .item { - -webkit-box-flex: 0; - -ms-flex: 0 0 100%; - flex: 0 0 100%; - } -} - -.form.small input[type='color'], .form.small input[type='date'], .form.small input[type='time'], .form.small input[type='datetime'], .form.small input[type='datetime-local'], .form.small input[type='email'], .form.small input[type='month'], .form.small input[type='number'], .form.small input[type='password'], .form.small input[type='search'], .form.small input[type='tel'], .form.small input[type='text'], .form.small input[type='url'], .form.small input[type='week'], .form.small input[type='file'], .form.small input:not([type]), .form.small textarea, .form.small select { - height: 1.9rem; - font-size: 1em; -} - -.form.small .button { - height: 1.9rem !important; - font-size: .979em !important; - padding: 0.645rem 1.4rem !important; -} - -.form.small label, .form.small > .items > .item > label, .form.small > .item > label { - font-size: 1em; -} - -.form.large input[type='color'], .form.large input[type='date'], .form.large input[type='time'], .form.large input[type='datetime'], .form.large input[type='datetime-local'], .form.large input[type='email'], .form.large input[type='month'], .form.large input[type='number'], .form.large input[type='password'], .form.large input[type='search'], .form.large input[type='tel'], .form.large input[type='text'], .form.large input[type='url'], .form.large input[type='week'], .form.large input[type='file'], .form.large input:not([type]), .form.large textarea, .form.large select { - height: 2.9rem; - font-size: 1.2em; -} - -.form.large .button { - height: 2.9rem !important; - font-size: 1.25em !important; - padding: 1.15rem 2.1rem !important; -} - -.form.large label, .form.large > .items > .item > label, .form.large > .item > label { - font-size: 1.2em; -} - -.radio, .checkbox { - position: relative; -} - -.radio label, .checkbox label { - padding: 0 1.2rem 0 1.7rem; - cursor: pointer; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - font-weight: 400; - margin: 0; -} - -.radio input, .checkbox input { - left: 0; - opacity: 0; - position: absolute; - top: 0; -} - -.radio input + label::before, .radio input + label::after, .checkbox input + label::before, .checkbox input + label::after { - position: absolute; - -webkit-transition: opacity 0.11s ease-in-out; - transition: opacity 0.11s ease-in-out; - font-family: "Material Icons"; - font-style: normal; - font-weight: normal; - text-transform: none; - color: #414552; - font-size: 1.15rem; - top: -5px; - left: 0; -} - -.radio input + label::before, .checkbox input + label::before { - opacity: 1; -} - -.radio input + label::after, .checkbox input + label::after { - opacity: 0; -} - -.radio input:checked + label::after, .checkbox input:checked + label::after { - opacity: 1; -} - -.checkbox input + label::before { - content: "check_box_outline_blank"; -} - -.checkbox input + label::after { - content: "check_box"; -} - -.radio input + label::before { - content: "radio_button_unchecked"; -} - -.radio input + label::after { - content: "radio_button_checked"; -} - -h1 { - margin-top: 0; - color: inherit; - line-height: 2; - margin-bottom: 1em; -} - -h1, .h1 { - font-size: 2rem; - font-weight: 900; -} - -@media only screen and (max-width: 768px) { - h1, .h1 { - font-size: 1.7rem; - } -} - -h2 { - margin-top: 0; - color: inherit; - line-height: 2; - margin-bottom: 1em; -} - -h2, .h2 { - font-size: 1.8rem; - font-weight: 900; -} - -@media only screen and (max-width: 768px) { - h2, .h2 { - font-size: 1.5rem; - } -} - -h3 { - margin-top: 0; - color: inherit; - line-height: 2; - margin-bottom: 1em; -} - -h3, .h3 { - font-size: 1.6rem; - font-weight: 900; -} - -@media only screen and (max-width: 768px) { - h3, .h3 { - font-size: 1.3rem; - } -} - -h4 { - margin-top: 0; - color: inherit; - line-height: 2; - margin-bottom: 1em; -} - -h4, .h4 { - font-size: 1.4rem; - font-weight: 900; -} - -@media only screen and (max-width: 768px) { - h4, .h4 { - font-size: 1.1rem; - } -} - -h5 { - margin-top: 0; - color: inherit; - line-height: 2; - margin-bottom: 1em; -} - -h5, .h5 { - font-size: 1.2rem; - font-weight: 900; -} - -@media only screen and (max-width: 768px) { - h5, .h5 { - font-size: .9rem; - } -} - -h6 { - margin-top: 0; - color: inherit; - line-height: 2; - margin-bottom: 1em; -} - -h6, .h6 { - font-size: 1rem; - font-weight: 900; -} - -@media only screen and (max-width: 768px) { - h6, .h6 { - font-size: inherit; - } -} - -h1.bordered, h2.bordered, h3.bordered, h4.bordered, h5.bordered, h6.bordered, .h1.bordered, .h2.bordered, .h3.bordered, .h4.bordered, .h5.bordered, .h6.bordered { - border-width: 0 0 1px 0 !important; - padding-bottom: 10px; - margin-bottom: 20px; -} - -p { - margin: 0 0 1em; - font-size: 1.0495rem; -} - -a, ins, u { - -webkit-text-decoration-skip: ink edges; - text-decoration-skip: ink edges; -} - -abbr[title] { - border-bottom: 1px dotted; - cursor: help; - text-decoration: none; -} - -blockquote { - border-left: 0.1rem dotted #77878b; - margin-left: 0; - padding: .4rem .8rem; - font-style: italic; - color: #77878b; -} - -small { - font-size: 80%; -} - -sub, sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; -} - -sub { - bottom: -0.25em; -} - -sup { - top: -0.5em; -} - -.table { - position: relative; - border-collapse: collapse; - border-spacing: 0; - width: 100%; - max-width: 100%; - text-align: left; - margin-bottom: 1.5rem; -} - -.table.striped tr.active, .table.striped tbody tr.active { - background: #f0f0f0; -} - -.table.striped tr:nth-of-type(odd), .table.striped tbody tr:nth-of-type(odd) { - background: #f0f0f0; -} - -.table.striped thead tr { - background: rgba(0, 0, 0, 0) !important; -} - -.table.hovered tr:hover, .table.hovered tbody tr:hover { - background: #f0f0f0; - color: #3f4143; -} - -.table.hovered thead tr { - background: rgba(0, 0, 0, 0) !important; -} - -.table tr, .table tbody tr { - -webkit-transition: all 0.3s; - transition: all 0.3s; -} - -.table tr.active, .table tr.active:hover, .table tbody tr.active, .table tbody tr.active:hover { - background: #e6e6e6; -} - -.table td, .table th { - border-bottom: 1px solid #e6e6e6; - padding: 5px 7px; - text-align: inherit; -} - -.table thead tr { - background: rgba(0, 0, 0, 0); -} - -.table thead tr th { - border-bottom-width: 1px; - border-bottom-color: #c6c6c6; - font-weight: 400; - color: #9d9d9d; -} - -.material-icons { - font-size: 1.1rem; - line-height: 1; - vertical-align: middle; -} - -a.label, .label { - display: inline-block; - font-weight: 700; - line-height: 1.2; - margin: 0.1rem 0.05rem; - border-radius: 4px; - text-decoration: none; - border: 1px solid #c6c6c6; - -webkit-box-shadow: 0 0.155em 0 rgba(0, 0, 0, 0.095); - box-shadow: 0 0.155em 0 rgba(0, 0, 0, 0.095); - background-color: #fff; - color: #3f4143; - border-color: #c6c6c6; - padding: 0.28rem 0.9rem; - font-size: .9195em; -} - -a.label.primary, .label.primary { - background-color: #0a8fff; - color: #fff; - border-color: #007ce5; -} - -a.label.success, .label.success { - background-color: #2ec4b6; - color: #fff; - border-color: #27a79b; -} - -a.label.warning, .label.warning { - background-color: #de9e36; - color: #fff; - border-color: #ce8d22; -} - -a.label.error, .label.error { - background-color: #d62828; - color: #fff; - border-color: #b82222; -} - -a.label.dark, .label.dark { - background-color: #414552; - color: #fff; - border-color: #31343e; -} - -a.label.small, .label.small { - padding: 0.18rem 0.85rem; - font-size: .8195em; -} - -a.label.large, .label.large { - padding: 0.415rem 1.159rem; - font-size: 1em; -} - -a.label > i, a.label > .material-icons, .label > i, .label > .material-icons { - vertical-align: text-top; -} - -.alert { - display: block; - background-color: #fff; - color: #3f4143; - border-color: #fff; - border: 1px solid #c6c6c6; - border-radius: 4px; - padding: .6rem; - margin: 0 0 8px; - width: 100%; - font-weight: 700; -} - -.alert a { - color: #3f4143; -} - -.alert.primary { - background-color: #0a8fff; - color: #fff; - border-color: #0082f0; -} - -.alert.success { - background-color: #2ec4b6; - color: #fff; - border-color: #29afa3; -} - -.alert.warning { - background-color: #de9e36; - color: #fff; - border-color: #d79323; -} - -.alert.error { - background-color: #d62828; - color: #fff; - border-color: #c12424; -} - -.alert.dark { - background-color: #414552; - color: #fff; - border-color: #363944; -} - -.alert.small { - padding: .4rem; - font-size: .749rem; -} - -.alert.large { - padding: .8rem; - font-size: 1.1rem; -} - -.alert a { - color: #0a8fff; - text-decoration: underline; -} - -.alert a:focus, .alert a:hover, .alert a:active, .alert a.active { - opacity: .75; -} - -.alert p:last-child { - margin-bottom: 0; -} - -.alert > i, .alert > .material-icons { - vertical-align: text-top; -} - -.badge { - position: relative; - white-space: nowrap; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-weight: 700; - border-radius: 500px; - padding: 1px 6px; - font-size: .854rem; - background-color: #fff; - color: #3f4143; -} - -.badge.primary { - background-color: #0a8fff; - color: #fff; -} - -.badge.success { - background-color: #2ec4b6; - color: #fff; -} - -.badge.warning { - background-color: #de9e36; - color: #fff; -} - -.badge.error { - background-color: #d62828; - color: #fff; -} - -.badge.dark { - background-color: #414552; - color: #fff; -} - -.badge.tiny { - padding: 0 4px; - font-size: .659rem; -} - -.badge.small { - padding: 1px 4px; - font-size: .749rem; -} - -.badge.large { - padding: 2px 8px; - font-size: 1.1rem; -} - -.billboard { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - padding: 4.5rem 2.5rem; - background-color: #fff; - color: #3f4143; - border-color: #f4f4f4; - border: 1px solid #c6c6c6; -} - -.billboard.primary { - background-color: #0a8fff; - color: #fff; -} - -.billboard.success { - background-color: #2ec4b6; - color: #fff; -} - -.billboard.warning { - background-color: #de9e36; - color: #fff; -} - -.billboard.error { - background-color: #d62828; - color: #fff; -} - -.billboard.dark { - background-color: #414552; - color: #fff; -} - -.billboard.small { - padding: 2.5rem 1.5rem; - font-size: 1em; -} - -.billboard.small .body { - padding: 2.5rem 1.5rem; -} - -.billboard.small p { - font-size: 1em; -} - -.billboard.large { - padding: 7.5rem 4rem; - font-size: 1.6em; -} - -.billboard.large .body { - padding: 7.5rem 4rem; -} - -.billboard.large p { - font-size: 1.6em; -} - -.billboard .media { - -webkit-box-flex: 0; - -ms-flex: 0 0 auto; - flex: 0 0 auto; -} - -.billboard .body { - padding: 4.5rem 2.5rem; - -webkit-box-flex: 1; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; -} - -.cover { - min-height: 100vh; - max-height: 100%; - min-width: 100%; - border: 0; - background-size: cover; - background-position: center center; - background-repeat: no-repeat; -} - -@media only screen and (max-width: 768px) { - .billboard { - padding: 2.5rem 1rem; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - } - .billboard .media img { - width: 100%; - } - .billboard .body { - padding: 2.5rem 1rem; - } - .billboard.small { - padding: 1rem; - } - .billboard.small .body { - padding: 1rem; - } - .billboard.small p { - font-size: 1em; - } - .billboard.large { - padding: 1rem; - } - .billboard.large .body { - padding: 1rem; - } - .billboard.large p { - font-size: 1.358em; - } -} - -.breadcrumb { - display: inline-block; - white-space: nowrap; -} - -.breadcrumb a.item, .breadcrumb .item { - text-decoration: none; - font-size: inherit; -} - -.breadcrumb a.item:focus, .breadcrumb a.item:hover, .breadcrumb a.item:active, .breadcrumb a.item.active, .breadcrumb .item:focus, .breadcrumb .item:hover, .breadcrumb .item:active, .breadcrumb .item.active { - color: #007ae0; -} - -.breadcrumb a.item::after, .breadcrumb .item::after { - font-family: "Material Icons"; - content: "keyboard_arrow_right"; - color: #007ae0; - padding: 0 0.25em; - vertical-align: middle; - font-size: 1.4rem; - cursor: auto; -} - -.breadcrumb a.item:first-child, .breadcrumb .item:first-child { - margin-left: 0; -} - -.breadcrumb a.item.active, .breadcrumb .item.active { - color: #007ae0; - font-weight: bold; -} - -.breadcrumb a.item.active::after, .breadcrumb .item.active::after { - content: none; -} - -.breadcrumb.small .item { - font-size: .9589em; -} - -.breadcrumb.small .item::after { - padding: .15em; - font-size: 1.25rem; -} - -.breadcrumb.large .item { - font-size: 1.18em; -} - -.breadcrumb.large .item::after { - padding: .18em; - font-size: 1.7rem; -} - -@media only screen and (max-width: 768px) { - .breadcrumb .item:after { - font-size: 1rem; - vertical-align: middle; - } -} - -.cards { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; -} - -.cards.two > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 2) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 2) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.three > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 3) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 3) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.four > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 4) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 4) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.five > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 5) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 5) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.six > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 6) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 6) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.seven > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 7) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 7) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.eight > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 8) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 8) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.nine > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 9) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 9) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.ten > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 10) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 10) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.eleven > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 11) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 11) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.twelve > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 12) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 12) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.thirteen > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 13) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 13) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.fourteen > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 14) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 14) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.fifteen > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 15) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 15) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.cards.sixteen > .card { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 16) - (2 * 10px)); - flex: 0 0 calc(100% * (1 / 16) - (2 * 10px)); - height: auto; - margin: 10px; -} - -.card { - background: #fff; - border: 1px solid #c6c6c6; - border-radius: 4px; - -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - width: 240px; - height: 100%; - overflow: hidden; -} - -.card > .body .title, .card .title { - color: #1a1b1c; - line-height: initial; -} - -.card > .body .title > .subtitle, .card .title > .subtitle { - color: grey; - -webkit-box-flex: 1; - -ms-flex: 1 1 auto; - flex: 1 1 auto; -} - -.card .title, .card .description, .card .actions { - padding: 16px; -} - -.card .description { - -webkit-box-flex: 1; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - color: #3f4143; -} - -.card > .media { - -ms-flex-wrap: wrap; - flex-wrap: wrap; - display: -webkit-box; - display: -ms-flexbox; - display: flex; -} - -.card > .media img { - display: block; -} - -.card > .media.two { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.two > div, .card > .media.two > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 2)); - flex: 0 0 calc(100% * (1 / 2)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.three { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.three > div, .card > .media.three > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 3)); - flex: 0 0 calc(100% * (1 / 3)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.four { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.four > div, .card > .media.four > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 4)); - flex: 0 0 calc(100% * (1 / 4)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.five { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.five > div, .card > .media.five > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 5)); - flex: 0 0 calc(100% * (1 / 5)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.six { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.six > div, .card > .media.six > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 6)); - flex: 0 0 calc(100% * (1 / 6)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.seven { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.seven > div, .card > .media.seven > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 7)); - flex: 0 0 calc(100% * (1 / 7)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.eight { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.eight > div, .card > .media.eight > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 8)); - flex: 0 0 calc(100% * (1 / 8)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.nine { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.nine > div, .card > .media.nine > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 9)); - flex: 0 0 calc(100% * (1 / 9)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.ten { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.ten > div, .card > .media.ten > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 10)); - flex: 0 0 calc(100% * (1 / 10)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.eleven { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.eleven > div, .card > .media.eleven > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 11)); - flex: 0 0 calc(100% * (1 / 11)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.twelve { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.twelve > div, .card > .media.twelve > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 12)); - flex: 0 0 calc(100% * (1 / 12)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.thirteen { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.thirteen > div, .card > .media.thirteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 13)); - flex: 0 0 calc(100% * (1 / 13)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.fourteen { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.fourteen > div, .card > .media.fourteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 14)); - flex: 0 0 calc(100% * (1 / 14)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.fifteen { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.fifteen > div, .card > .media.fifteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 15)); - flex: 0 0 calc(100% * (1 / 15)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card > .media.sixteen { - padding-bottom: initial !important; - height: auto; -} - -.card > .media.sixteen > div, .card > .media.sixteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 16)); - flex: 0 0 calc(100% * (1 / 16)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 0; -} - -.card.horizontal { - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - width: 100%; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - margin-bottom: 15px; -} - -.card.horizontal > .media { - -ms-flex-item-align: normal; - align-self: normal; - width: 100%; -} - -.card.horizontal > .media img { - width: auto; - -o-object-fit: cover; - object-fit: cover; -} - -.card.horizontal > .body { - -webkit-box-flex: inherit; - -ms-flex: inherit; - flex: inherit; -} - -.card.horizontal > .body .title, .card.horizontal > .body .description { - padding: calc(16px / 2) 16px; -} - -.card.horizontal > .body .description { - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; -} - -@media only screen and (max-width: 768px) { - .card, .cards > .card { - -webkit-box-flex: 0 !important; - -ms-flex: 0 0 100% !important; - flex: 0 0 100% !important; - width: 100%; - height: -webkit-fit-content !important; - height: -moz-fit-content !important; - height: fit-content !important; - } - .card.horizontal { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - } -} - -.list { - list-style: none; - margin: 1rem 0; -} - -.list > .item { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - padding: .55em; - margin: 0; - -webkit-transition: .15s; - transition: .15s; -} - -.list > .item > img, .list > .item > .material-icons, .list > .item > i { - margin-right: 1rem; -} - -.list > .item > .body { - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - line-height: 1.4; - text-align: left; -} - -.list > .item > .body > .title, .list > .item > .body > .subtitle { - display: block; -} - -.list > .item > .body > .title { - font-size: 1.28rem; - font-weight: 900; - line-height: 1; -} - -.list > .item > .body > .subtitle { - font-size: .889em; - font-weight: 400; - color: #77878b; - margin-bottom: 7px; -} - -.list > .item > .actions { - margin-left: auto; - width: auto; - margin-left: 1rem; -} - -.list > .item.active { - background: #f0f0f0; -} - -.list.divided > .item { - border-bottom: 1px solid #c6c6c6; -} - -.list.divided > .item:last-child { - border-bottom: none; -} - -.list.striped > .item:nth-of-type(odd) { - background: #f0f0f0; -} - -.list.hovered > .item:hover { - background: #f0f0f0; - -webkit-transition: .15s; - transition: .15s; -} - -.menu { - background: #fff; - border-radius: 0; - list-style: none; - margin: 0; - width: 100%; - min-width: -webkit-max-content; - min-width: -moz-max-content; - min-width: max-content; - padding: .9rem; - -webkit-box-shadow: 0 7px 10px rgba(0, 0, 0, 0.15); - box-shadow: 0 7px 10px rgba(0, 0, 0, 0.15); - z-index: 300; -} - -.menu .title { - font-size: 1.25em; - min-height: 2rem; - color: #999; - padding: 0.6rem 0; - font-weight: 300; - letter-spacing: -.015rem; -} - -.menu .item { - padding: 0; - position: relative; - text-decoration: none; - text-align: left; -} - -.menu .item > a { - color: #606265; - display: block; - width: 100%; - padding: 0.28rem .9rem; - text-decoration: none; - font-size: 1em; - -webkit-transition: background .15s, color .15s; - transition: background .15s, color .15s; -} - -.menu .item > a:hover { - background: #f0f0f0; - color: #292a2b; - -webkit-transition: background .15s, color .15s; - transition: background .15s, color .15s; -} - -.menu .item > a:active, .menu .item > a:focus, .menu .item > a.active { - background: #f0f0f0; - color: #606265; - font-weight: 700; - -webkit-transition: background .15s, color .15s; - transition: background .15s, color .15s; -} - -.menu .item > a:focus { - font-weight: inherit; -} - -.menu .item i, .menu .item span.material-icons { - color: #77878b; - font-size: 1.2rem; - margin-right: 10px; - vertical-align: text-bottom; -} - -.menu .item .menu { - padding: .4rem; -} - -.menu .badge { - position: absolute; - right: 0; - top: 4px; - padding: 0 4px; - font-size: .93em; -} - -.menu.small > .item a { - font-size: .879em; -} - -.menu.divided .item { - border-bottom: 1px solid #e6e6e6; -} - -.menu.divided .item:last-child { - border-bottom: none; -} - -.navbar { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; - min-height: 80px; - background: #0a8fff; - color: #fff; - width: 100%; -} - -.navbar .container { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - width: 100%; -} - -.navbar .brand { - padding: 0; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - min-height: 100%; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - margin-right: 1rem; -} - -.navbar .brand img { - max-height: 60px; - padding: 8px; -} - -.navbar .brand a, .navbar .brand a:visited { - font-size: 1.1em; - text-decoration: none; - color: #fff; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - font-weight: bold; -} - -.navbar input[type=checkbox]#burger, .navbar .burger { - display: none; -} - -.navbar .burger::before { - content: "dehaze"; - font-family: "Material Icons"; - font-size: 2.459rem; - display: none; - min-height: 80px; - min-width: 80px; - position: absolute; - cursor: pointer; - right: 0; - top: 0; -} - -.navbar section.links { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-flex: 1; - -ms-flex: 1 0 0px; - flex: 1 0 0; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.navbar section.links div.section { - -webkit-box-flex: 1; - -ms-flex: 1 0 0px; - flex: 1 0 0; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - height: 100%; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.navbar section.links div.section:not(:first-child):last-child { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; -} - -.navbar section.links div.section input[type='text'] { - background-color: #fff; -} - -.navbar.fixed { - position: fixed; - top: 0; - left: 0; - right: 0px; - margin-top: 0; - -webkit-transform: translateY(0px); - transform: translateY(0px); - z-index: 5; -} - -.navbar .buttons { - height: 100%; - min-height: 100%; - -webkit-box-shadow: none; - box-shadow: none; -} - -.navbar .buttons .button { - background: transparent; - border-color: transparent; - border: none; - color: #fff; - min-height: 100%; -} - -.navbar .buttons .button i, .navbar .buttons .button span.material-icons { - color: #fff; -} - -.navbar .button, .navbar .dropdown .button { - font-size: 1.1em; - padding: .935rem 1.4rem; - font-weight: 700; -} - -.navbar.light { - background: #fff; - color: #3f4143; -} - -.navbar.light .buttons .button { - color: #3f4143; - min-height: 100%; -} - -.navbar.light .buttons .button i, .navbar.light .buttons .button span.material-icons { - color: #3f4143; -} - -.navbar.light .brand a, .navbar.light .brand a:visited { - color: #3f4143; -} - -.navbar.light section.links div.section input[type='text'] { - background-color: #fff; - color: #3f4143; -} - -.navbar.dark { - background: #363944; - color: #fff; -} - -.navbar.dark .buttons .button { - color: #fff; - min-height: 100%; -} - -.navbar.dark .buttons .button i, .navbar.dark .buttons .button span.material-icons { - color: #fff; -} - -.navbar.dark .brand a, .navbar.dark .brand a:visited { - color: #fff; -} - -.navbar.dark section.links div.section input[type='text'] { - background-color: #515666; - border-color: #515666; - color: #fff; -} - -.navbar-spacer { - margin-top: 100px; -} - -@media only screen and (max-width: 768px) { - .navbar-spacer { - margin-top: 0; - } - .navbar .container { - padding: 0; - } - .navbar.fixed { - position: relative; - } - .navbar section.links { - position: absolute; - display: block; - width: 100%; - height: 0; - top: 80px; - left: 0; - overflow-x: auto; - overflow-y: hidden; - background: #e6e6e6; - z-index: 1; - margin: 0 !important; - padding: 0 !important; - -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - } - .navbar section.links .section, .navbar section.links .section .buttons, .navbar section.links .section .buttons .dropdown, .navbar section.links .section .buttons .dropdown .menu, .navbar section.links .section .buttons .dropdown .menu .button, .navbar section.links .section .buttons .dropdown .button, .navbar section.links .section .buttons .button { - display: block !important; - width: 100%; - text-align: left; - position: relative; - } - .navbar section.links .section .buttons .dropdown .button, .navbar section.links .section .buttons .button { - color: #3f4143; - } - .navbar section.links .section .buttons .dropdown .button i, .navbar section.links .section .buttons .dropdown .button span.material-icons, .navbar section.links .section .buttons .button i, .navbar section.links .section .buttons .button span.material-icons { - display: none; - } - .navbar section.links .section .buttons .dropdown .menu { - max-height: 100%; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar .burger { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - min-height: 80px; - min-width: 80px; - } - .navbar .burger::before { - content: "close"; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - } - .navbar input[type=checkbox]#burger:not(:checked) ~ section.links { - height: 0; - } - .navbar input[type=checkbox]#burger:checked ~ section.links { - height: auto; - } - .navbar input[type=checkbox]#burger:not(:checked) ~ .burger::before { - content: "dehaze"; - } - .navbar input[type=checkbox]#burger:checked ~ .burger::before { - content: "close"; - } -} - -.panel { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - border: 1px solid #c6c6c6; - border-radius: 4px; - -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - background: #fff; - margin: 16px 0; -} - -.panel > .header, .panel > .bottom { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.panel > .header .actions, .panel > .bottom .actions { - margin-left: auto; -} - -.panel > .header .actions:before, .panel > .bottom .actions:before { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; -} - -.panel > .header { - border-bottom: 1px solid #c6c6c6; - padding: 12px 16px; -} - -.panel > .header.dashed { - border-bottom-style: dashed; -} - -.panel > .header.dotted { - border-bottom-style: dotted; -} - -.panel > .header .title { - font-size: 1.185rem; - font-weight: 900; -} - -.panel > .content { - -webkit-box-flex: 1; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 16px; - height: auto; -} - -.panel > .content > .media { - min-width: 0; - max-width: 100%; - -webkit-box-flex: 1; - -ms-flex: auto; - flex: auto; - margin-bottom: 32px; - width: 100%; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - position: relative; - padding-bottom: 56.25% !important; - height: 0; - overflow: hidden; - max-width: 100%; - width: 100%; - -webkit-box-sizing: border-box; - box-sizing: border-box; -} - -.panel > .content > .media iframe, .panel > .content > .media object, .panel > .content > .media embed { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; -} - -.panel > .content > .media video { - max-width: 100%; - height: auto; - -webkit-box-sizing: border-box; - box-sizing: border-box; -} - -.panel > .content > .media img { - display: block; -} - -.panel > .content > .media.two { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.two > div, .panel > .content > .media.two > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 2)); - flex: 0 0 calc(100% * (1 / 2)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.three { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.three > div, .panel > .content > .media.three > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 3)); - flex: 0 0 calc(100% * (1 / 3)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.four { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.four > div, .panel > .content > .media.four > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 4)); - flex: 0 0 calc(100% * (1 / 4)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.five { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.five > div, .panel > .content > .media.five > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 5)); - flex: 0 0 calc(100% * (1 / 5)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.six { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.six > div, .panel > .content > .media.six > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 6)); - flex: 0 0 calc(100% * (1 / 6)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.seven { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.seven > div, .panel > .content > .media.seven > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 7)); - flex: 0 0 calc(100% * (1 / 7)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.eight { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.eight > div, .panel > .content > .media.eight > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 8)); - flex: 0 0 calc(100% * (1 / 8)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.nine { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.nine > div, .panel > .content > .media.nine > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 9)); - flex: 0 0 calc(100% * (1 / 9)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.ten { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.ten > div, .panel > .content > .media.ten > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 10)); - flex: 0 0 calc(100% * (1 / 10)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.eleven { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.eleven > div, .panel > .content > .media.eleven > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 11)); - flex: 0 0 calc(100% * (1 / 11)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.twelve { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.twelve > div, .panel > .content > .media.twelve > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 12)); - flex: 0 0 calc(100% * (1 / 12)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.thirteen { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.thirteen > div, .panel > .content > .media.thirteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 13)); - flex: 0 0 calc(100% * (1 / 13)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.fourteen { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.fourteen > div, .panel > .content > .media.fourteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 14)); - flex: 0 0 calc(100% * (1 / 14)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.fifteen { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.fifteen > div, .panel > .content > .media.fifteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 15)); - flex: 0 0 calc(100% * (1 / 15)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content > .media.sixteen { - padding-bottom: initial !important; - height: auto; -} - -.panel > .content > .media.sixteen > div, .panel > .content > .media.sixteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 16)); - flex: 0 0 calc(100% * (1 / 16)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.panel > .content .headline, .panel > .content p.headline { - font-size: 1.39em; - line-height: 1.5; - margin-bottom: 26px; - color: #171819; - letter-spacing: -.0158em; -} - -.panel > .bottom { - min-height: 50px; - border-top: 1px solid #c6c6c6; - padding: 6px; -} - -.process { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: nowrap; - flex-wrap: nowrap; - margin: 1em 0 5em; - width: 100%; - list-style: none; -} - -.process .item { - -webkit-box-flex: 1; - -ms-flex: 1 1 0px; - flex: 1 1 0; - min-height: 4rem; - position: relative; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - word-break: break-word; - line-height: 1.3; - text-align: center; -} - -.process .item:not(:first-child)::before { - background: #0a8fff; - content: ""; - height: 6px; - left: -50%; - position: absolute; - top: 0; - width: 100%; -} - -.process .item a { - color: #3f4143; - display: inline-block; - padding: 10px 10px 0; - text-decoration: none; - font-weight: 700; -} - -.process .item a::before { - position: absolute; - content: ""; - background: #0a8fff; - top: 0; - left: 50%; - height: .8rem; - width: 3px; - z-index: 1; -} - -.process .item a:first-child::before { - left: calc(50% - (3px - 1px)); -} - -.process .item.active a { - color: #0a8fff; - font-weight: 700; -} - -.process .item.active a::after { - content: "beenhere"; - font-family: "Material Icons"; - position: absolute; - top: calc(-15px - 1.8rem); - left: calc(50% - ((3px * 10) / 2)); - color: #0a8fff; - font-size: 1.8rem; -} - -.process .item.active ~ .item::before { - background: #c6c6c6; -} - -.process .item.active ~ .item a { - color: #77878b; -} - -.process .item.active ~ .item a:hover { - color: #0d0f0f; -} - -.process .item.active ~ .item a::before { - background: #c6c6c6; -} - -.process.success .item:not(:first-child)::before { - background: #2ec4b6; -} - -.process.success .item a { - padding: 10px; -} - -.process.success .item a::before { - background: #2ec4b6; -} - -.process.success .item.active a { - color: #2ec4b6; -} - -.process.success .item.active a::after { - color: #2ec4b6; -} - -.process.success .item.active ~ .item::before { - background: #c6c6c6; -} - -.process.warning .item:not(:first-child)::before { - background: #de9e36; -} - -.process.warning .item a { - padding: 10px; -} - -.process.warning .item a::before { - background: #de9e36; -} - -.process.warning .item.active a { - color: #de9e36; -} - -.process.warning .item.active a::after { - color: #de9e36; -} - -.process.warning .item.active ~ .item::before { - background: #c6c6c6; -} - -.process.error .item:not(:first-child)::before { - background: #d62828; -} - -.process.error .item a { - padding: 10px; -} - -.process.error .item a::before { - background: #d62828; -} - -.process.error .item.active a { - color: #d62828; -} - -.process.error .item.active a::after { - color: #d62828; -} - -.process.error .item.active ~ .item::before { - background: #c6c6c6; -} - -.process.dark .item:not(:first-child)::before { - background: #414552; -} - -.process.dark .item a { - padding: 10px; -} - -.process.dark .item a::before { - background: #414552; -} - -.process.dark .item.active a { - color: #414552; -} - -.process.dark .item.active a::after { - color: #414552; -} - -.process.dark .item.active ~ .item::before { - background: #c6c6c6; -} - -.process.vertical { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - padding: 1.25em 2em 2.85em; - margin: 1em 0; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start; -} - -.process.vertical .item { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - max-width: 100%; - min-width: 100%; - border-bottom: 1px solid #c6c6c6; - border-right: 1px solid #c6c6c6; - padding-left: 20px; -} - -.process.vertical .item:first-child { - border-top: 1px solid #c6c6c6; -} - -.process.vertical .item:not(:first-child)::before { - width: 3px; - height: 100%; - left: 0; -} - -.process.vertical .item a::before { - width: 9px; -} - -.process.vertical .item a:first-child::before { - left: 0; - height: 100%; -} - -.process.vertical .item.active a { - font-weight: bold; -} - -.process.vertical .item.active a::after { - top: 15px; - left: calc(-15px - 1.8rem); -} - -.process.vertical.reversed { - -webkit-box-orient: vertical; - -webkit-box-direction: reverse; - -ms-flex-direction: column-reverse; - flex-direction: column-reverse; -} - -.process.vertical.reversed .item:last-child { - border-top: 1px solid #c6c6c6; -} - -.process.vertical.reversed .item:first-child { - border-top: none; -} - -@media only screen and (max-width: 768px) { - .process { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - padding: 1.25em 2em 2.85em; - margin: 1em 0; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start; - } - .process .item { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - max-width: 100%; - min-width: 100%; - border-bottom: 1px solid #c6c6c6; - border-right: 1px solid #c6c6c6; - padding-left: 20px; - } - .process .item:first-child { - border-top: 1px solid #c6c6c6; - } - .process .item:not(:first-child)::before { - width: 3px; - height: 100%; - left: 0; - } - .process .item a::before { - width: 9px; - } - .process .item a:first-child::before { - left: 0; - height: 100%; - } - .process .item.active a { - font-weight: bold; - } - .process .item.active a::after { - top: 15px; - left: calc(-15px - 1.8rem); - } - .process.reversed { - -webkit-box-orient: vertical; - -webkit-box-direction: reverse; - -ms-flex-direction: column-reverse; - flex-direction: column-reverse; - } - .process.reversed .item:last-child { - border-top: 1px solid #c6c6c6; - } - .process.reversed .item:first-child { - border-top: none; - } -} - -.progress { - width: 100%; - height: 12px; - background: #e6e6e6; - -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15) inset; - box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15) inset; - border-radius: 16px; - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; -} - -.progress::-webkit-progress-bar { - background: transparent; - border-radius: 16px; -} - -.progress::-webkit-progress-value { - background: #0a8fff; - border-radius: 16px; -} - -.progress::-moz-progress-bar { - background: #0a8fff; - border-radius: 16px; -} - -.progress.success::-webkit-progress-value { - background: #2ec4b6; -} - -.progress.warning::-webkit-progress-value { - background: #de9e36; -} - -.progress.error::-webkit-progress-value { - background: #d62828; -} - -.progress.dark::-webkit-progress-value { - background: #414552; -} - -.tab { - position: relative; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - -webkit-box-align: end; - -ms-flex-align: end; - align-items: flex-end; - border-bottom: 2px solid #e6e6e6; - padding: 0; -} - -.tab > .buttons { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; -} - -.tab > .button, .tab > a.button, .tab > .buttons > .button, .tab > .buttons > a.button, .tab > .dropdown > .button, .tab > .dropdown > a.button, .tab > .buttons > .dropdown > .button, .tab > .buttons > .dropdown > a.button { - background: transparent; - border: none; - border-bottom: 2px solid transparent; - border-radius: 0 !important; - margin-bottom: -2px; - line-height: initial; - font-size: 1.025em; - font-weight: initial; - -webkit-transition: border-bottom-color, color .2s; - transition: border-bottom-color, color .2s; - color: #6b7a7d; - padding: .935rem 1.4rem; -} - -.tab > .button:hover, .tab > a.button:hover, .tab > .buttons > .button:hover, .tab > .buttons > a.button:hover, .tab > .dropdown > .button:hover, .tab > .dropdown > a.button:hover, .tab > .buttons > .dropdown > .button:hover, .tab > .buttons > .dropdown > a.button:hover { - color: #2b2d2e; - border-bottom-color: #bdbdbd; - -webkit-transition: border-bottom-color, color .2s; - transition: border-bottom-color, color .2s; -} - -.tab > .button.disabled, .tab > a.button.disabled, .tab > .buttons > .button.disabled, .tab > .buttons > a.button.disabled, .tab > .dropdown > .button.disabled, .tab > .dropdown > a.button.disabled, .tab > .buttons > .dropdown > .button.disabled, .tab > .buttons > .dropdown > a.button.disabled { - opacity: .45; -} - -.tab > .button.active, .tab > a.button.active, .tab > .buttons > .button.active, .tab > .buttons > a.button.active, .tab > .dropdown > .button.active, .tab > .dropdown > a.button.active, .tab > .buttons > .dropdown > .button.active, .tab > .buttons > .dropdown > a.button.active { - color: #0a8fff; - border-bottom-color: #0a8fff; - font-weight: 700; -} - -.tab > .button.active i, .tab > .button.active [class^="material-icons"], .tab > a.button.active i, .tab > a.button.active [class^="material-icons"], .tab > .buttons > .button.active i, .tab > .buttons > .button.active [class^="material-icons"], .tab > .buttons > a.button.active i, .tab > .buttons > a.button.active [class^="material-icons"], .tab > .dropdown > .button.active i, .tab > .dropdown > .button.active [class^="material-icons"], .tab > .dropdown > a.button.active i, .tab > .dropdown > a.button.active [class^="material-icons"], .tab > .buttons > .dropdown > .button.active i, .tab > .buttons > .dropdown > .button.active [class^="material-icons"], .tab > .buttons > .dropdown > a.button.active i, .tab > .buttons > .dropdown > a.button.active [class^="material-icons"] { - color: initial; -} - -.tab.success .button.active, .tab.success a.button.active, .tab.success .dropdown .button.active, .tab.success .dropdown a.button.active { - color: #2ec4b6; - border-bottom-color: #2ec4b6; -} - -.tab.warning .button.active, .tab.warning a.button.active, .tab.warning .dropdown .button.active, .tab.warning .dropdown a.button.active { - color: #de9e36; - border-bottom-color: #de9e36; -} - -.tab.error .button.active, .tab.error a.button.active, .tab.error .dropdown .button.active, .tab.error .dropdown a.button.active { - color: #d62828; - border-bottom-color: #d62828; -} - -.tab.dark .button.active, .tab.dark a.button.active, .tab.dark .dropdown .button.active, .tab.dark .dropdown a.button.active { - color: #414552; - border-bottom-color: #414552; -} - -.timeline .activity { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - padding: 1.25em 2em 2.85em; - position: relative; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; -} - -.timeline .activity::before { - content: ""; - display: block; - position: absolute; - top: 0; - bottom: 0; - left: 0; - width: 1px; - background-color: #c6c6c6; -} - -.timeline .activity:target .type { - border-color: #0a8fff; - -webkit-box-shadow: 0 0 0.2em #0a8fff; - box-shadow: 0 0 0.2em #0a8fff; -} - -.timeline .activity .type { - position: absolute; - z-index: 1; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - width: 32px; - height: 32px; - top: 13px; - left: -15px; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - background-color: #e6e6e6; - border: 2px solid #c6c6c6; - border-radius: 50%; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -ms-flex-negative: 0; - flex-shrink: 0; - -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); -} - -.timeline .activity .type.primary { - background-color: #0a8fff; - color: #fff; - border-color: #0082f0; -} - -.timeline .activity .type.success { - background-color: #2ec4b6; - color: #fff; - border-color: #29afa3; -} - -.timeline .activity .type.warning { - background-color: #de9e36; - color: #fff; - border-color: #d79323; -} - -.timeline .activity .type.error { - background-color: #d62828; - color: #fff; - border-color: #c12424; -} - -.timeline .activity .type.dark { - background-color: #414552; - color: #fff; - border-color: #363944; -} - -.timeline .activity .author, .timeline .activity .body, .timeline .activity .date, .timeline .activity .actions, .timeline .activity .media { - min-width: 0; - max-width: 100%; - color: #3f4143; - -webkit-box-flex: 1; - -ms-flex: auto; - flex: auto; - margin-left: 10px; - width: 100%; -} - -.timeline .activity .author { - font-weight: bold; - font-size: 1rem; - color: #212223; -} - -.timeline .activity .date { - font-size: .9em; - opacity: .6; -} - -.timeline .activity .media { - margin-top: 16px; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - position: relative; - padding-bottom: 56.25% !important; - height: 0; - overflow: hidden; - max-width: 100%; - width: 100%; - -webkit-box-sizing: border-box; - box-sizing: border-box; -} - -.timeline .activity .media iframe, .timeline .activity .media object, .timeline .activity .media embed { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; -} - -.timeline .activity .media video { - max-width: 100%; - height: auto; - -webkit-box-sizing: border-box; - box-sizing: border-box; -} - -.timeline .activity .media img { - display: block; -} - -.timeline .activity > .media.two { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.two > div, .timeline .activity > .media.two > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 2)); - flex: 0 0 calc(100% * (1 / 2)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.three { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.three > div, .timeline .activity > .media.three > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 3)); - flex: 0 0 calc(100% * (1 / 3)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.four { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.four > div, .timeline .activity > .media.four > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 4)); - flex: 0 0 calc(100% * (1 / 4)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.five { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.five > div, .timeline .activity > .media.five > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 5)); - flex: 0 0 calc(100% * (1 / 5)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.six { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.six > div, .timeline .activity > .media.six > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 6)); - flex: 0 0 calc(100% * (1 / 6)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.seven { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.seven > div, .timeline .activity > .media.seven > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 7)); - flex: 0 0 calc(100% * (1 / 7)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.eight { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.eight > div, .timeline .activity > .media.eight > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 8)); - flex: 0 0 calc(100% * (1 / 8)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.nine { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.nine > div, .timeline .activity > .media.nine > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 9)); - flex: 0 0 calc(100% * (1 / 9)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.ten { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.ten > div, .timeline .activity > .media.ten > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 10)); - flex: 0 0 calc(100% * (1 / 10)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.eleven { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.eleven > div, .timeline .activity > .media.eleven > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 11)); - flex: 0 0 calc(100% * (1 / 11)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.twelve { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.twelve > div, .timeline .activity > .media.twelve > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 12)); - flex: 0 0 calc(100% * (1 / 12)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.thirteen { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.thirteen > div, .timeline .activity > .media.thirteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 13)); - flex: 0 0 calc(100% * (1 / 13)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.fourteen { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.fourteen > div, .timeline .activity > .media.fourteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 14)); - flex: 0 0 calc(100% * (1 / 14)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.fifteen { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.fifteen > div, .timeline .activity > .media.fifteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 15)); - flex: 0 0 calc(100% * (1 / 15)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity > .media.sixteen { - padding-bottom: initial !important; - height: auto; -} - -.timeline .activity > .media.sixteen > div, .timeline .activity > .media.sixteen > a { - -webkit-box-flex: 0; - -ms-flex: 0 0 calc(100% * (1 / 16)); - flex: 0 0 calc(100% * (1 / 16)); - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - padding: 1px; -} - -.timeline .activity .actions { - margin-top: 16px; -} - -.timeline .activity:last-child::before { - background: -webkit-gradient(linear, left top, left bottom, color-stop(45%, #c6c6c6), to(rgba(255, 255, 255, 0))); - background: linear-gradient(180deg, #c6c6c6 45%, rgba(255, 255, 255, 0) 100%); -} - -.timeline .activity:first-child::before { - background: -webkit-gradient(linear, left bottom, left top, color-stop(45%, #c6c6c6), to(rgba(255, 255, 255, 0))); - background: linear-gradient(0deg, #c6c6c6 45%, rgba(255, 255, 255, 0) 100%); -} - -.tooltip { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - position: relative; - cursor: default; -} - -.tooltip .text { - position: absolute; - color: #fff; - font-size: .9em; - text-align: center; - visibility: hidden; - background-color: #414552; - border-radius: 4px; - min-width: 100px; - max-width: 180px; - padding: 5px; - top: 120%; - opacity: 0; - -webkit-transition: opacity 0.18s; - transition: opacity 0.18s; - z-index: 1; -} - -.tooltip .text::after { - content: ""; - position: absolute; - top: auto; - bottom: 100%; - left: 50%; - margin-left: -5px; - border-width: 5px; - border-style: solid; - border-color: transparent transparent #414552 transparent; -} - -.tooltip:hover .text { - visibility: visible; - opacity: 1; -} - -.m-0 { - margin: 0px !important; -} - -.m-5 { - margin: 5px !important; -} - -.m-10 { - margin: 10px !important; -} - -.m-15 { - margin: 15px !important; -} - -.m-20 { - margin: 20px !important; -} - -.m-30 { - margin: 30px !important; -} - -.m-40 { - margin: 40px !important; -} - -.m-50 { - margin: 50px !important; -} - -.mt-0 { - margin-top: 0px !important; -} - -.mt-5 { - margin-top: 5px !important; -} - -.mt-10 { - margin-top: 10px !important; -} - -.mt-15 { - margin-top: 15px !important; -} - -.mt-20 { - margin-top: 20px !important; -} - -.mt-30 { - margin-top: 30px !important; -} - -.mt-40 { - margin-top: 40px !important; -} - -.mt-50 { - margin-top: 50px !important; -} - -.mr-0 { - margin-right: 0px !important; -} - -.mr-5 { - margin-right: 5px !important; -} - -.mr-10 { - margin-right: 10px !important; -} - -.mr-15 { - margin-right: 15px !important; -} - -.mr-20 { - margin-right: 20px !important; -} - -.mr-30 { - margin-right: 30px !important; -} - -.mr-40 { - margin-right: 40px !important; -} - -.mr-50 { - margin-right: 50px !important; -} - -.mb-0 { - margin-bottom: 0px !important; -} - -.mb-5 { - margin-bottom: 5px !important; -} - -.mb-10 { - margin-bottom: 10px !important; -} - -.mb-15 { - margin-bottom: 15px !important; -} - -.mb-20 { - margin-bottom: 20px !important; -} - -.mb-30 { - margin-bottom: 30px !important; -} - -.mb-40 { - margin-bottom: 40px !important; -} - -.mb-50 { - margin-bottom: 50px !important; -} - -.ml-0 { - margin-left: 0px !important; -} - -.ml-5 { - margin-left: 5px !important; -} - -.ml-10 { - margin-left: 10px !important; -} - -.ml-15 { - margin-left: 15px !important; -} - -.ml-20 { - margin-left: 20px !important; -} - -.ml-30 { - margin-left: 30px !important; -} - -.ml-40 { - margin-left: 40px !important; -} - -.ml-50 { - margin-left: 50px !important; -} - -.m-auto { - margin: auto !important; -} - -.mt-auto { - margin-top: auto !important; -} - -.mr-auto { - margin-right: auto !important; -} - -.mb-auto { - margin-bottom: auto !important; -} - -.ml-auto { - margin-left: auto !important; -} - -.p-0 { - padding: 0px !important; -} - -.p-5 { - padding: 5px !important; -} - -.p-10 { - padding: 10px !important; -} - -.p-15 { - padding: 15px !important; -} - -.p-20 { - padding: 20px !important; -} - -.p-30 { - padding: 30px !important; -} - -.p-40 { - padding: 40px !important; -} - -.p-50 { - padding: 50px !important; -} - -.pt-0 { - padding-top: 0px !important; -} - -.pt-5 { - padding-top: 5px !important; -} - -.pt-10 { - padding-top: 10px !important; -} - -.pt-15 { - padding-top: 15px !important; -} - -.pt-20 { - padding-top: 20px !important; -} - -.pt-30 { - padding-top: 30px !important; -} - -.pt-40 { - padding-top: 40px !important; -} - -.pt-50 { - padding-top: 50px !important; -} - -.pr-0 { - padding-right: 0px !important; -} - -.pr-5 { - padding-right: 5px !important; -} - -.pr-10 { - padding-right: 10px !important; -} - -.pr-15 { - padding-right: 15px !important; -} - -.pr-20 { - padding-right: 20px !important; -} - -.pr-30 { - padding-right: 30px !important; -} - -.pr-40 { - padding-right: 40px !important; -} - -.pr-50 { - padding-right: 50px !important; -} - -.pb-0 { - padding-bottom: 0px !important; -} - -.pb-5 { - padding-bottom: 5px !important; -} - -.pb-10 { - padding-bottom: 10px !important; -} - -.pb-15 { - padding-bottom: 15px !important; -} - -.pb-20 { - padding-bottom: 20px !important; -} - -.pb-30 { - padding-bottom: 30px !important; -} - -.pb-40 { - padding-bottom: 40px !important; -} - -.pb-50 { - padding-bottom: 50px !important; -} - -.pl-0 { - padding-left: 0px !important; -} - -.pl-5 { - padding-left: 5px !important; -} - -.pl-10 { - padding-left: 10px !important; -} - -.pl-15 { - padding-left: 15px !important; -} - -.pl-20 { - padding-left: 20px !important; -} - -.pl-30 { - padding-left: 30px !important; -} - -.pl-40 { - padding-left: 40px !important; -} - -.pl-50 { - padding-left: 50px !important; -} - -.p-auto { - padding: auto !important; -} - -.pt-auto { - padding-top: auto !important; -} - -.pr-auto { - padding-right: auto !important; -} - -.pb-auto { - padding-bottom: auto !important; -} - -.pl-auto { - padding-left: auto !important; -} - -.fw-100 { - font-weight: 100 !important; -} - -.fw-200 { - font-weight: 200 !important; -} - -.fw-300 { - font-weight: 300 !important; -} - -.fw-400 { - font-weight: 400 !important; -} - -.fw-500 { - font-weight: 500 !important; -} - -.fw-600 { - font-weight: 600 !important; -} - -.fw-700 { - font-weight: 700 !important; -} - -.fw-800 { - font-weight: 800 !important; -} - -.fw-900 { - font-weight: 900 !important; -} - -.mini-text { - font-size: 60% !important; -} - -.tiny-text { - font-size: 73% !important; -} - -.small-text { - font-size: 85% !important; -} - -.large-text { - font-size: 120% !important; -} - -.big-text { - font-size: 175% !important; -} - -.huge-text { - font-size: 200% !important; -} - -.giant-text { - font-size: 350% !important; -} - -.color-grey { - color: #77878b !important; -} - -.color-white { - color: #fff !important; -} - -.color-black { - color: #000 !important; -} - -.color-primary { - color: #0a8fff !important; -} - -.color-success { - color: #2ec4b6 !important; -} - -.color-warning { - color: #de9e36 !important; -} - -.color-error { - color: #d62828 !important; -} - -.bg-grey { - background-color: #77878b !important; -} - -.bg-secondary { - background-color: #e6e6e6 !important; -} - -.bg-white { - background-color: #fff !important; -} - -.bg-black { - background-color: #3f4143 !important; -} - -.bg-dark { - background-color: #414552 !important; -} - -.bg-primary { - background-color: #0a8fff !important; -} - -.bg-success { - background-color: #2ec4b6 !important; -} - -.bg-warning { - background-color: #de9e36 !important; -} - -.bg-error { - background-color: #d62828 !important; -} - -.bg-grid { - height: 100%; - background-color: #fff; - background-position: center center; - background-image: -webkit-gradient(linear, left top, right top, color-stop(1%, #8ac9ff), color-stop(16%, transparent)), -webkit-gradient(linear, left top, left bottom, color-stop(1%, #8ac9ff), color-stop(16%, transparent)); - background-image: linear-gradient(90deg, #8ac9ff 1%, transparent 16%), linear-gradient(#8ac9ff 1%, transparent 16%); - background-size: 10px 10px; -} - -.bg-stripe { - height: 100%; - background-image: linear-gradient(#fff, #fff 7px, #0a8fff 4px, #dbdbdb); - background-size: 100% 8px; -} - -.cursor-alias { - cursor: alias !important; -} - -.cursor-default { - cursor: default !important; -} - -.cursor-grab { - cursor: -webkit-grab !important; - cursor: grab !important; -} - -.cursor-help { - cursor: help !important; -} - -.cursor-move { - cursor: move !important; -} - -.cursor-pointer { - cursor: pointer !important; -} - -.cursor-wait { - cursor: wait !important; -} - -.cursor-zoom-in { - cursor: -webkit-zoom-in !important; - cursor: zoom-in !important; -} - -.cursor-zoom-out { - cursor: -webkit-zoom-out !important; - cursor: zoom-out !important; -} - -.display-inline { - display: inline !important; -} - -.display-flex { - display: -webkit-box !important; - display: -ms-flexbox !important; - display: flex !important; -} - -.display-inline-flex { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; - display: inline-flex !important; -} - -.display-grid { - display: grid !important; -} - -.display-inline-grid { - display: inline-grid !important; -} - -.display-block { - display: block !important; -} - -.display-inline-block { - display: inline-block !important; -} - -.display-table { - display: table !important; -} - -.display-inline-table { - display: inline-table !important; -} - -.display-table-row { - display: table-row !important; -} - -.display-table-column { - display: table-column !important; -} - -.display-table-cell { - display: table-cell !important; -} - -.align-items-baseline { - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; -} - -.align-items-flex-start { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start; -} - -.align-items-flex-end { - -webkit-box-align: end; - -ms-flex-align: end; - align-items: flex-end; -} - -.align-items-center { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -.align-items-stretch { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; -} - -.align-items-initial { - -webkit-box-align: initial; - -ms-flex-align: initial; - align-items: initial; -} - -.align-items-inherit { - -webkit-box-align: inherit; - -ms-flex-align: inherit; - align-items: inherit; -} - -.align-self-auto { - -ms-flex-item-align: auto; - align-self: auto; -} - -.align-self-baseline { - -ms-flex-item-align: baseline; - align-self: baseline; -} - -.align-self-flex-start { - -ms-flex-item-align: start; - align-self: flex-start; -} - -.align-self-flex-end { - -ms-flex-item-align: end; - align-self: flex-end; -} - -.align-self-center { - -ms-flex-item-align: center; - align-self: center; -} - -.align-self-stretch { - -ms-flex-item-align: stretch; - align-self: stretch; -} - -.align-self-initial { - -ms-flex-item-align: initial; - align-self: initial; -} - -.align-self-inherit { - -ms-flex-item-align: inherit; - align-self: inherit; -} - -.justify-content-baseline { - -webkit-box-pack: baseline; - -ms-flex-pack: baseline; - justify-content: baseline; -} - -.justify-content-flex-start { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; -} - -.justify-content-flex-end { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; -} - -.justify-content-center { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; -} - -.justify-content-space-between { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; -} - -.justify-content-space-around { - -ms-flex-pack: distribute; - justify-content: space-around; -} - -.justify-content-initial { - -webkit-box-pack: initial; - -ms-flex-pack: initial; - justify-content: initial; -} - -.justify-content-inherit { - -webkit-box-pack: inherit; - -ms-flex-pack: inherit; - justify-content: inherit; -} - -.filter-invert { - -webkit-filter: invert(100%); - filter: invert(100%); -} - -.filter-gray { - -webkit-filter: grayscale(100%); - filter: grayscale(100%); -} - -.text-uppercase { - text-transform: uppercase; -} - -.text-lowercase { - text-transform: lowercase; -} - -.text-capitalize { - text-transform: capitalize; -} - -.overflow-auto { - overflow: auto; -} - -.overflow-hidden { - overflow: hidden; -} - -.overflow-visible { - overflow: visible; -} - -.overflow-x-auto { - overflow-x: auto; -} - -.overflow-x-hidden { - overflow-x: hidden; -} - -.overflow-x-visible { - overflow-x: visible; -} - -.overflow-x-scroll { - overflow-x: scroll; -} - -.overflow-y-auto { - overflow-y: auto; -} - -.overflow-y-hidden { - overflow-y: hidden; -} - -.overflow-y-visible { - overflow-y: visible; -} - -.overflow-y-scroll { - overflow-y: scroll; -} - -.position-static { - position: static; -} - -.position-absolute { - position: absolute; -} - -.position-fixed { - position: fixed; -} - -.position-relative { - position: relative; -} - -.position-sticky { - position: -webkit-sticky; - position: sticky; -} - -.position-initial { - position: initial; -} - -.position-inherit { - position: inherit; -} - -.z--1 { - z-index: -1 !important; -} - -.z-0 { - z-index: 0 !important; -} - -.z-1 { - z-index: 1 !important; -} - -.z-10 { - z-index: 10 !important; -} - -.z-20 { - z-index: 20 !important; -} - -.z-30 { - z-index: 30 !important; -} - -.z-40 { - z-index: 40 !important; -} - -.z-50 { - z-index: 50 !important; -} - -.z-100 { - z-index: 100 !important; -} - -.z-999 { - z-index: 999 !important; -} - -.z-9999 { - z-index: 9999 !important; -} - -.flex-direction-row { - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; -} - -.flex-direction-row-reverse { - -webkit-box-orient: horizontal; - -webkit-box-direction: reverse; - -ms-flex-direction: row-reverse; - flex-direction: row-reverse; -} - -.flex-direction-column { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; -} - -.flex-direction-column-reverse { - -webkit-box-orient: vertical; - -webkit-box-direction: reverse; - -ms-flex-direction: column-reverse; - flex-direction: column-reverse; -} - -.flex-direction-initial { - -webkit-box-orient: initial; - -webkit-box-direction: initial; - -ms-flex-direction: initial; - flex-direction: initial; -} - -.flex-direction-inherit { - -webkit-box-orient: inherit; - -webkit-box-direction: inherit; - -ms-flex-direction: inherit; - flex-direction: inherit; -} - -.user-select-none { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -.user-select-auto { - -webkit-user-select: auto; - -moz-user-select: auto; - -ms-user-select: auto; - user-select: auto; -} - -.user-select-text { - -webkit-user-select: text; - -moz-user-select: text; - -ms-user-select: text; - user-select: text; -} - -.user-select-all { - -webkit-user-select: all; - -moz-user-select: all; - -ms-user-select: all; - user-select: all; -} - -.top-0 { - top: 0; -} - -.top-auto { - top: auto; -} - -.bottom-0 { - bottom: 0; -} - -.bottom-auto { - bottom: auto; -} - -.left-0 { - left: 0; -} - -.left-auto { - left: auto; -} - -.right-0 { - right: 0; -} - -.right-auto { - right: auto; -} - -.line-height-0 { - line-height: 0 !important; -} - -.line-height-1 { - line-height: 1 !important; -} - -.line-height-2 { - line-height: 2 !important; -} - -.line-height-3 { - line-height: 3 !important; -} - -.line-height-4 { - line-height: 4 !important; -} - -.line-height-5 { - line-height: 5 !important; -} - -.radius-4 { - border-radius: 4px !important; -} - -.radius-8 { - border-radius: 8px !important; -} - -.radius-10 { - border-radius: 10px !important; -} - -.radius-12 { - border-radius: 12px !important; -} - -.radius-14 { - border-radius: 14px !important; -} - -.centered { - margin: 0 auto; -} - -.align.right { - text-align: right !important; -} - -.align.left { - text-align: left !important; -} - -.align.center { - text-align: center !important; -} - -.align.justify { - text-align: justify !important; -} - -.float.right { - float: right; -} - -.float.left { - float: left; -} - -.full.width { - width: 100%; - max-width: 100%; - min-width: 100%; -} - -.full.height { - height: 100%; - min-height: 100%; - max-height: 100%; -} - -.fade { - opacity: 0; -} - -.hide { - display: none; -} - -.spacer { - -webkit-box-flex: 1 !important; - -ms-flex-positive: 1 !important; - flex-grow: 1 !important; - outline: none; -} - -.avatar { - display: inline-block; - border-radius: 50%; -} - -.reset { - padding: 0 !important; - margin: 0 !important; -} - -.reverse { - -webkit-transform: rotateY(180deg); - -moz-transform: rotateY(180deg); - -o-transform: rotateY(180deg); - -ms-transform: rotateY(180deg); - unicode-bidi: bidi-override; - direction: rtl; -} - -.truncate { - display: block; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; -} - -.transparent { - background: transparent !important; -} - -.pure, .pure > div { - background: transparent; - border: none; - -webkit-box-shadow: none; - box-shadow: none; -} - -.bordered { - border: 1px solid #c6c6c6 !important; -} - -.borderless { - border: none !important; -} - -.rounded { - border-radius: 4px; -} - -.radiusless { - border-radius: 0 !important; -} - -.shadowed { - -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); -} - -.shadowless { - -webkit-box-shadow: none !important; - box-shadow: none !important; -} - -.inset-0 { - top: 0; - right: 0; - bottom: 0; - left: 0; -} - -.inset-auto { - top: auto; - right: auto; - bottom: auto; - left: auto; -} diff --git a/dist/punica.min.css b/dist/punica.min.css index 9ff8730d..224350bf 100644 --- a/dist/punica.min.css +++ b/dist/punica.min.css @@ -1 +1 @@ -@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;900&display=swap);*,:after,:before{-webkit-box-sizing:inherit;box-sizing:inherit}*{margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;text-shadow:1px 1px 1px rgba(0,0,0,.004)!important}html{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:13px;font-weight:400;line-height:1.7;color:#3f4143}body,html{min-height:100%;height:100%;padding:0;margin:0;border:none}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#e6e6e6}::-webkit-scrollbar-thumb{background:#414552}::-moz-selection{background-color:#0a8fff;color:#fff}::selection{background-color:#0a8fff;color:#fff}a{color:#3f4143;outline:none;text-decoration:none}a.active,a:active,a:focus,a:hover{color:#007ae0;text-decoration:underline}a:visited{color:#3f4143}hr{margin:15px 0;-webkit-box-shadow:0 .05rem .2rem rgba(48,55,66,.3);box-shadow:0 .05rem .2rem rgba(48,55,66,.3);background-color:#ccc;border:none;height:1px}ol,ul{padding:0}ol,ol ol,ol ul,ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ol{list-style:decimal inside}dl dt{font-weight:700}canvas,embed,img,object,video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}img{border-style:none}iframe{outline:0}:not(pre)>code,:not(pre)>kbd,:not(pre)>samp{color:#d62828;white-space:nowrap;padding:2px 6px;font-size:.935em}.container{width:100%;margin:0 auto;padding:0 40px}.row{display:grid;grid-gap:6px;grid-template-columns:repeat(16,1fr)}.row>[class^=col]{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:.3rem;min-height:.125rem}.row.equal>[class^=col]{height:auto}@media only screen and (max-width:768px){.container{padding:0 13.33333px}}@media only screen and (min-width:0){.col-1,.col-xs-1{grid-column:span 1}.col-xs-1.offset-xs-2{grid-column:2/span 1}.col-xs-1.offset-xs-3{grid-column:3/span 1}.col-xs-1.offset-xs-4{grid-column:4/span 1}.col-xs-1.offset-xs-5{grid-column:5/span 1}.col-xs-1.offset-xs-6{grid-column:6/span 1}.col-xs-1.offset-xs-7{grid-column:7/span 1}.col-xs-1.offset-xs-8{grid-column:8/span 1}.col-xs-1.offset-xs-9{grid-column:9/span 1}.col-xs-1.offset-xs-10{grid-column:10/span 1}.col-xs-1.offset-xs-11{grid-column:11/span 1}.col-xs-1.offset-xs-12{grid-column:12/span 1}.col-xs-1.offset-xs-13{grid-column:13/span 1}.col-xs-1.offset-xs-14{grid-column:14/span 1}.col-xs-1.offset-xs-15{grid-column:15/span 1}.col-xs-1.offset-xs-16{grid-column:16/span 1}.col-2,.col-xs-2{grid-column:span 2}.col-xs-2.offset-xs-2{grid-column:2/span 2}.col-xs-2.offset-xs-3{grid-column:3/span 2}.col-xs-2.offset-xs-4{grid-column:4/span 2}.col-xs-2.offset-xs-5{grid-column:5/span 2}.col-xs-2.offset-xs-6{grid-column:6/span 2}.col-xs-2.offset-xs-7{grid-column:7/span 2}.col-xs-2.offset-xs-8{grid-column:8/span 2}.col-xs-2.offset-xs-9{grid-column:9/span 2}.col-xs-2.offset-xs-10{grid-column:10/span 2}.col-xs-2.offset-xs-11{grid-column:11/span 2}.col-xs-2.offset-xs-12{grid-column:12/span 2}.col-xs-2.offset-xs-13{grid-column:13/span 2}.col-xs-2.offset-xs-14{grid-column:14/span 2}.col-xs-2.offset-xs-15{grid-column:15/span 2}.col-xs-2.offset-xs-16{grid-column:16/span 2}.col-3,.col-xs-3{grid-column:span 3}.col-xs-3.offset-xs-2{grid-column:2/span 3}.col-xs-3.offset-xs-3{grid-column:3/span 3}.col-xs-3.offset-xs-4{grid-column:4/span 3}.col-xs-3.offset-xs-5{grid-column:5/span 3}.col-xs-3.offset-xs-6{grid-column:6/span 3}.col-xs-3.offset-xs-7{grid-column:7/span 3}.col-xs-3.offset-xs-8{grid-column:8/span 3}.col-xs-3.offset-xs-9{grid-column:9/span 3}.col-xs-3.offset-xs-10{grid-column:10/span 3}.col-xs-3.offset-xs-11{grid-column:11/span 3}.col-xs-3.offset-xs-12{grid-column:12/span 3}.col-xs-3.offset-xs-13{grid-column:13/span 3}.col-xs-3.offset-xs-14{grid-column:14/span 3}.col-xs-3.offset-xs-15{grid-column:15/span 3}.col-xs-3.offset-xs-16{grid-column:16/span 3}.col-4,.col-xs-4{grid-column:span 4}.col-xs-4.offset-xs-2{grid-column:2/span 4}.col-xs-4.offset-xs-3{grid-column:3/span 4}.col-xs-4.offset-xs-4{grid-column:4/span 4}.col-xs-4.offset-xs-5{grid-column:5/span 4}.col-xs-4.offset-xs-6{grid-column:6/span 4}.col-xs-4.offset-xs-7{grid-column:7/span 4}.col-xs-4.offset-xs-8{grid-column:8/span 4}.col-xs-4.offset-xs-9{grid-column:9/span 4}.col-xs-4.offset-xs-10{grid-column:10/span 4}.col-xs-4.offset-xs-11{grid-column:11/span 4}.col-xs-4.offset-xs-12{grid-column:12/span 4}.col-xs-4.offset-xs-13{grid-column:13/span 4}.col-xs-4.offset-xs-14{grid-column:14/span 4}.col-xs-4.offset-xs-15{grid-column:15/span 4}.col-xs-4.offset-xs-16{grid-column:16/span 4}.col-5,.col-xs-5{grid-column:span 5}.col-xs-5.offset-xs-2{grid-column:2/span 5}.col-xs-5.offset-xs-3{grid-column:3/span 5}.col-xs-5.offset-xs-4{grid-column:4/span 5}.col-xs-5.offset-xs-5{grid-column:5/span 5}.col-xs-5.offset-xs-6{grid-column:6/span 5}.col-xs-5.offset-xs-7{grid-column:7/span 5}.col-xs-5.offset-xs-8{grid-column:8/span 5}.col-xs-5.offset-xs-9{grid-column:9/span 5}.col-xs-5.offset-xs-10{grid-column:10/span 5}.col-xs-5.offset-xs-11{grid-column:11/span 5}.col-xs-5.offset-xs-12{grid-column:12/span 5}.col-xs-5.offset-xs-13{grid-column:13/span 5}.col-xs-5.offset-xs-14{grid-column:14/span 5}.col-xs-5.offset-xs-15{grid-column:15/span 5}.col-xs-5.offset-xs-16{grid-column:16/span 5}.col-6,.col-xs-6{grid-column:span 6}.col-xs-6.offset-xs-2{grid-column:2/span 6}.col-xs-6.offset-xs-3{grid-column:3/span 6}.col-xs-6.offset-xs-4{grid-column:4/span 6}.col-xs-6.offset-xs-5{grid-column:5/span 6}.col-xs-6.offset-xs-6{grid-column:6/span 6}.col-xs-6.offset-xs-7{grid-column:7/span 6}.col-xs-6.offset-xs-8{grid-column:8/span 6}.col-xs-6.offset-xs-9{grid-column:9/span 6}.col-xs-6.offset-xs-10{grid-column:10/span 6}.col-xs-6.offset-xs-11{grid-column:11/span 6}.col-xs-6.offset-xs-12{grid-column:12/span 6}.col-xs-6.offset-xs-13{grid-column:13/span 6}.col-xs-6.offset-xs-14{grid-column:14/span 6}.col-xs-6.offset-xs-15{grid-column:15/span 6}.col-xs-6.offset-xs-16{grid-column:16/span 6}.col-7,.col-xs-7{grid-column:span 7}.col-xs-7.offset-xs-2{grid-column:2/span 7}.col-xs-7.offset-xs-3{grid-column:3/span 7}.col-xs-7.offset-xs-4{grid-column:4/span 7}.col-xs-7.offset-xs-5{grid-column:5/span 7}.col-xs-7.offset-xs-6{grid-column:6/span 7}.col-xs-7.offset-xs-7{grid-column:7/span 7}.col-xs-7.offset-xs-8{grid-column:8/span 7}.col-xs-7.offset-xs-9{grid-column:9/span 7}.col-xs-7.offset-xs-10{grid-column:10/span 7}.col-xs-7.offset-xs-11{grid-column:11/span 7}.col-xs-7.offset-xs-12{grid-column:12/span 7}.col-xs-7.offset-xs-13{grid-column:13/span 7}.col-xs-7.offset-xs-14{grid-column:14/span 7}.col-xs-7.offset-xs-15{grid-column:15/span 7}.col-xs-7.offset-xs-16{grid-column:16/span 7}.col-8,.col-xs-8{grid-column:span 8}.col-xs-8.offset-xs-2{grid-column:2/span 8}.col-xs-8.offset-xs-3{grid-column:3/span 8}.col-xs-8.offset-xs-4{grid-column:4/span 8}.col-xs-8.offset-xs-5{grid-column:5/span 8}.col-xs-8.offset-xs-6{grid-column:6/span 8}.col-xs-8.offset-xs-7{grid-column:7/span 8}.col-xs-8.offset-xs-8{grid-column:8/span 8}.col-xs-8.offset-xs-9{grid-column:9/span 8}.col-xs-8.offset-xs-10{grid-column:10/span 8}.col-xs-8.offset-xs-11{grid-column:11/span 8}.col-xs-8.offset-xs-12{grid-column:12/span 8}.col-xs-8.offset-xs-13{grid-column:13/span 8}.col-xs-8.offset-xs-14{grid-column:14/span 8}.col-xs-8.offset-xs-15{grid-column:15/span 8}.col-xs-8.offset-xs-16{grid-column:16/span 8}.col-9,.col-xs-9{grid-column:span 9}.col-xs-9.offset-xs-2{grid-column:2/span 9}.col-xs-9.offset-xs-3{grid-column:3/span 9}.col-xs-9.offset-xs-4{grid-column:4/span 9}.col-xs-9.offset-xs-5{grid-column:5/span 9}.col-xs-9.offset-xs-6{grid-column:6/span 9}.col-xs-9.offset-xs-7{grid-column:7/span 9}.col-xs-9.offset-xs-8{grid-column:8/span 9}.col-xs-9.offset-xs-9{grid-column:9/span 9}.col-xs-9.offset-xs-10{grid-column:10/span 9}.col-xs-9.offset-xs-11{grid-column:11/span 9}.col-xs-9.offset-xs-12{grid-column:12/span 9}.col-xs-9.offset-xs-13{grid-column:13/span 9}.col-xs-9.offset-xs-14{grid-column:14/span 9}.col-xs-9.offset-xs-15{grid-column:15/span 9}.col-xs-9.offset-xs-16{grid-column:16/span 9}.col-10,.col-xs-10{grid-column:span 10}.col-xs-10.offset-xs-2{grid-column:2/span 10}.col-xs-10.offset-xs-3{grid-column:3/span 10}.col-xs-10.offset-xs-4{grid-column:4/span 10}.col-xs-10.offset-xs-5{grid-column:5/span 10}.col-xs-10.offset-xs-6{grid-column:6/span 10}.col-xs-10.offset-xs-7{grid-column:7/span 10}.col-xs-10.offset-xs-8{grid-column:8/span 10}.col-xs-10.offset-xs-9{grid-column:9/span 10}.col-xs-10.offset-xs-10{grid-column:10/span 10}.col-xs-10.offset-xs-11{grid-column:11/span 10}.col-xs-10.offset-xs-12{grid-column:12/span 10}.col-xs-10.offset-xs-13{grid-column:13/span 10}.col-xs-10.offset-xs-14{grid-column:14/span 10}.col-xs-10.offset-xs-15{grid-column:15/span 10}.col-xs-10.offset-xs-16{grid-column:16/span 10}.col-11,.col-xs-11{grid-column:span 11}.col-xs-11.offset-xs-2{grid-column:2/span 11}.col-xs-11.offset-xs-3{grid-column:3/span 11}.col-xs-11.offset-xs-4{grid-column:4/span 11}.col-xs-11.offset-xs-5{grid-column:5/span 11}.col-xs-11.offset-xs-6{grid-column:6/span 11}.col-xs-11.offset-xs-7{grid-column:7/span 11}.col-xs-11.offset-xs-8{grid-column:8/span 11}.col-xs-11.offset-xs-9{grid-column:9/span 11}.col-xs-11.offset-xs-10{grid-column:10/span 11}.col-xs-11.offset-xs-11{grid-column:11/span 11}.col-xs-11.offset-xs-12{grid-column:12/span 11}.col-xs-11.offset-xs-13{grid-column:13/span 11}.col-xs-11.offset-xs-14{grid-column:14/span 11}.col-xs-11.offset-xs-15{grid-column:15/span 11}.col-xs-11.offset-xs-16{grid-column:16/span 11}.col-12,.col-xs-12{grid-column:span 12}.col-xs-12.offset-xs-2{grid-column:2/span 12}.col-xs-12.offset-xs-3{grid-column:3/span 12}.col-xs-12.offset-xs-4{grid-column:4/span 12}.col-xs-12.offset-xs-5{grid-column:5/span 12}.col-xs-12.offset-xs-6{grid-column:6/span 12}.col-xs-12.offset-xs-7{grid-column:7/span 12}.col-xs-12.offset-xs-8{grid-column:8/span 12}.col-xs-12.offset-xs-9{grid-column:9/span 12}.col-xs-12.offset-xs-10{grid-column:10/span 12}.col-xs-12.offset-xs-11{grid-column:11/span 12}.col-xs-12.offset-xs-12{grid-column:12/span 12}.col-xs-12.offset-xs-13{grid-column:13/span 12}.col-xs-12.offset-xs-14{grid-column:14/span 12}.col-xs-12.offset-xs-15{grid-column:15/span 12}.col-xs-12.offset-xs-16{grid-column:16/span 12}.col-13,.col-xs-13{grid-column:span 13}.col-xs-13.offset-xs-2{grid-column:2/span 13}.col-xs-13.offset-xs-3{grid-column:3/span 13}.col-xs-13.offset-xs-4{grid-column:4/span 13}.col-xs-13.offset-xs-5{grid-column:5/span 13}.col-xs-13.offset-xs-6{grid-column:6/span 13}.col-xs-13.offset-xs-7{grid-column:7/span 13}.col-xs-13.offset-xs-8{grid-column:8/span 13}.col-xs-13.offset-xs-9{grid-column:9/span 13}.col-xs-13.offset-xs-10{grid-column:10/span 13}.col-xs-13.offset-xs-11{grid-column:11/span 13}.col-xs-13.offset-xs-12{grid-column:12/span 13}.col-xs-13.offset-xs-13{grid-column:13/span 13}.col-xs-13.offset-xs-14{grid-column:14/span 13}.col-xs-13.offset-xs-15{grid-column:15/span 13}.col-xs-13.offset-xs-16{grid-column:16/span 13}.col-14,.col-xs-14{grid-column:span 14}.col-xs-14.offset-xs-2{grid-column:2/span 14}.col-xs-14.offset-xs-3{grid-column:3/span 14}.col-xs-14.offset-xs-4{grid-column:4/span 14}.col-xs-14.offset-xs-5{grid-column:5/span 14}.col-xs-14.offset-xs-6{grid-column:6/span 14}.col-xs-14.offset-xs-7{grid-column:7/span 14}.col-xs-14.offset-xs-8{grid-column:8/span 14}.col-xs-14.offset-xs-9{grid-column:9/span 14}.col-xs-14.offset-xs-10{grid-column:10/span 14}.col-xs-14.offset-xs-11{grid-column:11/span 14}.col-xs-14.offset-xs-12{grid-column:12/span 14}.col-xs-14.offset-xs-13{grid-column:13/span 14}.col-xs-14.offset-xs-14{grid-column:14/span 14}.col-xs-14.offset-xs-15{grid-column:15/span 14}.col-xs-14.offset-xs-16{grid-column:16/span 14}.col-15,.col-xs-15{grid-column:span 15}.col-xs-15.offset-xs-2{grid-column:2/span 15}.col-xs-15.offset-xs-3{grid-column:3/span 15}.col-xs-15.offset-xs-4{grid-column:4/span 15}.col-xs-15.offset-xs-5{grid-column:5/span 15}.col-xs-15.offset-xs-6{grid-column:6/span 15}.col-xs-15.offset-xs-7{grid-column:7/span 15}.col-xs-15.offset-xs-8{grid-column:8/span 15}.col-xs-15.offset-xs-9{grid-column:9/span 15}.col-xs-15.offset-xs-10{grid-column:10/span 15}.col-xs-15.offset-xs-11{grid-column:11/span 15}.col-xs-15.offset-xs-12{grid-column:12/span 15}.col-xs-15.offset-xs-13{grid-column:13/span 15}.col-xs-15.offset-xs-14{grid-column:14/span 15}.col-xs-15.offset-xs-15{grid-column:15/span 15}.col-xs-15.offset-xs-16{grid-column:16/span 15}.col-16,.col-xs-16{grid-column:span 16}.col-xs-16.offset-xs-2{grid-column:2/span 16}.col-xs-16.offset-xs-3{grid-column:3/span 16}.col-xs-16.offset-xs-4{grid-column:4/span 16}.col-xs-16.offset-xs-5{grid-column:5/span 16}.col-xs-16.offset-xs-6{grid-column:6/span 16}.col-xs-16.offset-xs-7{grid-column:7/span 16}.col-xs-16.offset-xs-8{grid-column:8/span 16}.col-xs-16.offset-xs-9{grid-column:9/span 16}.col-xs-16.offset-xs-10{grid-column:10/span 16}.col-xs-16.offset-xs-11{grid-column:11/span 16}.col-xs-16.offset-xs-12{grid-column:12/span 16}.col-xs-16.offset-xs-13{grid-column:13/span 16}.col-xs-16.offset-xs-14{grid-column:14/span 16}.col-xs-16.offset-xs-15{grid-column:15/span 16}.col-xs-16.offset-xs-16{grid-column:16/span 16}}@media only screen and (min-width:500px){.col-1,.col-sm-1{grid-column:span 1}.col-sm-1.offset-sm-2{grid-column:2/span 1}.col-sm-1.offset-sm-3{grid-column:3/span 1}.col-sm-1.offset-sm-4{grid-column:4/span 1}.col-sm-1.offset-sm-5{grid-column:5/span 1}.col-sm-1.offset-sm-6{grid-column:6/span 1}.col-sm-1.offset-sm-7{grid-column:7/span 1}.col-sm-1.offset-sm-8{grid-column:8/span 1}.col-sm-1.offset-sm-9{grid-column:9/span 1}.col-sm-1.offset-sm-10{grid-column:10/span 1}.col-sm-1.offset-sm-11{grid-column:11/span 1}.col-sm-1.offset-sm-12{grid-column:12/span 1}.col-sm-1.offset-sm-13{grid-column:13/span 1}.col-sm-1.offset-sm-14{grid-column:14/span 1}.col-sm-1.offset-sm-15{grid-column:15/span 1}.col-sm-1.offset-sm-16{grid-column:16/span 1}.col-2,.col-sm-2{grid-column:span 2}.col-sm-2.offset-sm-2{grid-column:2/span 2}.col-sm-2.offset-sm-3{grid-column:3/span 2}.col-sm-2.offset-sm-4{grid-column:4/span 2}.col-sm-2.offset-sm-5{grid-column:5/span 2}.col-sm-2.offset-sm-6{grid-column:6/span 2}.col-sm-2.offset-sm-7{grid-column:7/span 2}.col-sm-2.offset-sm-8{grid-column:8/span 2}.col-sm-2.offset-sm-9{grid-column:9/span 2}.col-sm-2.offset-sm-10{grid-column:10/span 2}.col-sm-2.offset-sm-11{grid-column:11/span 2}.col-sm-2.offset-sm-12{grid-column:12/span 2}.col-sm-2.offset-sm-13{grid-column:13/span 2}.col-sm-2.offset-sm-14{grid-column:14/span 2}.col-sm-2.offset-sm-15{grid-column:15/span 2}.col-sm-2.offset-sm-16{grid-column:16/span 2}.col-3,.col-sm-3{grid-column:span 3}.col-sm-3.offset-sm-2{grid-column:2/span 3}.col-sm-3.offset-sm-3{grid-column:3/span 3}.col-sm-3.offset-sm-4{grid-column:4/span 3}.col-sm-3.offset-sm-5{grid-column:5/span 3}.col-sm-3.offset-sm-6{grid-column:6/span 3}.col-sm-3.offset-sm-7{grid-column:7/span 3}.col-sm-3.offset-sm-8{grid-column:8/span 3}.col-sm-3.offset-sm-9{grid-column:9/span 3}.col-sm-3.offset-sm-10{grid-column:10/span 3}.col-sm-3.offset-sm-11{grid-column:11/span 3}.col-sm-3.offset-sm-12{grid-column:12/span 3}.col-sm-3.offset-sm-13{grid-column:13/span 3}.col-sm-3.offset-sm-14{grid-column:14/span 3}.col-sm-3.offset-sm-15{grid-column:15/span 3}.col-sm-3.offset-sm-16{grid-column:16/span 3}.col-4,.col-sm-4{grid-column:span 4}.col-sm-4.offset-sm-2{grid-column:2/span 4}.col-sm-4.offset-sm-3{grid-column:3/span 4}.col-sm-4.offset-sm-4{grid-column:4/span 4}.col-sm-4.offset-sm-5{grid-column:5/span 4}.col-sm-4.offset-sm-6{grid-column:6/span 4}.col-sm-4.offset-sm-7{grid-column:7/span 4}.col-sm-4.offset-sm-8{grid-column:8/span 4}.col-sm-4.offset-sm-9{grid-column:9/span 4}.col-sm-4.offset-sm-10{grid-column:10/span 4}.col-sm-4.offset-sm-11{grid-column:11/span 4}.col-sm-4.offset-sm-12{grid-column:12/span 4}.col-sm-4.offset-sm-13{grid-column:13/span 4}.col-sm-4.offset-sm-14{grid-column:14/span 4}.col-sm-4.offset-sm-15{grid-column:15/span 4}.col-sm-4.offset-sm-16{grid-column:16/span 4}.col-5,.col-sm-5{grid-column:span 5}.col-sm-5.offset-sm-2{grid-column:2/span 5}.col-sm-5.offset-sm-3{grid-column:3/span 5}.col-sm-5.offset-sm-4{grid-column:4/span 5}.col-sm-5.offset-sm-5{grid-column:5/span 5}.col-sm-5.offset-sm-6{grid-column:6/span 5}.col-sm-5.offset-sm-7{grid-column:7/span 5}.col-sm-5.offset-sm-8{grid-column:8/span 5}.col-sm-5.offset-sm-9{grid-column:9/span 5}.col-sm-5.offset-sm-10{grid-column:10/span 5}.col-sm-5.offset-sm-11{grid-column:11/span 5}.col-sm-5.offset-sm-12{grid-column:12/span 5}.col-sm-5.offset-sm-13{grid-column:13/span 5}.col-sm-5.offset-sm-14{grid-column:14/span 5}.col-sm-5.offset-sm-15{grid-column:15/span 5}.col-sm-5.offset-sm-16{grid-column:16/span 5}.col-6,.col-sm-6{grid-column:span 6}.col-sm-6.offset-sm-2{grid-column:2/span 6}.col-sm-6.offset-sm-3{grid-column:3/span 6}.col-sm-6.offset-sm-4{grid-column:4/span 6}.col-sm-6.offset-sm-5{grid-column:5/span 6}.col-sm-6.offset-sm-6{grid-column:6/span 6}.col-sm-6.offset-sm-7{grid-column:7/span 6}.col-sm-6.offset-sm-8{grid-column:8/span 6}.col-sm-6.offset-sm-9{grid-column:9/span 6}.col-sm-6.offset-sm-10{grid-column:10/span 6}.col-sm-6.offset-sm-11{grid-column:11/span 6}.col-sm-6.offset-sm-12{grid-column:12/span 6}.col-sm-6.offset-sm-13{grid-column:13/span 6}.col-sm-6.offset-sm-14{grid-column:14/span 6}.col-sm-6.offset-sm-15{grid-column:15/span 6}.col-sm-6.offset-sm-16{grid-column:16/span 6}.col-7,.col-sm-7{grid-column:span 7}.col-sm-7.offset-sm-2{grid-column:2/span 7}.col-sm-7.offset-sm-3{grid-column:3/span 7}.col-sm-7.offset-sm-4{grid-column:4/span 7}.col-sm-7.offset-sm-5{grid-column:5/span 7}.col-sm-7.offset-sm-6{grid-column:6/span 7}.col-sm-7.offset-sm-7{grid-column:7/span 7}.col-sm-7.offset-sm-8{grid-column:8/span 7}.col-sm-7.offset-sm-9{grid-column:9/span 7}.col-sm-7.offset-sm-10{grid-column:10/span 7}.col-sm-7.offset-sm-11{grid-column:11/span 7}.col-sm-7.offset-sm-12{grid-column:12/span 7}.col-sm-7.offset-sm-13{grid-column:13/span 7}.col-sm-7.offset-sm-14{grid-column:14/span 7}.col-sm-7.offset-sm-15{grid-column:15/span 7}.col-sm-7.offset-sm-16{grid-column:16/span 7}.col-8,.col-sm-8{grid-column:span 8}.col-sm-8.offset-sm-2{grid-column:2/span 8}.col-sm-8.offset-sm-3{grid-column:3/span 8}.col-sm-8.offset-sm-4{grid-column:4/span 8}.col-sm-8.offset-sm-5{grid-column:5/span 8}.col-sm-8.offset-sm-6{grid-column:6/span 8}.col-sm-8.offset-sm-7{grid-column:7/span 8}.col-sm-8.offset-sm-8{grid-column:8/span 8}.col-sm-8.offset-sm-9{grid-column:9/span 8}.col-sm-8.offset-sm-10{grid-column:10/span 8}.col-sm-8.offset-sm-11{grid-column:11/span 8}.col-sm-8.offset-sm-12{grid-column:12/span 8}.col-sm-8.offset-sm-13{grid-column:13/span 8}.col-sm-8.offset-sm-14{grid-column:14/span 8}.col-sm-8.offset-sm-15{grid-column:15/span 8}.col-sm-8.offset-sm-16{grid-column:16/span 8}.col-9,.col-sm-9{grid-column:span 9}.col-sm-9.offset-sm-2{grid-column:2/span 9}.col-sm-9.offset-sm-3{grid-column:3/span 9}.col-sm-9.offset-sm-4{grid-column:4/span 9}.col-sm-9.offset-sm-5{grid-column:5/span 9}.col-sm-9.offset-sm-6{grid-column:6/span 9}.col-sm-9.offset-sm-7{grid-column:7/span 9}.col-sm-9.offset-sm-8{grid-column:8/span 9}.col-sm-9.offset-sm-9{grid-column:9/span 9}.col-sm-9.offset-sm-10{grid-column:10/span 9}.col-sm-9.offset-sm-11{grid-column:11/span 9}.col-sm-9.offset-sm-12{grid-column:12/span 9}.col-sm-9.offset-sm-13{grid-column:13/span 9}.col-sm-9.offset-sm-14{grid-column:14/span 9}.col-sm-9.offset-sm-15{grid-column:15/span 9}.col-sm-9.offset-sm-16{grid-column:16/span 9}.col-10,.col-sm-10{grid-column:span 10}.col-sm-10.offset-sm-2{grid-column:2/span 10}.col-sm-10.offset-sm-3{grid-column:3/span 10}.col-sm-10.offset-sm-4{grid-column:4/span 10}.col-sm-10.offset-sm-5{grid-column:5/span 10}.col-sm-10.offset-sm-6{grid-column:6/span 10}.col-sm-10.offset-sm-7{grid-column:7/span 10}.col-sm-10.offset-sm-8{grid-column:8/span 10}.col-sm-10.offset-sm-9{grid-column:9/span 10}.col-sm-10.offset-sm-10{grid-column:10/span 10}.col-sm-10.offset-sm-11{grid-column:11/span 10}.col-sm-10.offset-sm-12{grid-column:12/span 10}.col-sm-10.offset-sm-13{grid-column:13/span 10}.col-sm-10.offset-sm-14{grid-column:14/span 10}.col-sm-10.offset-sm-15{grid-column:15/span 10}.col-sm-10.offset-sm-16{grid-column:16/span 10}.col-11,.col-sm-11{grid-column:span 11}.col-sm-11.offset-sm-2{grid-column:2/span 11}.col-sm-11.offset-sm-3{grid-column:3/span 11}.col-sm-11.offset-sm-4{grid-column:4/span 11}.col-sm-11.offset-sm-5{grid-column:5/span 11}.col-sm-11.offset-sm-6{grid-column:6/span 11}.col-sm-11.offset-sm-7{grid-column:7/span 11}.col-sm-11.offset-sm-8{grid-column:8/span 11}.col-sm-11.offset-sm-9{grid-column:9/span 11}.col-sm-11.offset-sm-10{grid-column:10/span 11}.col-sm-11.offset-sm-11{grid-column:11/span 11}.col-sm-11.offset-sm-12{grid-column:12/span 11}.col-sm-11.offset-sm-13{grid-column:13/span 11}.col-sm-11.offset-sm-14{grid-column:14/span 11}.col-sm-11.offset-sm-15{grid-column:15/span 11}.col-sm-11.offset-sm-16{grid-column:16/span 11}.col-12,.col-sm-12{grid-column:span 12}.col-sm-12.offset-sm-2{grid-column:2/span 12}.col-sm-12.offset-sm-3{grid-column:3/span 12}.col-sm-12.offset-sm-4{grid-column:4/span 12}.col-sm-12.offset-sm-5{grid-column:5/span 12}.col-sm-12.offset-sm-6{grid-column:6/span 12}.col-sm-12.offset-sm-7{grid-column:7/span 12}.col-sm-12.offset-sm-8{grid-column:8/span 12}.col-sm-12.offset-sm-9{grid-column:9/span 12}.col-sm-12.offset-sm-10{grid-column:10/span 12}.col-sm-12.offset-sm-11{grid-column:11/span 12}.col-sm-12.offset-sm-12{grid-column:12/span 12}.col-sm-12.offset-sm-13{grid-column:13/span 12}.col-sm-12.offset-sm-14{grid-column:14/span 12}.col-sm-12.offset-sm-15{grid-column:15/span 12}.col-sm-12.offset-sm-16{grid-column:16/span 12}.col-13,.col-sm-13{grid-column:span 13}.col-sm-13.offset-sm-2{grid-column:2/span 13}.col-sm-13.offset-sm-3{grid-column:3/span 13}.col-sm-13.offset-sm-4{grid-column:4/span 13}.col-sm-13.offset-sm-5{grid-column:5/span 13}.col-sm-13.offset-sm-6{grid-column:6/span 13}.col-sm-13.offset-sm-7{grid-column:7/span 13}.col-sm-13.offset-sm-8{grid-column:8/span 13}.col-sm-13.offset-sm-9{grid-column:9/span 13}.col-sm-13.offset-sm-10{grid-column:10/span 13}.col-sm-13.offset-sm-11{grid-column:11/span 13}.col-sm-13.offset-sm-12{grid-column:12/span 13}.col-sm-13.offset-sm-13{grid-column:13/span 13}.col-sm-13.offset-sm-14{grid-column:14/span 13}.col-sm-13.offset-sm-15{grid-column:15/span 13}.col-sm-13.offset-sm-16{grid-column:16/span 13}.col-14,.col-sm-14{grid-column:span 14}.col-sm-14.offset-sm-2{grid-column:2/span 14}.col-sm-14.offset-sm-3{grid-column:3/span 14}.col-sm-14.offset-sm-4{grid-column:4/span 14}.col-sm-14.offset-sm-5{grid-column:5/span 14}.col-sm-14.offset-sm-6{grid-column:6/span 14}.col-sm-14.offset-sm-7{grid-column:7/span 14}.col-sm-14.offset-sm-8{grid-column:8/span 14}.col-sm-14.offset-sm-9{grid-column:9/span 14}.col-sm-14.offset-sm-10{grid-column:10/span 14}.col-sm-14.offset-sm-11{grid-column:11/span 14}.col-sm-14.offset-sm-12{grid-column:12/span 14}.col-sm-14.offset-sm-13{grid-column:13/span 14}.col-sm-14.offset-sm-14{grid-column:14/span 14}.col-sm-14.offset-sm-15{grid-column:15/span 14}.col-sm-14.offset-sm-16{grid-column:16/span 14}.col-15,.col-sm-15{grid-column:span 15}.col-sm-15.offset-sm-2{grid-column:2/span 15}.col-sm-15.offset-sm-3{grid-column:3/span 15}.col-sm-15.offset-sm-4{grid-column:4/span 15}.col-sm-15.offset-sm-5{grid-column:5/span 15}.col-sm-15.offset-sm-6{grid-column:6/span 15}.col-sm-15.offset-sm-7{grid-column:7/span 15}.col-sm-15.offset-sm-8{grid-column:8/span 15}.col-sm-15.offset-sm-9{grid-column:9/span 15}.col-sm-15.offset-sm-10{grid-column:10/span 15}.col-sm-15.offset-sm-11{grid-column:11/span 15}.col-sm-15.offset-sm-12{grid-column:12/span 15}.col-sm-15.offset-sm-13{grid-column:13/span 15}.col-sm-15.offset-sm-14{grid-column:14/span 15}.col-sm-15.offset-sm-15{grid-column:15/span 15}.col-sm-15.offset-sm-16{grid-column:16/span 15}.col-16,.col-sm-16{grid-column:span 16}.col-sm-16.offset-sm-2{grid-column:2/span 16}.col-sm-16.offset-sm-3{grid-column:3/span 16}.col-sm-16.offset-sm-4{grid-column:4/span 16}.col-sm-16.offset-sm-5{grid-column:5/span 16}.col-sm-16.offset-sm-6{grid-column:6/span 16}.col-sm-16.offset-sm-7{grid-column:7/span 16}.col-sm-16.offset-sm-8{grid-column:8/span 16}.col-sm-16.offset-sm-9{grid-column:9/span 16}.col-sm-16.offset-sm-10{grid-column:10/span 16}.col-sm-16.offset-sm-11{grid-column:11/span 16}.col-sm-16.offset-sm-12{grid-column:12/span 16}.col-sm-16.offset-sm-13{grid-column:13/span 16}.col-sm-16.offset-sm-14{grid-column:14/span 16}.col-sm-16.offset-sm-15{grid-column:15/span 16}.col-sm-16.offset-sm-16{grid-column:16/span 16}}@media only screen and (min-width:768px){.col-1,.col-md-1{grid-column:span 1}.col-md-1.offset-md-2{grid-column:2/span 1}.col-md-1.offset-md-3{grid-column:3/span 1}.col-md-1.offset-md-4{grid-column:4/span 1}.col-md-1.offset-md-5{grid-column:5/span 1}.col-md-1.offset-md-6{grid-column:6/span 1}.col-md-1.offset-md-7{grid-column:7/span 1}.col-md-1.offset-md-8{grid-column:8/span 1}.col-md-1.offset-md-9{grid-column:9/span 1}.col-md-1.offset-md-10{grid-column:10/span 1}.col-md-1.offset-md-11{grid-column:11/span 1}.col-md-1.offset-md-12{grid-column:12/span 1}.col-md-1.offset-md-13{grid-column:13/span 1}.col-md-1.offset-md-14{grid-column:14/span 1}.col-md-1.offset-md-15{grid-column:15/span 1}.col-md-1.offset-md-16{grid-column:16/span 1}.col-2,.col-md-2{grid-column:span 2}.col-md-2.offset-md-2{grid-column:2/span 2}.col-md-2.offset-md-3{grid-column:3/span 2}.col-md-2.offset-md-4{grid-column:4/span 2}.col-md-2.offset-md-5{grid-column:5/span 2}.col-md-2.offset-md-6{grid-column:6/span 2}.col-md-2.offset-md-7{grid-column:7/span 2}.col-md-2.offset-md-8{grid-column:8/span 2}.col-md-2.offset-md-9{grid-column:9/span 2}.col-md-2.offset-md-10{grid-column:10/span 2}.col-md-2.offset-md-11{grid-column:11/span 2}.col-md-2.offset-md-12{grid-column:12/span 2}.col-md-2.offset-md-13{grid-column:13/span 2}.col-md-2.offset-md-14{grid-column:14/span 2}.col-md-2.offset-md-15{grid-column:15/span 2}.col-md-2.offset-md-16{grid-column:16/span 2}.col-3,.col-md-3{grid-column:span 3}.col-md-3.offset-md-2{grid-column:2/span 3}.col-md-3.offset-md-3{grid-column:3/span 3}.col-md-3.offset-md-4{grid-column:4/span 3}.col-md-3.offset-md-5{grid-column:5/span 3}.col-md-3.offset-md-6{grid-column:6/span 3}.col-md-3.offset-md-7{grid-column:7/span 3}.col-md-3.offset-md-8{grid-column:8/span 3}.col-md-3.offset-md-9{grid-column:9/span 3}.col-md-3.offset-md-10{grid-column:10/span 3}.col-md-3.offset-md-11{grid-column:11/span 3}.col-md-3.offset-md-12{grid-column:12/span 3}.col-md-3.offset-md-13{grid-column:13/span 3}.col-md-3.offset-md-14{grid-column:14/span 3}.col-md-3.offset-md-15{grid-column:15/span 3}.col-md-3.offset-md-16{grid-column:16/span 3}.col-4,.col-md-4{grid-column:span 4}.col-md-4.offset-md-2{grid-column:2/span 4}.col-md-4.offset-md-3{grid-column:3/span 4}.col-md-4.offset-md-4{grid-column:4/span 4}.col-md-4.offset-md-5{grid-column:5/span 4}.col-md-4.offset-md-6{grid-column:6/span 4}.col-md-4.offset-md-7{grid-column:7/span 4}.col-md-4.offset-md-8{grid-column:8/span 4}.col-md-4.offset-md-9{grid-column:9/span 4}.col-md-4.offset-md-10{grid-column:10/span 4}.col-md-4.offset-md-11{grid-column:11/span 4}.col-md-4.offset-md-12{grid-column:12/span 4}.col-md-4.offset-md-13{grid-column:13/span 4}.col-md-4.offset-md-14{grid-column:14/span 4}.col-md-4.offset-md-15{grid-column:15/span 4}.col-md-4.offset-md-16{grid-column:16/span 4}.col-5,.col-md-5{grid-column:span 5}.col-md-5.offset-md-2{grid-column:2/span 5}.col-md-5.offset-md-3{grid-column:3/span 5}.col-md-5.offset-md-4{grid-column:4/span 5}.col-md-5.offset-md-5{grid-column:5/span 5}.col-md-5.offset-md-6{grid-column:6/span 5}.col-md-5.offset-md-7{grid-column:7/span 5}.col-md-5.offset-md-8{grid-column:8/span 5}.col-md-5.offset-md-9{grid-column:9/span 5}.col-md-5.offset-md-10{grid-column:10/span 5}.col-md-5.offset-md-11{grid-column:11/span 5}.col-md-5.offset-md-12{grid-column:12/span 5}.col-md-5.offset-md-13{grid-column:13/span 5}.col-md-5.offset-md-14{grid-column:14/span 5}.col-md-5.offset-md-15{grid-column:15/span 5}.col-md-5.offset-md-16{grid-column:16/span 5}.col-6,.col-md-6{grid-column:span 6}.col-md-6.offset-md-2{grid-column:2/span 6}.col-md-6.offset-md-3{grid-column:3/span 6}.col-md-6.offset-md-4{grid-column:4/span 6}.col-md-6.offset-md-5{grid-column:5/span 6}.col-md-6.offset-md-6{grid-column:6/span 6}.col-md-6.offset-md-7{grid-column:7/span 6}.col-md-6.offset-md-8{grid-column:8/span 6}.col-md-6.offset-md-9{grid-column:9/span 6}.col-md-6.offset-md-10{grid-column:10/span 6}.col-md-6.offset-md-11{grid-column:11/span 6}.col-md-6.offset-md-12{grid-column:12/span 6}.col-md-6.offset-md-13{grid-column:13/span 6}.col-md-6.offset-md-14{grid-column:14/span 6}.col-md-6.offset-md-15{grid-column:15/span 6}.col-md-6.offset-md-16{grid-column:16/span 6}.col-7,.col-md-7{grid-column:span 7}.col-md-7.offset-md-2{grid-column:2/span 7}.col-md-7.offset-md-3{grid-column:3/span 7}.col-md-7.offset-md-4{grid-column:4/span 7}.col-md-7.offset-md-5{grid-column:5/span 7}.col-md-7.offset-md-6{grid-column:6/span 7}.col-md-7.offset-md-7{grid-column:7/span 7}.col-md-7.offset-md-8{grid-column:8/span 7}.col-md-7.offset-md-9{grid-column:9/span 7}.col-md-7.offset-md-10{grid-column:10/span 7}.col-md-7.offset-md-11{grid-column:11/span 7}.col-md-7.offset-md-12{grid-column:12/span 7}.col-md-7.offset-md-13{grid-column:13/span 7}.col-md-7.offset-md-14{grid-column:14/span 7}.col-md-7.offset-md-15{grid-column:15/span 7}.col-md-7.offset-md-16{grid-column:16/span 7}.col-8,.col-md-8{grid-column:span 8}.col-md-8.offset-md-2{grid-column:2/span 8}.col-md-8.offset-md-3{grid-column:3/span 8}.col-md-8.offset-md-4{grid-column:4/span 8}.col-md-8.offset-md-5{grid-column:5/span 8}.col-md-8.offset-md-6{grid-column:6/span 8}.col-md-8.offset-md-7{grid-column:7/span 8}.col-md-8.offset-md-8{grid-column:8/span 8}.col-md-8.offset-md-9{grid-column:9/span 8}.col-md-8.offset-md-10{grid-column:10/span 8}.col-md-8.offset-md-11{grid-column:11/span 8}.col-md-8.offset-md-12{grid-column:12/span 8}.col-md-8.offset-md-13{grid-column:13/span 8}.col-md-8.offset-md-14{grid-column:14/span 8}.col-md-8.offset-md-15{grid-column:15/span 8}.col-md-8.offset-md-16{grid-column:16/span 8}.col-9,.col-md-9{grid-column:span 9}.col-md-9.offset-md-2{grid-column:2/span 9}.col-md-9.offset-md-3{grid-column:3/span 9}.col-md-9.offset-md-4{grid-column:4/span 9}.col-md-9.offset-md-5{grid-column:5/span 9}.col-md-9.offset-md-6{grid-column:6/span 9}.col-md-9.offset-md-7{grid-column:7/span 9}.col-md-9.offset-md-8{grid-column:8/span 9}.col-md-9.offset-md-9{grid-column:9/span 9}.col-md-9.offset-md-10{grid-column:10/span 9}.col-md-9.offset-md-11{grid-column:11/span 9}.col-md-9.offset-md-12{grid-column:12/span 9}.col-md-9.offset-md-13{grid-column:13/span 9}.col-md-9.offset-md-14{grid-column:14/span 9}.col-md-9.offset-md-15{grid-column:15/span 9}.col-md-9.offset-md-16{grid-column:16/span 9}.col-10,.col-md-10{grid-column:span 10}.col-md-10.offset-md-2{grid-column:2/span 10}.col-md-10.offset-md-3{grid-column:3/span 10}.col-md-10.offset-md-4{grid-column:4/span 10}.col-md-10.offset-md-5{grid-column:5/span 10}.col-md-10.offset-md-6{grid-column:6/span 10}.col-md-10.offset-md-7{grid-column:7/span 10}.col-md-10.offset-md-8{grid-column:8/span 10}.col-md-10.offset-md-9{grid-column:9/span 10}.col-md-10.offset-md-10{grid-column:10/span 10}.col-md-10.offset-md-11{grid-column:11/span 10}.col-md-10.offset-md-12{grid-column:12/span 10}.col-md-10.offset-md-13{grid-column:13/span 10}.col-md-10.offset-md-14{grid-column:14/span 10}.col-md-10.offset-md-15{grid-column:15/span 10}.col-md-10.offset-md-16{grid-column:16/span 10}.col-11,.col-md-11{grid-column:span 11}.col-md-11.offset-md-2{grid-column:2/span 11}.col-md-11.offset-md-3{grid-column:3/span 11}.col-md-11.offset-md-4{grid-column:4/span 11}.col-md-11.offset-md-5{grid-column:5/span 11}.col-md-11.offset-md-6{grid-column:6/span 11}.col-md-11.offset-md-7{grid-column:7/span 11}.col-md-11.offset-md-8{grid-column:8/span 11}.col-md-11.offset-md-9{grid-column:9/span 11}.col-md-11.offset-md-10{grid-column:10/span 11}.col-md-11.offset-md-11{grid-column:11/span 11}.col-md-11.offset-md-12{grid-column:12/span 11}.col-md-11.offset-md-13{grid-column:13/span 11}.col-md-11.offset-md-14{grid-column:14/span 11}.col-md-11.offset-md-15{grid-column:15/span 11}.col-md-11.offset-md-16{grid-column:16/span 11}.col-12,.col-md-12{grid-column:span 12}.col-md-12.offset-md-2{grid-column:2/span 12}.col-md-12.offset-md-3{grid-column:3/span 12}.col-md-12.offset-md-4{grid-column:4/span 12}.col-md-12.offset-md-5{grid-column:5/span 12}.col-md-12.offset-md-6{grid-column:6/span 12}.col-md-12.offset-md-7{grid-column:7/span 12}.col-md-12.offset-md-8{grid-column:8/span 12}.col-md-12.offset-md-9{grid-column:9/span 12}.col-md-12.offset-md-10{grid-column:10/span 12}.col-md-12.offset-md-11{grid-column:11/span 12}.col-md-12.offset-md-12{grid-column:12/span 12}.col-md-12.offset-md-13{grid-column:13/span 12}.col-md-12.offset-md-14{grid-column:14/span 12}.col-md-12.offset-md-15{grid-column:15/span 12}.col-md-12.offset-md-16{grid-column:16/span 12}.col-13,.col-md-13{grid-column:span 13}.col-md-13.offset-md-2{grid-column:2/span 13}.col-md-13.offset-md-3{grid-column:3/span 13}.col-md-13.offset-md-4{grid-column:4/span 13}.col-md-13.offset-md-5{grid-column:5/span 13}.col-md-13.offset-md-6{grid-column:6/span 13}.col-md-13.offset-md-7{grid-column:7/span 13}.col-md-13.offset-md-8{grid-column:8/span 13}.col-md-13.offset-md-9{grid-column:9/span 13}.col-md-13.offset-md-10{grid-column:10/span 13}.col-md-13.offset-md-11{grid-column:11/span 13}.col-md-13.offset-md-12{grid-column:12/span 13}.col-md-13.offset-md-13{grid-column:13/span 13}.col-md-13.offset-md-14{grid-column:14/span 13}.col-md-13.offset-md-15{grid-column:15/span 13}.col-md-13.offset-md-16{grid-column:16/span 13}.col-14,.col-md-14{grid-column:span 14}.col-md-14.offset-md-2{grid-column:2/span 14}.col-md-14.offset-md-3{grid-column:3/span 14}.col-md-14.offset-md-4{grid-column:4/span 14}.col-md-14.offset-md-5{grid-column:5/span 14}.col-md-14.offset-md-6{grid-column:6/span 14}.col-md-14.offset-md-7{grid-column:7/span 14}.col-md-14.offset-md-8{grid-column:8/span 14}.col-md-14.offset-md-9{grid-column:9/span 14}.col-md-14.offset-md-10{grid-column:10/span 14}.col-md-14.offset-md-11{grid-column:11/span 14}.col-md-14.offset-md-12{grid-column:12/span 14}.col-md-14.offset-md-13{grid-column:13/span 14}.col-md-14.offset-md-14{grid-column:14/span 14}.col-md-14.offset-md-15{grid-column:15/span 14}.col-md-14.offset-md-16{grid-column:16/span 14}.col-15,.col-md-15{grid-column:span 15}.col-md-15.offset-md-2{grid-column:2/span 15}.col-md-15.offset-md-3{grid-column:3/span 15}.col-md-15.offset-md-4{grid-column:4/span 15}.col-md-15.offset-md-5{grid-column:5/span 15}.col-md-15.offset-md-6{grid-column:6/span 15}.col-md-15.offset-md-7{grid-column:7/span 15}.col-md-15.offset-md-8{grid-column:8/span 15}.col-md-15.offset-md-9{grid-column:9/span 15}.col-md-15.offset-md-10{grid-column:10/span 15}.col-md-15.offset-md-11{grid-column:11/span 15}.col-md-15.offset-md-12{grid-column:12/span 15}.col-md-15.offset-md-13{grid-column:13/span 15}.col-md-15.offset-md-14{grid-column:14/span 15}.col-md-15.offset-md-15{grid-column:15/span 15}.col-md-15.offset-md-16{grid-column:16/span 15}.col-16,.col-md-16{grid-column:span 16}.col-md-16.offset-md-2{grid-column:2/span 16}.col-md-16.offset-md-3{grid-column:3/span 16}.col-md-16.offset-md-4{grid-column:4/span 16}.col-md-16.offset-md-5{grid-column:5/span 16}.col-md-16.offset-md-6{grid-column:6/span 16}.col-md-16.offset-md-7{grid-column:7/span 16}.col-md-16.offset-md-8{grid-column:8/span 16}.col-md-16.offset-md-9{grid-column:9/span 16}.col-md-16.offset-md-10{grid-column:10/span 16}.col-md-16.offset-md-11{grid-column:11/span 16}.col-md-16.offset-md-12{grid-column:12/span 16}.col-md-16.offset-md-13{grid-column:13/span 16}.col-md-16.offset-md-14{grid-column:14/span 16}.col-md-16.offset-md-15{grid-column:15/span 16}.col-md-16.offset-md-16{grid-column:16/span 16}}@media only screen and (min-width:992px){.col-1,.col-lg-1{grid-column:span 1}.col-lg-1.offset-lg-2{grid-column:2/span 1}.col-lg-1.offset-lg-3{grid-column:3/span 1}.col-lg-1.offset-lg-4{grid-column:4/span 1}.col-lg-1.offset-lg-5{grid-column:5/span 1}.col-lg-1.offset-lg-6{grid-column:6/span 1}.col-lg-1.offset-lg-7{grid-column:7/span 1}.col-lg-1.offset-lg-8{grid-column:8/span 1}.col-lg-1.offset-lg-9{grid-column:9/span 1}.col-lg-1.offset-lg-10{grid-column:10/span 1}.col-lg-1.offset-lg-11{grid-column:11/span 1}.col-lg-1.offset-lg-12{grid-column:12/span 1}.col-lg-1.offset-lg-13{grid-column:13/span 1}.col-lg-1.offset-lg-14{grid-column:14/span 1}.col-lg-1.offset-lg-15{grid-column:15/span 1}.col-lg-1.offset-lg-16{grid-column:16/span 1}.col-2,.col-lg-2{grid-column:span 2}.col-lg-2.offset-lg-2{grid-column:2/span 2}.col-lg-2.offset-lg-3{grid-column:3/span 2}.col-lg-2.offset-lg-4{grid-column:4/span 2}.col-lg-2.offset-lg-5{grid-column:5/span 2}.col-lg-2.offset-lg-6{grid-column:6/span 2}.col-lg-2.offset-lg-7{grid-column:7/span 2}.col-lg-2.offset-lg-8{grid-column:8/span 2}.col-lg-2.offset-lg-9{grid-column:9/span 2}.col-lg-2.offset-lg-10{grid-column:10/span 2}.col-lg-2.offset-lg-11{grid-column:11/span 2}.col-lg-2.offset-lg-12{grid-column:12/span 2}.col-lg-2.offset-lg-13{grid-column:13/span 2}.col-lg-2.offset-lg-14{grid-column:14/span 2}.col-lg-2.offset-lg-15{grid-column:15/span 2}.col-lg-2.offset-lg-16{grid-column:16/span 2}.col-3,.col-lg-3{grid-column:span 3}.col-lg-3.offset-lg-2{grid-column:2/span 3}.col-lg-3.offset-lg-3{grid-column:3/span 3}.col-lg-3.offset-lg-4{grid-column:4/span 3}.col-lg-3.offset-lg-5{grid-column:5/span 3}.col-lg-3.offset-lg-6{grid-column:6/span 3}.col-lg-3.offset-lg-7{grid-column:7/span 3}.col-lg-3.offset-lg-8{grid-column:8/span 3}.col-lg-3.offset-lg-9{grid-column:9/span 3}.col-lg-3.offset-lg-10{grid-column:10/span 3}.col-lg-3.offset-lg-11{grid-column:11/span 3}.col-lg-3.offset-lg-12{grid-column:12/span 3}.col-lg-3.offset-lg-13{grid-column:13/span 3}.col-lg-3.offset-lg-14{grid-column:14/span 3}.col-lg-3.offset-lg-15{grid-column:15/span 3}.col-lg-3.offset-lg-16{grid-column:16/span 3}.col-4,.col-lg-4{grid-column:span 4}.col-lg-4.offset-lg-2{grid-column:2/span 4}.col-lg-4.offset-lg-3{grid-column:3/span 4}.col-lg-4.offset-lg-4{grid-column:4/span 4}.col-lg-4.offset-lg-5{grid-column:5/span 4}.col-lg-4.offset-lg-6{grid-column:6/span 4}.col-lg-4.offset-lg-7{grid-column:7/span 4}.col-lg-4.offset-lg-8{grid-column:8/span 4}.col-lg-4.offset-lg-9{grid-column:9/span 4}.col-lg-4.offset-lg-10{grid-column:10/span 4}.col-lg-4.offset-lg-11{grid-column:11/span 4}.col-lg-4.offset-lg-12{grid-column:12/span 4}.col-lg-4.offset-lg-13{grid-column:13/span 4}.col-lg-4.offset-lg-14{grid-column:14/span 4}.col-lg-4.offset-lg-15{grid-column:15/span 4}.col-lg-4.offset-lg-16{grid-column:16/span 4}.col-5,.col-lg-5{grid-column:span 5}.col-lg-5.offset-lg-2{grid-column:2/span 5}.col-lg-5.offset-lg-3{grid-column:3/span 5}.col-lg-5.offset-lg-4{grid-column:4/span 5}.col-lg-5.offset-lg-5{grid-column:5/span 5}.col-lg-5.offset-lg-6{grid-column:6/span 5}.col-lg-5.offset-lg-7{grid-column:7/span 5}.col-lg-5.offset-lg-8{grid-column:8/span 5}.col-lg-5.offset-lg-9{grid-column:9/span 5}.col-lg-5.offset-lg-10{grid-column:10/span 5}.col-lg-5.offset-lg-11{grid-column:11/span 5}.col-lg-5.offset-lg-12{grid-column:12/span 5}.col-lg-5.offset-lg-13{grid-column:13/span 5}.col-lg-5.offset-lg-14{grid-column:14/span 5}.col-lg-5.offset-lg-15{grid-column:15/span 5}.col-lg-5.offset-lg-16{grid-column:16/span 5}.col-6,.col-lg-6{grid-column:span 6}.col-lg-6.offset-lg-2{grid-column:2/span 6}.col-lg-6.offset-lg-3{grid-column:3/span 6}.col-lg-6.offset-lg-4{grid-column:4/span 6}.col-lg-6.offset-lg-5{grid-column:5/span 6}.col-lg-6.offset-lg-6{grid-column:6/span 6}.col-lg-6.offset-lg-7{grid-column:7/span 6}.col-lg-6.offset-lg-8{grid-column:8/span 6}.col-lg-6.offset-lg-9{grid-column:9/span 6}.col-lg-6.offset-lg-10{grid-column:10/span 6}.col-lg-6.offset-lg-11{grid-column:11/span 6}.col-lg-6.offset-lg-12{grid-column:12/span 6}.col-lg-6.offset-lg-13{grid-column:13/span 6}.col-lg-6.offset-lg-14{grid-column:14/span 6}.col-lg-6.offset-lg-15{grid-column:15/span 6}.col-lg-6.offset-lg-16{grid-column:16/span 6}.col-7,.col-lg-7{grid-column:span 7}.col-lg-7.offset-lg-2{grid-column:2/span 7}.col-lg-7.offset-lg-3{grid-column:3/span 7}.col-lg-7.offset-lg-4{grid-column:4/span 7}.col-lg-7.offset-lg-5{grid-column:5/span 7}.col-lg-7.offset-lg-6{grid-column:6/span 7}.col-lg-7.offset-lg-7{grid-column:7/span 7}.col-lg-7.offset-lg-8{grid-column:8/span 7}.col-lg-7.offset-lg-9{grid-column:9/span 7}.col-lg-7.offset-lg-10{grid-column:10/span 7}.col-lg-7.offset-lg-11{grid-column:11/span 7}.col-lg-7.offset-lg-12{grid-column:12/span 7}.col-lg-7.offset-lg-13{grid-column:13/span 7}.col-lg-7.offset-lg-14{grid-column:14/span 7}.col-lg-7.offset-lg-15{grid-column:15/span 7}.col-lg-7.offset-lg-16{grid-column:16/span 7}.col-8,.col-lg-8{grid-column:span 8}.col-lg-8.offset-lg-2{grid-column:2/span 8}.col-lg-8.offset-lg-3{grid-column:3/span 8}.col-lg-8.offset-lg-4{grid-column:4/span 8}.col-lg-8.offset-lg-5{grid-column:5/span 8}.col-lg-8.offset-lg-6{grid-column:6/span 8}.col-lg-8.offset-lg-7{grid-column:7/span 8}.col-lg-8.offset-lg-8{grid-column:8/span 8}.col-lg-8.offset-lg-9{grid-column:9/span 8}.col-lg-8.offset-lg-10{grid-column:10/span 8}.col-lg-8.offset-lg-11{grid-column:11/span 8}.col-lg-8.offset-lg-12{grid-column:12/span 8}.col-lg-8.offset-lg-13{grid-column:13/span 8}.col-lg-8.offset-lg-14{grid-column:14/span 8}.col-lg-8.offset-lg-15{grid-column:15/span 8}.col-lg-8.offset-lg-16{grid-column:16/span 8}.col-9,.col-lg-9{grid-column:span 9}.col-lg-9.offset-lg-2{grid-column:2/span 9}.col-lg-9.offset-lg-3{grid-column:3/span 9}.col-lg-9.offset-lg-4{grid-column:4/span 9}.col-lg-9.offset-lg-5{grid-column:5/span 9}.col-lg-9.offset-lg-6{grid-column:6/span 9}.col-lg-9.offset-lg-7{grid-column:7/span 9}.col-lg-9.offset-lg-8{grid-column:8/span 9}.col-lg-9.offset-lg-9{grid-column:9/span 9}.col-lg-9.offset-lg-10{grid-column:10/span 9}.col-lg-9.offset-lg-11{grid-column:11/span 9}.col-lg-9.offset-lg-12{grid-column:12/span 9}.col-lg-9.offset-lg-13{grid-column:13/span 9}.col-lg-9.offset-lg-14{grid-column:14/span 9}.col-lg-9.offset-lg-15{grid-column:15/span 9}.col-lg-9.offset-lg-16{grid-column:16/span 9}.col-10,.col-lg-10{grid-column:span 10}.col-lg-10.offset-lg-2{grid-column:2/span 10}.col-lg-10.offset-lg-3{grid-column:3/span 10}.col-lg-10.offset-lg-4{grid-column:4/span 10}.col-lg-10.offset-lg-5{grid-column:5/span 10}.col-lg-10.offset-lg-6{grid-column:6/span 10}.col-lg-10.offset-lg-7{grid-column:7/span 10}.col-lg-10.offset-lg-8{grid-column:8/span 10}.col-lg-10.offset-lg-9{grid-column:9/span 10}.col-lg-10.offset-lg-10{grid-column:10/span 10}.col-lg-10.offset-lg-11{grid-column:11/span 10}.col-lg-10.offset-lg-12{grid-column:12/span 10}.col-lg-10.offset-lg-13{grid-column:13/span 10}.col-lg-10.offset-lg-14{grid-column:14/span 10}.col-lg-10.offset-lg-15{grid-column:15/span 10}.col-lg-10.offset-lg-16{grid-column:16/span 10}.col-11,.col-lg-11{grid-column:span 11}.col-lg-11.offset-lg-2{grid-column:2/span 11}.col-lg-11.offset-lg-3{grid-column:3/span 11}.col-lg-11.offset-lg-4{grid-column:4/span 11}.col-lg-11.offset-lg-5{grid-column:5/span 11}.col-lg-11.offset-lg-6{grid-column:6/span 11}.col-lg-11.offset-lg-7{grid-column:7/span 11}.col-lg-11.offset-lg-8{grid-column:8/span 11}.col-lg-11.offset-lg-9{grid-column:9/span 11}.col-lg-11.offset-lg-10{grid-column:10/span 11}.col-lg-11.offset-lg-11{grid-column:11/span 11}.col-lg-11.offset-lg-12{grid-column:12/span 11}.col-lg-11.offset-lg-13{grid-column:13/span 11}.col-lg-11.offset-lg-14{grid-column:14/span 11}.col-lg-11.offset-lg-15{grid-column:15/span 11}.col-lg-11.offset-lg-16{grid-column:16/span 11}.col-12,.col-lg-12{grid-column:span 12}.col-lg-12.offset-lg-2{grid-column:2/span 12}.col-lg-12.offset-lg-3{grid-column:3/span 12}.col-lg-12.offset-lg-4{grid-column:4/span 12}.col-lg-12.offset-lg-5{grid-column:5/span 12}.col-lg-12.offset-lg-6{grid-column:6/span 12}.col-lg-12.offset-lg-7{grid-column:7/span 12}.col-lg-12.offset-lg-8{grid-column:8/span 12}.col-lg-12.offset-lg-9{grid-column:9/span 12}.col-lg-12.offset-lg-10{grid-column:10/span 12}.col-lg-12.offset-lg-11{grid-column:11/span 12}.col-lg-12.offset-lg-12{grid-column:12/span 12}.col-lg-12.offset-lg-13{grid-column:13/span 12}.col-lg-12.offset-lg-14{grid-column:14/span 12}.col-lg-12.offset-lg-15{grid-column:15/span 12}.col-lg-12.offset-lg-16{grid-column:16/span 12}.col-13,.col-lg-13{grid-column:span 13}.col-lg-13.offset-lg-2{grid-column:2/span 13}.col-lg-13.offset-lg-3{grid-column:3/span 13}.col-lg-13.offset-lg-4{grid-column:4/span 13}.col-lg-13.offset-lg-5{grid-column:5/span 13}.col-lg-13.offset-lg-6{grid-column:6/span 13}.col-lg-13.offset-lg-7{grid-column:7/span 13}.col-lg-13.offset-lg-8{grid-column:8/span 13}.col-lg-13.offset-lg-9{grid-column:9/span 13}.col-lg-13.offset-lg-10{grid-column:10/span 13}.col-lg-13.offset-lg-11{grid-column:11/span 13}.col-lg-13.offset-lg-12{grid-column:12/span 13}.col-lg-13.offset-lg-13{grid-column:13/span 13}.col-lg-13.offset-lg-14{grid-column:14/span 13}.col-lg-13.offset-lg-15{grid-column:15/span 13}.col-lg-13.offset-lg-16{grid-column:16/span 13}.col-14,.col-lg-14{grid-column:span 14}.col-lg-14.offset-lg-2{grid-column:2/span 14}.col-lg-14.offset-lg-3{grid-column:3/span 14}.col-lg-14.offset-lg-4{grid-column:4/span 14}.col-lg-14.offset-lg-5{grid-column:5/span 14}.col-lg-14.offset-lg-6{grid-column:6/span 14}.col-lg-14.offset-lg-7{grid-column:7/span 14}.col-lg-14.offset-lg-8{grid-column:8/span 14}.col-lg-14.offset-lg-9{grid-column:9/span 14}.col-lg-14.offset-lg-10{grid-column:10/span 14}.col-lg-14.offset-lg-11{grid-column:11/span 14}.col-lg-14.offset-lg-12{grid-column:12/span 14}.col-lg-14.offset-lg-13{grid-column:13/span 14}.col-lg-14.offset-lg-14{grid-column:14/span 14}.col-lg-14.offset-lg-15{grid-column:15/span 14}.col-lg-14.offset-lg-16{grid-column:16/span 14}.col-15,.col-lg-15{grid-column:span 15}.col-lg-15.offset-lg-2{grid-column:2/span 15}.col-lg-15.offset-lg-3{grid-column:3/span 15}.col-lg-15.offset-lg-4{grid-column:4/span 15}.col-lg-15.offset-lg-5{grid-column:5/span 15}.col-lg-15.offset-lg-6{grid-column:6/span 15}.col-lg-15.offset-lg-7{grid-column:7/span 15}.col-lg-15.offset-lg-8{grid-column:8/span 15}.col-lg-15.offset-lg-9{grid-column:9/span 15}.col-lg-15.offset-lg-10{grid-column:10/span 15}.col-lg-15.offset-lg-11{grid-column:11/span 15}.col-lg-15.offset-lg-12{grid-column:12/span 15}.col-lg-15.offset-lg-13{grid-column:13/span 15}.col-lg-15.offset-lg-14{grid-column:14/span 15}.col-lg-15.offset-lg-15{grid-column:15/span 15}.col-lg-15.offset-lg-16{grid-column:16/span 15}.col-16,.col-lg-16{grid-column:span 16}.col-lg-16.offset-lg-2{grid-column:2/span 16}.col-lg-16.offset-lg-3{grid-column:3/span 16}.col-lg-16.offset-lg-4{grid-column:4/span 16}.col-lg-16.offset-lg-5{grid-column:5/span 16}.col-lg-16.offset-lg-6{grid-column:6/span 16}.col-lg-16.offset-lg-7{grid-column:7/span 16}.col-lg-16.offset-lg-8{grid-column:8/span 16}.col-lg-16.offset-lg-9{grid-column:9/span 16}.col-lg-16.offset-lg-10{grid-column:10/span 16}.col-lg-16.offset-lg-11{grid-column:11/span 16}.col-lg-16.offset-lg-12{grid-column:12/span 16}.col-lg-16.offset-lg-13{grid-column:13/span 16}.col-lg-16.offset-lg-14{grid-column:14/span 16}.col-lg-16.offset-lg-15{grid-column:15/span 16}.col-lg-16.offset-lg-16{grid-column:16/span 16}}@media only screen and (min-width:1260px){.col-1,.col-xl-1{grid-column:span 1}.col-xl-1.offset-xl-2{grid-column:2/span 1}.col-xl-1.offset-xl-3{grid-column:3/span 1}.col-xl-1.offset-xl-4{grid-column:4/span 1}.col-xl-1.offset-xl-5{grid-column:5/span 1}.col-xl-1.offset-xl-6{grid-column:6/span 1}.col-xl-1.offset-xl-7{grid-column:7/span 1}.col-xl-1.offset-xl-8{grid-column:8/span 1}.col-xl-1.offset-xl-9{grid-column:9/span 1}.col-xl-1.offset-xl-10{grid-column:10/span 1}.col-xl-1.offset-xl-11{grid-column:11/span 1}.col-xl-1.offset-xl-12{grid-column:12/span 1}.col-xl-1.offset-xl-13{grid-column:13/span 1}.col-xl-1.offset-xl-14{grid-column:14/span 1}.col-xl-1.offset-xl-15{grid-column:15/span 1}.col-xl-1.offset-xl-16{grid-column:16/span 1}.col-2,.col-xl-2{grid-column:span 2}.col-xl-2.offset-xl-2{grid-column:2/span 2}.col-xl-2.offset-xl-3{grid-column:3/span 2}.col-xl-2.offset-xl-4{grid-column:4/span 2}.col-xl-2.offset-xl-5{grid-column:5/span 2}.col-xl-2.offset-xl-6{grid-column:6/span 2}.col-xl-2.offset-xl-7{grid-column:7/span 2}.col-xl-2.offset-xl-8{grid-column:8/span 2}.col-xl-2.offset-xl-9{grid-column:9/span 2}.col-xl-2.offset-xl-10{grid-column:10/span 2}.col-xl-2.offset-xl-11{grid-column:11/span 2}.col-xl-2.offset-xl-12{grid-column:12/span 2}.col-xl-2.offset-xl-13{grid-column:13/span 2}.col-xl-2.offset-xl-14{grid-column:14/span 2}.col-xl-2.offset-xl-15{grid-column:15/span 2}.col-xl-2.offset-xl-16{grid-column:16/span 2}.col-3,.col-xl-3{grid-column:span 3}.col-xl-3.offset-xl-2{grid-column:2/span 3}.col-xl-3.offset-xl-3{grid-column:3/span 3}.col-xl-3.offset-xl-4{grid-column:4/span 3}.col-xl-3.offset-xl-5{grid-column:5/span 3}.col-xl-3.offset-xl-6{grid-column:6/span 3}.col-xl-3.offset-xl-7{grid-column:7/span 3}.col-xl-3.offset-xl-8{grid-column:8/span 3}.col-xl-3.offset-xl-9{grid-column:9/span 3}.col-xl-3.offset-xl-10{grid-column:10/span 3}.col-xl-3.offset-xl-11{grid-column:11/span 3}.col-xl-3.offset-xl-12{grid-column:12/span 3}.col-xl-3.offset-xl-13{grid-column:13/span 3}.col-xl-3.offset-xl-14{grid-column:14/span 3}.col-xl-3.offset-xl-15{grid-column:15/span 3}.col-xl-3.offset-xl-16{grid-column:16/span 3}.col-4,.col-xl-4{grid-column:span 4}.col-xl-4.offset-xl-2{grid-column:2/span 4}.col-xl-4.offset-xl-3{grid-column:3/span 4}.col-xl-4.offset-xl-4{grid-column:4/span 4}.col-xl-4.offset-xl-5{grid-column:5/span 4}.col-xl-4.offset-xl-6{grid-column:6/span 4}.col-xl-4.offset-xl-7{grid-column:7/span 4}.col-xl-4.offset-xl-8{grid-column:8/span 4}.col-xl-4.offset-xl-9{grid-column:9/span 4}.col-xl-4.offset-xl-10{grid-column:10/span 4}.col-xl-4.offset-xl-11{grid-column:11/span 4}.col-xl-4.offset-xl-12{grid-column:12/span 4}.col-xl-4.offset-xl-13{grid-column:13/span 4}.col-xl-4.offset-xl-14{grid-column:14/span 4}.col-xl-4.offset-xl-15{grid-column:15/span 4}.col-xl-4.offset-xl-16{grid-column:16/span 4}.col-5,.col-xl-5{grid-column:span 5}.col-xl-5.offset-xl-2{grid-column:2/span 5}.col-xl-5.offset-xl-3{grid-column:3/span 5}.col-xl-5.offset-xl-4{grid-column:4/span 5}.col-xl-5.offset-xl-5{grid-column:5/span 5}.col-xl-5.offset-xl-6{grid-column:6/span 5}.col-xl-5.offset-xl-7{grid-column:7/span 5}.col-xl-5.offset-xl-8{grid-column:8/span 5}.col-xl-5.offset-xl-9{grid-column:9/span 5}.col-xl-5.offset-xl-10{grid-column:10/span 5}.col-xl-5.offset-xl-11{grid-column:11/span 5}.col-xl-5.offset-xl-12{grid-column:12/span 5}.col-xl-5.offset-xl-13{grid-column:13/span 5}.col-xl-5.offset-xl-14{grid-column:14/span 5}.col-xl-5.offset-xl-15{grid-column:15/span 5}.col-xl-5.offset-xl-16{grid-column:16/span 5}.col-6,.col-xl-6{grid-column:span 6}.col-xl-6.offset-xl-2{grid-column:2/span 6}.col-xl-6.offset-xl-3{grid-column:3/span 6}.col-xl-6.offset-xl-4{grid-column:4/span 6}.col-xl-6.offset-xl-5{grid-column:5/span 6}.col-xl-6.offset-xl-6{grid-column:6/span 6}.col-xl-6.offset-xl-7{grid-column:7/span 6}.col-xl-6.offset-xl-8{grid-column:8/span 6}.col-xl-6.offset-xl-9{grid-column:9/span 6}.col-xl-6.offset-xl-10{grid-column:10/span 6}.col-xl-6.offset-xl-11{grid-column:11/span 6}.col-xl-6.offset-xl-12{grid-column:12/span 6}.col-xl-6.offset-xl-13{grid-column:13/span 6}.col-xl-6.offset-xl-14{grid-column:14/span 6}.col-xl-6.offset-xl-15{grid-column:15/span 6}.col-xl-6.offset-xl-16{grid-column:16/span 6}.col-7,.col-xl-7{grid-column:span 7}.col-xl-7.offset-xl-2{grid-column:2/span 7}.col-xl-7.offset-xl-3{grid-column:3/span 7}.col-xl-7.offset-xl-4{grid-column:4/span 7}.col-xl-7.offset-xl-5{grid-column:5/span 7}.col-xl-7.offset-xl-6{grid-column:6/span 7}.col-xl-7.offset-xl-7{grid-column:7/span 7}.col-xl-7.offset-xl-8{grid-column:8/span 7}.col-xl-7.offset-xl-9{grid-column:9/span 7}.col-xl-7.offset-xl-10{grid-column:10/span 7}.col-xl-7.offset-xl-11{grid-column:11/span 7}.col-xl-7.offset-xl-12{grid-column:12/span 7}.col-xl-7.offset-xl-13{grid-column:13/span 7}.col-xl-7.offset-xl-14{grid-column:14/span 7}.col-xl-7.offset-xl-15{grid-column:15/span 7}.col-xl-7.offset-xl-16{grid-column:16/span 7}.col-8,.col-xl-8{grid-column:span 8}.col-xl-8.offset-xl-2{grid-column:2/span 8}.col-xl-8.offset-xl-3{grid-column:3/span 8}.col-xl-8.offset-xl-4{grid-column:4/span 8}.col-xl-8.offset-xl-5{grid-column:5/span 8}.col-xl-8.offset-xl-6{grid-column:6/span 8}.col-xl-8.offset-xl-7{grid-column:7/span 8}.col-xl-8.offset-xl-8{grid-column:8/span 8}.col-xl-8.offset-xl-9{grid-column:9/span 8}.col-xl-8.offset-xl-10{grid-column:10/span 8}.col-xl-8.offset-xl-11{grid-column:11/span 8}.col-xl-8.offset-xl-12{grid-column:12/span 8}.col-xl-8.offset-xl-13{grid-column:13/span 8}.col-xl-8.offset-xl-14{grid-column:14/span 8}.col-xl-8.offset-xl-15{grid-column:15/span 8}.col-xl-8.offset-xl-16{grid-column:16/span 8}.col-9,.col-xl-9{grid-column:span 9}.col-xl-9.offset-xl-2{grid-column:2/span 9}.col-xl-9.offset-xl-3{grid-column:3/span 9}.col-xl-9.offset-xl-4{grid-column:4/span 9}.col-xl-9.offset-xl-5{grid-column:5/span 9}.col-xl-9.offset-xl-6{grid-column:6/span 9}.col-xl-9.offset-xl-7{grid-column:7/span 9}.col-xl-9.offset-xl-8{grid-column:8/span 9}.col-xl-9.offset-xl-9{grid-column:9/span 9}.col-xl-9.offset-xl-10{grid-column:10/span 9}.col-xl-9.offset-xl-11{grid-column:11/span 9}.col-xl-9.offset-xl-12{grid-column:12/span 9}.col-xl-9.offset-xl-13{grid-column:13/span 9}.col-xl-9.offset-xl-14{grid-column:14/span 9}.col-xl-9.offset-xl-15{grid-column:15/span 9}.col-xl-9.offset-xl-16{grid-column:16/span 9}.col-10,.col-xl-10{grid-column:span 10}.col-xl-10.offset-xl-2{grid-column:2/span 10}.col-xl-10.offset-xl-3{grid-column:3/span 10}.col-xl-10.offset-xl-4{grid-column:4/span 10}.col-xl-10.offset-xl-5{grid-column:5/span 10}.col-xl-10.offset-xl-6{grid-column:6/span 10}.col-xl-10.offset-xl-7{grid-column:7/span 10}.col-xl-10.offset-xl-8{grid-column:8/span 10}.col-xl-10.offset-xl-9{grid-column:9/span 10}.col-xl-10.offset-xl-10{grid-column:10/span 10}.col-xl-10.offset-xl-11{grid-column:11/span 10}.col-xl-10.offset-xl-12{grid-column:12/span 10}.col-xl-10.offset-xl-13{grid-column:13/span 10}.col-xl-10.offset-xl-14{grid-column:14/span 10}.col-xl-10.offset-xl-15{grid-column:15/span 10}.col-xl-10.offset-xl-16{grid-column:16/span 10}.col-11,.col-xl-11{grid-column:span 11}.col-xl-11.offset-xl-2{grid-column:2/span 11}.col-xl-11.offset-xl-3{grid-column:3/span 11}.col-xl-11.offset-xl-4{grid-column:4/span 11}.col-xl-11.offset-xl-5{grid-column:5/span 11}.col-xl-11.offset-xl-6{grid-column:6/span 11}.col-xl-11.offset-xl-7{grid-column:7/span 11}.col-xl-11.offset-xl-8{grid-column:8/span 11}.col-xl-11.offset-xl-9{grid-column:9/span 11}.col-xl-11.offset-xl-10{grid-column:10/span 11}.col-xl-11.offset-xl-11{grid-column:11/span 11}.col-xl-11.offset-xl-12{grid-column:12/span 11}.col-xl-11.offset-xl-13{grid-column:13/span 11}.col-xl-11.offset-xl-14{grid-column:14/span 11}.col-xl-11.offset-xl-15{grid-column:15/span 11}.col-xl-11.offset-xl-16{grid-column:16/span 11}.col-12,.col-xl-12{grid-column:span 12}.col-xl-12.offset-xl-2{grid-column:2/span 12}.col-xl-12.offset-xl-3{grid-column:3/span 12}.col-xl-12.offset-xl-4{grid-column:4/span 12}.col-xl-12.offset-xl-5{grid-column:5/span 12}.col-xl-12.offset-xl-6{grid-column:6/span 12}.col-xl-12.offset-xl-7{grid-column:7/span 12}.col-xl-12.offset-xl-8{grid-column:8/span 12}.col-xl-12.offset-xl-9{grid-column:9/span 12}.col-xl-12.offset-xl-10{grid-column:10/span 12}.col-xl-12.offset-xl-11{grid-column:11/span 12}.col-xl-12.offset-xl-12{grid-column:12/span 12}.col-xl-12.offset-xl-13{grid-column:13/span 12}.col-xl-12.offset-xl-14{grid-column:14/span 12}.col-xl-12.offset-xl-15{grid-column:15/span 12}.col-xl-12.offset-xl-16{grid-column:16/span 12}.col-13,.col-xl-13{grid-column:span 13}.col-xl-13.offset-xl-2{grid-column:2/span 13}.col-xl-13.offset-xl-3{grid-column:3/span 13}.col-xl-13.offset-xl-4{grid-column:4/span 13}.col-xl-13.offset-xl-5{grid-column:5/span 13}.col-xl-13.offset-xl-6{grid-column:6/span 13}.col-xl-13.offset-xl-7{grid-column:7/span 13}.col-xl-13.offset-xl-8{grid-column:8/span 13}.col-xl-13.offset-xl-9{grid-column:9/span 13}.col-xl-13.offset-xl-10{grid-column:10/span 13}.col-xl-13.offset-xl-11{grid-column:11/span 13}.col-xl-13.offset-xl-12{grid-column:12/span 13}.col-xl-13.offset-xl-13{grid-column:13/span 13}.col-xl-13.offset-xl-14{grid-column:14/span 13}.col-xl-13.offset-xl-15{grid-column:15/span 13}.col-xl-13.offset-xl-16{grid-column:16/span 13}.col-14,.col-xl-14{grid-column:span 14}.col-xl-14.offset-xl-2{grid-column:2/span 14}.col-xl-14.offset-xl-3{grid-column:3/span 14}.col-xl-14.offset-xl-4{grid-column:4/span 14}.col-xl-14.offset-xl-5{grid-column:5/span 14}.col-xl-14.offset-xl-6{grid-column:6/span 14}.col-xl-14.offset-xl-7{grid-column:7/span 14}.col-xl-14.offset-xl-8{grid-column:8/span 14}.col-xl-14.offset-xl-9{grid-column:9/span 14}.col-xl-14.offset-xl-10{grid-column:10/span 14}.col-xl-14.offset-xl-11{grid-column:11/span 14}.col-xl-14.offset-xl-12{grid-column:12/span 14}.col-xl-14.offset-xl-13{grid-column:13/span 14}.col-xl-14.offset-xl-14{grid-column:14/span 14}.col-xl-14.offset-xl-15{grid-column:15/span 14}.col-xl-14.offset-xl-16{grid-column:16/span 14}.col-15,.col-xl-15{grid-column:span 15}.col-xl-15.offset-xl-2{grid-column:2/span 15}.col-xl-15.offset-xl-3{grid-column:3/span 15}.col-xl-15.offset-xl-4{grid-column:4/span 15}.col-xl-15.offset-xl-5{grid-column:5/span 15}.col-xl-15.offset-xl-6{grid-column:6/span 15}.col-xl-15.offset-xl-7{grid-column:7/span 15}.col-xl-15.offset-xl-8{grid-column:8/span 15}.col-xl-15.offset-xl-9{grid-column:9/span 15}.col-xl-15.offset-xl-10{grid-column:10/span 15}.col-xl-15.offset-xl-11{grid-column:11/span 15}.col-xl-15.offset-xl-12{grid-column:12/span 15}.col-xl-15.offset-xl-13{grid-column:13/span 15}.col-xl-15.offset-xl-14{grid-column:14/span 15}.col-xl-15.offset-xl-15{grid-column:15/span 15}.col-xl-15.offset-xl-16{grid-column:16/span 15}.col-16,.col-xl-16{grid-column:span 16}.col-xl-16.offset-xl-2{grid-column:2/span 16}.col-xl-16.offset-xl-3{grid-column:3/span 16}.col-xl-16.offset-xl-4{grid-column:4/span 16}.col-xl-16.offset-xl-5{grid-column:5/span 16}.col-xl-16.offset-xl-6{grid-column:6/span 16}.col-xl-16.offset-xl-7{grid-column:7/span 16}.col-xl-16.offset-xl-8{grid-column:8/span 16}.col-xl-16.offset-xl-9{grid-column:9/span 16}.col-xl-16.offset-xl-10{grid-column:10/span 16}.col-xl-16.offset-xl-11{grid-column:11/span 16}.col-xl-16.offset-xl-12{grid-column:12/span 16}.col-xl-16.offset-xl-13{grid-column:13/span 16}.col-xl-16.offset-xl-14{grid-column:14/span 16}.col-xl-16.offset-xl-15{grid-column:15/span 16}.col-xl-16.offset-xl-16{grid-column:16/span 16}}.button,a.button{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:1em;font-weight:700;text-decoration:none;white-space:nowrap;outline:none;width:-webkit-min-content;width:-moz-min-content;width:min-content;text-shadow:0 1px 1px #fff;background:#fff;background-image:none;border:1px solid #ccc;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:3px;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;line-height:1;padding:.935rem 1.6rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:visible;text-align:center}.button,.button:focus,.button:hover,a.button,a.button:focus,a.button:hover{color:#3f4143;-webkit-transition:background .2s,color .2s;transition:background .2s,color .2s}.button:focus,.button:hover,a.button:focus,a.button:hover{background:#f0f0f0;background-image:none}.button:active,a.button:active{color:#3f4143;background:#fff}.button:focus,a.button:focus{background:#fff}.button:focus>[class^=material-icons],.button:focus>i,a.button:focus>[class^=material-icons],a.button:focus>i{color:#0a8fff}.button.active,a.button.active{color:#3f4143;background:#e6e6e6;background-image:none;text-decoration:none}.button.active:focus,.button.active:hover,a.button.active:focus,a.button.active:hover{color:#3f4143;background:#f0f0f0}.button.active [class^=material-icons],.button.active i,a.button.active [class^=material-icons],a.button.active i{color:#3f4143;text-shadow:none}.button.disabled,.button:disabled,.button[disabled],a.button.disabled,a.button:disabled,a.button[disabled]{cursor:default;opacity:.59;pointer-events:none}.button.primary,a.button.primary{background:#0a8fff;color:#fff;text-shadow:0 1px 1px #007fea;background-image:none;border:none}.button.primary:hover,a.button.primary:hover{background:#30a0ff;color:#fff;background-image:none}.button.primary.active,.button.primary:active,a.button.primary.active,a.button.primary:active{background:#30a0ff;color:#fff}.button.primary.inactive,a.button.primary.inactive{background:#007be3}.button.primary [class^=material-icons],.button.primary i,a.button.primary [class^=material-icons],a.button.primary i{color:#fff;text-shadow:none}.button.success,a.button.success{background:#2ec4b6;color:#fff;text-shadow:0 1px 1px #28ab9f;background-image:none;border:none}.button.success:hover,a.button.success:hover{background:#45d3c6;color:#fff;background-image:none}.button.success.active,.button.success:active,a.button.success.active,a.button.success:active{background:#45d3c6;color:#fff}.button.success.inactive,a.button.success.inactive{background:#27a599}.button.success [class^=material-icons],.button.success i,a.button.success [class^=material-icons],a.button.success i{color:#fff;text-shadow:none}.button.warning,a.button.warning{background:#de9e36;color:#fff;text-shadow:0 1px 1px #d39023;background-image:none;border:none}.button.warning:hover,a.button.warning:hover{background:#e3ae57;color:#fff;background-image:none}.button.warning.active,.button.warning:active,a.button.warning.active,a.button.warning:active{background:#e3ae57;color:#fff}.button.warning.inactive,a.button.warning.inactive{background:#cc8b22}.button.warning [class^=material-icons],.button.warning i,a.button.warning [class^=material-icons],a.button.warning i{color:#fff;text-shadow:none}.button.error,a.button.error{background:#d62828;color:#fff;text-shadow:0 1px 1px #bc2323;background-image:none;border:none}.button.error:hover,a.button.error:hover{background:#dd4848;color:#fff;background-image:none}.button.error.active,.button.error:active,a.button.error.active,a.button.error:active{background:#dd4848;color:#fff}.button.error.inactive,a.button.error.inactive{background:#b62222}.button.error [class^=material-icons],.button.error i,a.button.error [class^=material-icons],a.button.error i{color:#fff;text-shadow:none}.button.dark,a.button.dark{background:#414552;color:#fff;text-shadow:0 1px 1px #333741;background-image:none;border:none}.button.dark:hover,a.button.dark:hover{background:#525767;color:#fff;background-image:none}.button.dark.active,.button.dark:active,a.button.dark.active,a.button.dark:active{background:#525767;color:#fff}.button.dark.inactive,a.button.dark.inactive{background:#30333d}.button.dark [class^=material-icons],.button.dark i,a.button.dark [class^=material-icons],a.button.dark i{color:#fff;text-shadow:none}.button.link.button,.button.link>.button,a.button.link.button,a.button.link>.button{background:transparent;color:#3f4143;text-shadow:0 1px 1px transparent;background-image:none;border:none}.button.link.button:hover,.button.link>.button:hover,a.button.link.button:hover,a.button.link>.button:hover{background:hsla(0,0%,7%,0);color:#3f4143;background-image:none}.button.link.button.active,.button.link.button:active,.button.link>.button.active,.button.link>.button:active,a.button.link.button.active,a.button.link.button:active,a.button.link>.button.active,a.button.link>.button:active{background:hsla(0,0%,7%,0);color:#3f4143}.button.link.button.inactive,.button.link>.button.inactive,a.button.link.button.inactive,a.button.link>.button.inactive{background:transparent}.button.link.button [class^=material-icons],.button.link.button i,.button.link>.button [class^=material-icons],.button.link>.button i,a.button.link.button [class^=material-icons],a.button.link.button i,a.button.link>.button [class^=material-icons],a.button.link>.button i{color:#3f4143;text-shadow:none}.button.link.button:hover,.button.link>.button:hover,a.button.link.button:hover,a.button.link>.button:hover{background:#e6e6e6}.button.tiny,a.button.tiny{font-size:.809em;padding:.415rem .5rem;font-weight:700}.button.mini,a.button.mini{font-size:.909em;padding:.445rem .9rem;font-weight:700}.button.small,a.button.small{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.button.large,a.button.large{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.button.huge,a.button.huge{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}.button.block,a.button.block{display:block;width:100%}.button [class^=material-icons],.button i,a.button [class^=material-icons],a.button i{font-size:1.35em;color:#3f4143;text-shadow:none}.button.secondary,a.button.secondary{color:#3f4143;background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),color-stop(60%,#ededed),to(#e6e6e6));background-image:linear-gradient(180deg,#fff 0,#ededed 60%,#e6e6e6)}.button.secondary.active,.button.secondary:active,.button.secondary:focus,.button.secondary:hover,a.button.secondary.active,a.button.secondary:active,a.button.secondary:focus,a.button.secondary:hover{color:#3f4143;background-image:-webkit-gradient(linear,left top,left bottom,from(#e1e1e1),color-stop(11%,#e1e1e1),color-stop(22%,#e8e8e8),color-stop(43%,#eee),to(#fafafa));background-image:linear-gradient(180deg,#e1e1e1 0,#e1e1e1 11%,#e8e8e8 22%,#eee 43%,#fafafa);z-index:1;border-color:#c6c6c6}.button.secondary.active [class^=material-icons],.button.secondary.active i,.button.secondary:active [class^=material-icons],.button.secondary:active i,.button.secondary:focus [class^=material-icons],.button.secondary:focus i,.button.secondary:hover [class^=material-icons],.button.secondary:hover i,a.button.secondary.active [class^=material-icons],a.button.secondary.active i,a.button.secondary:active [class^=material-icons],a.button.secondary:active i,a.button.secondary:focus [class^=material-icons],a.button.secondary:focus i,a.button.secondary:hover [class^=material-icons],a.button.secondary:hover i{color:#3f4143}.buttons{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-negative:0;flex-shrink:0;border-radius:3px;-webkit-box-shadow:0 .155em 0 rgba(0,0,0,.095);box-shadow:0 .155em 0 rgba(0,0,0,.095)}.buttons .button:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.buttons .button:not(:first-child):not(:last-child){border-radius:0;margin-left:-1px}.buttons .button:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}.buttons.secondary>.button{color:#3f4143;background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),color-stop(60%,#ededed),to(#e6e6e6));background-image:linear-gradient(180deg,#fff 0,#ededed 60%,#e6e6e6)}.buttons.secondary>.button.active,.buttons.secondary>.button:active,.buttons.secondary>.button:focus,.buttons.secondary>.button:hover{color:#3f4143;background-image:-webkit-gradient(linear,left top,left bottom,from(#e1e1e1),color-stop(11%,#e1e1e1),color-stop(22%,#e8e8e8),color-stop(43%,#eee),to(#fafafa));background-image:linear-gradient(180deg,#e1e1e1 0,#e1e1e1 11%,#e8e8e8 22%,#eee 43%,#fafafa);z-index:1;border-color:#c6c6c6}.buttons.secondary>.button.active [class^=material-icons],.buttons.secondary>.button.active i,.buttons.secondary>.button:active [class^=material-icons],.buttons.secondary>.button:active i,.buttons.secondary>.button:focus [class^=material-icons],.buttons.secondary>.button:focus i,.buttons.secondary>.button:hover [class^=material-icons],.buttons.secondary>.button:hover i{color:#3f4143}.buttons.block{display:-webkit-box;display:-ms-flexbox;display:flex}.buttons.block .button{-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0}.buttons .inactive{padding-left:.45rem!important;padding-right:.45rem!important;pointer-events:none;cursor:default;background-image:none!important}.buttons.tiny>.button,.buttons.tiny>.dropdown>.button{font-size:.809em;padding:.415rem .5rem;font-weight:700}.buttons.mini>.button,.buttons.mini>.dropdown>.button{font-size:.909em;padding:.445rem .9rem;font-weight:700}.buttons.small>.button,.buttons.small>.dropdown>.button{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.buttons.large>.button,.buttons.large>.dropdown>.button{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.buttons.huge>.button,.buttons.huge>.dropdown>.button{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}.buttons.primary>.button,.buttons.primary>.dropdown>.button{background:#0a8fff;color:#fff;text-shadow:0 1px 1px #007fea;background-image:none;border:none;border:1px solid #007fea}.buttons.primary>.button:hover,.buttons.primary>.dropdown>.button:hover{background:#30a0ff;color:#fff;background-image:none}.buttons.primary>.button.active,.buttons.primary>.button:active,.buttons.primary>.dropdown>.button.active,.buttons.primary>.dropdown>.button:active{background:#30a0ff;color:#fff}.buttons.primary>.button.inactive,.buttons.primary>.dropdown>.button.inactive{background:#007be3}.buttons.primary>.button [class^=material-icons],.buttons.primary>.button i,.buttons.primary>.dropdown>.button [class^=material-icons],.buttons.primary>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.success>.button,.buttons.success>.dropdown>.button{background:#2ec4b6;color:#fff;text-shadow:0 1px 1px #28ab9f;background-image:none;border:none;border:1px solid #28ab9f}.buttons.success>.button:hover,.buttons.success>.dropdown>.button:hover{background:#45d3c6;color:#fff;background-image:none}.buttons.success>.button.active,.buttons.success>.button:active,.buttons.success>.dropdown>.button.active,.buttons.success>.dropdown>.button:active{background:#45d3c6;color:#fff}.buttons.success>.button.inactive,.buttons.success>.dropdown>.button.inactive{background:#27a599}.buttons.success>.button [class^=material-icons],.buttons.success>.button i,.buttons.success>.dropdown>.button [class^=material-icons],.buttons.success>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.warning>.button,.buttons.warning>.dropdown>.button{background:#de9e36;color:#fff;text-shadow:0 1px 1px #d39023;background-image:none;border:none;border:1px solid #d39023}.buttons.warning>.button:hover,.buttons.warning>.dropdown>.button:hover{background:#e3ae57;color:#fff;background-image:none}.buttons.warning>.button.active,.buttons.warning>.button:active,.buttons.warning>.dropdown>.button.active,.buttons.warning>.dropdown>.button:active{background:#e3ae57;color:#fff}.buttons.warning>.button.inactive,.buttons.warning>.dropdown>.button.inactive{background:#cc8b22}.buttons.warning>.button [class^=material-icons],.buttons.warning>.button i,.buttons.warning>.dropdown>.button [class^=material-icons],.buttons.warning>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.error>.button,.buttons.error>.dropdown>.button{background:#d62828;color:#fff;text-shadow:0 1px 1px #bc2323;background-image:none;border:none;border:1px solid #bc2323}.buttons.error>.button:hover,.buttons.error>.dropdown>.button:hover{background:#dd4848;color:#fff;background-image:none}.buttons.error>.button.active,.buttons.error>.button:active,.buttons.error>.dropdown>.button.active,.buttons.error>.dropdown>.button:active{background:#dd4848;color:#fff}.buttons.error>.button.inactive,.buttons.error>.dropdown>.button.inactive{background:#b62222}.buttons.error>.button [class^=material-icons],.buttons.error>.button i,.buttons.error>.dropdown>.button [class^=material-icons],.buttons.error>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.dark>.button,.buttons.dark>.dropdown>.button{background:#414552;color:#fff;text-shadow:0 1px 1px #333741;background-image:none;border:none;border:1px solid #333741}.buttons.dark>.button:hover,.buttons.dark>.dropdown>.button:hover{background:#525767;color:#fff;background-image:none}.buttons.dark>.button.active,.buttons.dark>.button:active,.buttons.dark>.dropdown>.button.active,.buttons.dark>.dropdown>.button:active{background:#525767;color:#fff}.buttons.dark>.button.inactive,.buttons.dark>.dropdown>.button.inactive{background:#30333d}.buttons.dark>.button [class^=material-icons],.buttons.dark>.button i,.buttons.dark>.dropdown>.button [class^=material-icons],.buttons.dark>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.link.button,.buttons.link>.button{background:transparent;color:#3f4143;text-shadow:0 1px 1px transparent;background-image:none;border:none}.buttons.link.button:hover,.buttons.link>.button:hover{background:hsla(0,0%,7%,0);color:#3f4143;background-image:none}.buttons.link.button.active,.buttons.link.button:active,.buttons.link>.button.active,.buttons.link>.button:active{background:hsla(0,0%,7%,0);color:#3f4143}.buttons.link.button.inactive,.buttons.link>.button.inactive{background:transparent}.buttons.link.button [class^=material-icons],.buttons.link.button i,.buttons.link>.button [class^=material-icons],.buttons.link>.button i{color:#3f4143;text-shadow:none}.buttons.link.button:hover,.buttons.link>.button:hover{background:#e6e6e6}.buttons .dropdown:last-child:not(:first-child),.buttons .dropdown:last-child:not(:first-child)>.button{border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}.buttons .dropdown:last-child,.buttons .dropdown:last-child>.button:first-child,.buttons .dropdown:last-child>.button:last-child{border-bottom-right-radius:3px;border-top-right-radius:3px}.buttons .dropdown:not(:first-child):not(:last-child)>.button{border-radius:0;margin-left:-1px}@media only screen and (max-width:768px){.buttons{-webkit-box-shadow:none;box-shadow:none}}.buttons.vertical{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column}.buttons.vertical.block,.buttons.vertical.block>.button,.buttons.vertical>.button,.buttons.vertical>.dropdown>.button{width:100%}.buttons.vertical>.button{border-radius:0}.buttons.vertical>.button:last-child:not(:first-child),.buttons.vertical>.button:not(:first-child):not(:last-child){margin:-1px 0 0}.buttons.vertical.block{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.buttons.vertical>.dropdown:last-child:not(:first-child),.buttons.vertical>.dropdown:last-child:not(:first-child)>.button,.buttons.vertical>.dropdown:not(:first-child):not(:last-child)>.button{margin:-1px 0 0;border-radius:0}.buttons.vertical>.dropdown>.primary.button,.buttons.vertical>.primary.button{border:1px solid #007fea}.buttons.vertical>.dropdown>.success.button,.buttons.vertical>.success.button{border:1px solid #28ab9f}.buttons.vertical>.dropdown>.warning.button,.buttons.vertical>.warning.button{border:1px solid #d39023}.buttons.vertical>.dropdown>.error.button,.buttons.vertical>.error.button{border:1px solid #bc2323}.buttons.vertical>.dark.button,.buttons.vertical>.dropdown>.dark.button{border:1px solid #333741}.dropdown{display:inline-block;position:relative}.dropdown>.menu{-webkit-animation:slide-down .15s ease 1;animation:slide-down .15s ease 1;display:none;left:0;max-height:45vh;overflow-y:auto;position:absolute;top:100%;z-index:301;width:auto}.dropdown>.menu>.item>a{padding:.1rem .9rem}.dropdown.left>.menu,.dropdown.right>.menu{top:0}.dropdown.right>.menu{left:100%;right:auto}.dropdown.left>.menu{left:auto;right:100%}.dropdown.top.left>.menu{right:auto!important;left:0!important}.dropdown.top.right>.menu{right:0!important;left:auto!important}.dropdown.top>.menu{bottom:100%;top:auto;right:0;left:auto;-webkit-box-shadow:0 -3px 10px rgba(0,0,0,.15);box-shadow:0 -3px 10px rgba(0,0,0,.15)}.dropdown.bottom.left>.menu,.dropdown.bottom.right>.menu{top:100%}.dropdown.bottom.left>.menu{right:auto!important;left:0!important}.dropdown.bottom.right>.menu{right:0!important;left:auto!important}.dropdown.active>.menu,.dropdown>.menu:focus,.dropdown>.menu:hover,.dropdown>.toggle:focus+.menu,.dropdown>.toggle:hover+.menu{display:block}.dropdown.clickable>.toggle:hover+.menu{display:none}.dropdown.clickable>.toggle:active~.menu,.dropdown.clickable>.toggle:focus~.menu{display:block}.dropdown>.buttons>.toggle:nth-last-child(2){border-bottom-right-radius:3px;border-top-right-radius:3px}.dropdown.tiny>.button,.dropdown.tiny>.dropdown>.button{font-size:.809em;padding:.415rem .5rem;font-weight:700}.dropdown.mini>.button,.dropdown.mini>.dropdown>.button{font-size:.909em;padding:.445rem .9rem;font-weight:700}.dropdown.small>.button,.dropdown.small>.dropdown>.button{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.dropdown.large>.button,.dropdown.large>.dropdown>.button{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.dropdown.huge>.button,.dropdown.huge>.dropdown>.button{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}input:not([type]),input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=file],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{-webkit-appearance:none;background-color:#fff;border:1px solid #c6c6c6;height:2.5rem;border-radius:0;outline:2px solid transparent;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:inherit;box-sizing:inherit;outline-offset:-2px;padding:.4rem .5rem;width:100%;max-width:100%;font-family:inherit;color:#414552;font-size:1.088em}input:not([type]):focus,input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=file]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select:focus,textarea:focus{outline:2px solid #414552;outline-offset:-2px;-webkit-transition:.35s;transition:.35s}input:not([type]).success,input[type=color].success,input[type=date].success,input[type=datetime-local].success,input[type=datetime].success,input[type=email].success,input[type=file].success,input[type=month].success,input[type=number].success,input[type=password].success,input[type=search].success,input[type=tel].success,input[type=text].success,input[type=time].success,input[type=url].success,input[type=week].success,select.success,textarea.success{color:#2ec4b6;outline-color:#2ec4b6}input:not([type]).error,input[type=color].error,input[type=date].error,input[type=datetime-local].error,input[type=datetime].error,input[type=email].error,input[type=file].error,input[type=month].error,input[type=number].error,input[type=password].error,input[type=search].error,input[type=tel].error,input[type=text].error,input[type=time].error,input[type=url].error,input[type=week].error,select.error,textarea.error{color:#d62828;outline-color:#d62828}select{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTE2LjU5IDguNTlMMTIgMTMuMTcgNy40MSA4LjU5IDYgMTBsNiA2IDYtNnoiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:right 10px center}select[multiple]{background:none;height:auto}textarea{min-height:6.5rem;resize:vertical}label,legend{display:block;font-size:1rem;font-weight:400}fieldset{border-width:0;padding:0}input[type=checkbox],input[type=radio]{display:inline}input:disabled{opacity:.59}.form{position:relative;max-width:100%;padding:0 16px}.form .item{margin:6px 0 .75em;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;width:100%;max-width:100%;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.form .item,.form .item>label,.form label{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.form .item>label,.form label{margin:0;color:#22242b;font-size:.8579rem;font-weight:700;text-transform:none}.form .item>input[type=file]{opacity:0;position:absolute;top:0;left:0;height:100%;cursor:default}.form .group,.form .item>.group{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}.form .group>*,.form .item>.group>*{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}.form .group>:last-child,.form .item>.group>:last-child{margin-left:-1px}.form .group>:not(:first-child):not(:last-child),.form .item>.group>:not(:first-child):not(:last-child){margin-left:-1px;margin-right:0}.form .group>.buttons,.form .item>.group>.buttons{-webkit-box-shadow:none;box-shadow:none}.form .group>.button,.form .item>.group>.button{height:2.5rem;font-size:1em;padding:.935rem 1.6rem;font-weight:700}.form .group>.button:first-child,.form .item>.group>.button:first-child{border-bottom-right-radius:0;border-top-right-radius:0}.form .group>.button:last-child:not(:first-child),.form .item>.group>.button:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.form .items{margin:6px 0 .75em;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form .items>.item{margin:6px 6px .75em}.form .two.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.5 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.5 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .two.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .three.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.333333333333333 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.333333333333333 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .three.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .four.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.25 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.25 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .four.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .five.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.2 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.2 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .five.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .six.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.166666666666667 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.166666666666667 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .six.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .seven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.142857142857143 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.142857142857143 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .seven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .eight.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.125 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.125 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .eight.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .nine.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.111111111111111 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.111111111111111 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .nine.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .ten.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.1 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.1 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .ten.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .eleven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.090909090909091 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.090909090909091 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .eleven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .twelve.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.083333333333333 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.083333333333333 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .twelve.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .thirteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.076923076923077 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.076923076923077 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .thirteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .fourteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.071428571428571 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.071428571428571 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .fourteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .fifteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.066666666666667 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.066666666666667 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .fifteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .sixteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.0625 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.0625 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .sixteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form.small input:not([type]),.form.small input[type=color],.form.small input[type=date],.form.small input[type=datetime-local],.form.small input[type=datetime],.form.small input[type=email],.form.small input[type=file],.form.small input[type=month],.form.small input[type=number],.form.small input[type=password],.form.small input[type=search],.form.small input[type=tel],.form.small input[type=text],.form.small input[type=time],.form.small input[type=url],.form.small input[type=week],.form.small select,.form.small textarea{height:1.9rem;font-size:1em}.form.small .button{height:1.9rem!important;font-size:.979em!important;padding:.645rem 1.4rem!important}.form.small>.item>label,.form.small>.items>.item>label,.form.small label{font-size:1em}.form.large input:not([type]),.form.large input[type=color],.form.large input[type=date],.form.large input[type=datetime-local],.form.large input[type=datetime],.form.large input[type=email],.form.large input[type=file],.form.large input[type=month],.form.large input[type=number],.form.large input[type=password],.form.large input[type=search],.form.large input[type=tel],.form.large input[type=text],.form.large input[type=time],.form.large input[type=url],.form.large input[type=week],.form.large select,.form.large textarea{height:2.9rem;font-size:1.2em}.form.large .button{height:2.9rem!important;font-size:1.25em!important;padding:1.15rem 2.1rem!important}.form.large>.item>label,.form.large>.items>.item>label,.form.large label{font-size:1.2em}.checkbox,.radio{position:relative}.checkbox label,.radio label{padding:0 1.2rem 0 1.7rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:400;margin:0}.checkbox input,.radio input{left:0;opacity:0;position:absolute;top:0}.checkbox input+label:after,.checkbox input+label:before,.radio input+label:after,.radio input+label:before{position:absolute;-webkit-transition:opacity .11s ease-in-out;transition:opacity .11s ease-in-out;font-family:Material Icons;font-style:normal;font-weight:400;text-transform:none;color:#414552;font-size:1.15rem;top:-5px;left:0}.checkbox input+label:before,.radio input+label:before{opacity:1}.checkbox input+label:after,.radio input+label:after{opacity:0}.checkbox input:checked+label:after,.radio input:checked+label:after{opacity:1}.checkbox input+label:before{content:"check_box_outline_blank"}.checkbox input+label:after{content:"check_box"}.radio input+label:before{content:"radio_button_unchecked"}.radio input+label:after{content:"radio_button_checked"}h1{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h1,h1{font-size:2rem;font-weight:900}@media only screen and (max-width:768px){.h1,h1{font-size:1.7rem}}h2{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h2,h2{font-size:1.8rem;font-weight:900}@media only screen and (max-width:768px){.h2,h2{font-size:1.5rem}}h3{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h3,h3{font-size:1.6rem;font-weight:900}@media only screen and (max-width:768px){.h3,h3{font-size:1.3rem}}h4{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h4,h4{font-size:1.4rem;font-weight:900}@media only screen and (max-width:768px){.h4,h4{font-size:1.1rem}}h5{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h5,h5{font-size:1.2rem;font-weight:900}@media only screen and (max-width:768px){.h5,h5{font-size:.9rem}}h6{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h6,h6{font-size:1rem;font-weight:900}@media only screen and (max-width:768px){.h6,h6{font-size:inherit}}.h1.bordered,.h2.bordered,.h3.bordered,.h4.bordered,.h5.bordered,.h6.bordered,h1.bordered,h2.bordered,h3.bordered,h4.bordered,h5.bordered,h6.bordered{border-width:0 0 1px!important;padding-bottom:10px;margin-bottom:20px}p{margin:0 0 1em;font-size:1.0495rem}a,ins,u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}abbr[title]{border-bottom:1px dotted;cursor:help;text-decoration:none}blockquote{border-left:.1rem dotted #77878b;margin-left:0;padding:.4rem .8rem;font-style:italic;color:#77878b}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}.table{position:relative;border-collapse:collapse;border-spacing:0;width:100%;max-width:100%;text-align:left;margin-bottom:1.5rem}.table.striped tbody tr.active,.table.striped tbody tr:nth-of-type(odd),.table.striped tr.active,.table.striped tr:nth-of-type(odd){background:#f0f0f0}.table.striped thead tr{background:transparent!important}.table.hovered tbody tr:hover,.table.hovered tr:hover{background:#f0f0f0;color:#3f4143}.table.hovered thead tr{background:transparent!important}.table tbody tr,.table tr{-webkit-transition:all .3s;transition:all .3s}.table tbody tr.active,.table tbody tr.active:hover,.table tr.active,.table tr.active:hover{background:#e6e6e6}.table td,.table th{border-bottom:1px solid #e6e6e6;padding:5px 7px;text-align:inherit}.table thead tr{background:transparent}.table thead tr th{border-bottom-width:1px;border-bottom-color:#c6c6c6;font-weight:400;color:#9d9d9d}.material-icons{font-size:1.1rem;line-height:1;vertical-align:middle}.label,a.label{display:inline-block;font-weight:700;line-height:1.2;margin:.1rem .05rem;border-radius:4px;text-decoration:none;border:1px solid #c6c6c6;-webkit-box-shadow:0 .155em 0 rgba(0,0,0,.095);box-shadow:0 .155em 0 rgba(0,0,0,.095);background-color:#fff;color:#3f4143;border-color:#c6c6c6;padding:.28rem .9rem;font-size:.9195em}.label.primary,a.label.primary{background-color:#0a8fff;color:#fff;border-color:#007ce5}.label.success,a.label.success{background-color:#2ec4b6;color:#fff;border-color:#27a79b}.label.warning,a.label.warning{background-color:#de9e36;color:#fff;border-color:#ce8d22}.label.error,a.label.error{background-color:#d62828;color:#fff;border-color:#b82222}.label.dark,a.label.dark{background-color:#414552;color:#fff;border-color:#31343e}.label.small,a.label.small{padding:.18rem .85rem;font-size:.8195em}.label.large,a.label.large{padding:.415rem 1.159rem;font-size:1em}.label>.material-icons,.label>i,a.label>.material-icons,a.label>i{vertical-align:text-top}.alert{display:block;background-color:#fff;border-color:#fff;border:1px solid #c6c6c6;border-radius:4px;padding:.6rem;margin:0 0 8px;width:100%;font-weight:700}.alert,.alert a{color:#3f4143}.alert.primary{background-color:#0a8fff;color:#fff;border-color:#0082f0}.alert.success{background-color:#2ec4b6;color:#fff;border-color:#29afa3}.alert.warning{background-color:#de9e36;color:#fff;border-color:#d79323}.alert.error{background-color:#d62828;color:#fff;border-color:#c12424}.alert.dark{background-color:#414552;color:#fff;border-color:#363944}.alert.small{padding:.4rem;font-size:.749rem}.alert.large{padding:.8rem;font-size:1.1rem}.alert a{color:#0a8fff;text-decoration:underline}.alert a.active,.alert a:active,.alert a:focus,.alert a:hover{opacity:.75}.alert p:last-child{margin-bottom:0}.alert>.material-icons,.alert>i{vertical-align:text-top}.badge{position:relative;white-space:nowrap;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-weight:700;border-radius:500px;padding:1px 6px;font-size:.854rem;background-color:#fff;color:#3f4143}.badge.primary{background-color:#0a8fff;color:#fff}.badge.success{background-color:#2ec4b6;color:#fff}.badge.warning{background-color:#de9e36;color:#fff}.badge.error{background-color:#d62828;color:#fff}.badge.dark{background-color:#414552;color:#fff}.badge.tiny{padding:0 4px;font-size:.659rem}.badge.small{padding:1px 4px;font-size:.749rem}.badge.large{padding:2px 8px;font-size:1.1rem}.billboard{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:4.5rem 2.5rem;background-color:#fff;color:#3f4143;border-color:#f4f4f4;border:1px solid #c6c6c6}.billboard.primary{background-color:#0a8fff;color:#fff}.billboard.success{background-color:#2ec4b6;color:#fff}.billboard.warning{background-color:#de9e36;color:#fff}.billboard.error{background-color:#d62828;color:#fff}.billboard.dark{background-color:#414552;color:#fff}.billboard.small{font-size:1em}.billboard.small,.billboard.small .body{padding:2.5rem 1.5rem}.billboard.small p{font-size:1em}.billboard.large{font-size:1.6em}.billboard.large,.billboard.large .body{padding:7.5rem 4rem}.billboard.large p{font-size:1.6em}.billboard .media{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.billboard .body{padding:4.5rem 2.5rem;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.cover{min-height:100vh;max-height:100%;min-width:100%;border:0;background-size:cover;background-position:50%;background-repeat:no-repeat}@media only screen and (max-width:768px){.billboard{padding:2.5rem 1rem;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.billboard .media img{width:100%}.billboard .body{padding:2.5rem 1rem}.billboard.small,.billboard.small .body{padding:1rem}.billboard.small p{font-size:1em}.billboard.large,.billboard.large .body{padding:1rem}.billboard.large p{font-size:1.358em}}.breadcrumb{display:inline-block;white-space:nowrap}.breadcrumb .item,.breadcrumb a.item{text-decoration:none;font-size:inherit}.breadcrumb .item.active,.breadcrumb .item:active,.breadcrumb .item:focus,.breadcrumb .item:hover,.breadcrumb a.item.active,.breadcrumb a.item:active,.breadcrumb a.item:focus,.breadcrumb a.item:hover{color:#007ae0}.breadcrumb .item:after,.breadcrumb a.item:after{font-family:Material Icons;content:"keyboard_arrow_right";color:#007ae0;padding:0 .25em;vertical-align:middle;font-size:1.4rem;cursor:auto}.breadcrumb .item:first-child,.breadcrumb a.item:first-child{margin-left:0}.breadcrumb .item.active,.breadcrumb a.item.active{color:#007ae0;font-weight:700}.breadcrumb .item.active:after,.breadcrumb a.item.active:after{content:none}.breadcrumb.small .item{font-size:.9589em}.breadcrumb.small .item:after{padding:.15em;font-size:1.25rem}.breadcrumb.large .item{font-size:1.18em}.breadcrumb.large .item:after{padding:.18em;font-size:1.7rem}@media only screen and (max-width:768px){.breadcrumb .item:after{font-size:1rem;vertical-align:middle}}.cards{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.cards.two>.card{-ms-flex:0 0 calc(100% * 0.5 - 20px);flex:0 0 calc(100% * 0.5 - 20px)}.cards.three>.card,.cards.two>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.three>.card{-ms-flex:0 0 calc(100% * 0.333333333333333 - 20px);flex:0 0 calc(100% * 0.333333333333333 - 20px)}.cards.four>.card{-ms-flex:0 0 calc(100% * 0.25 - 20px);flex:0 0 calc(100% * 0.25 - 20px)}.cards.five>.card,.cards.four>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.five>.card{-ms-flex:0 0 calc(100% * 0.2 - 20px);flex:0 0 calc(100% * 0.2 - 20px)}.cards.six>.card{-ms-flex:0 0 calc(100% * 0.166666666666667 - 20px);flex:0 0 calc(100% * 0.166666666666667 - 20px)}.cards.seven>.card,.cards.six>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.seven>.card{-ms-flex:0 0 calc(100% * 0.142857142857143 - 20px);flex:0 0 calc(100% * 0.142857142857143 - 20px)}.cards.eight>.card{-ms-flex:0 0 calc(100% * 0.125 - 20px);flex:0 0 calc(100% * 0.125 - 20px)}.cards.eight>.card,.cards.nine>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.nine>.card{-ms-flex:0 0 calc(100% * 0.111111111111111 - 20px);flex:0 0 calc(100% * 0.111111111111111 - 20px)}.cards.ten>.card{-ms-flex:0 0 calc(100% * 0.1 - 20px);flex:0 0 calc(100% * 0.1 - 20px)}.cards.eleven>.card,.cards.ten>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.eleven>.card{-ms-flex:0 0 calc(100% * 0.090909090909091 - 20px);flex:0 0 calc(100% * 0.090909090909091 - 20px)}.cards.twelve>.card{-ms-flex:0 0 calc(100% * 0.083333333333333 - 20px);flex:0 0 calc(100% * 0.083333333333333 - 20px)}.cards.thirteen>.card,.cards.twelve>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.thirteen>.card{-ms-flex:0 0 calc(100% * 0.076923076923077 - 20px);flex:0 0 calc(100% * 0.076923076923077 - 20px)}.cards.fourteen>.card{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.071428571428571 - 20px);flex:0 0 calc(100% * 0.071428571428571 - 20px);height:auto;margin:10px}.cards.fifteen>.card{-ms-flex:0 0 calc(100% * 0.066666666666667 - 20px);flex:0 0 calc(100% * 0.066666666666667 - 20px)}.cards.fifteen>.card,.cards.sixteen>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.sixteen>.card{-ms-flex:0 0 calc(100% * 0.0625 - 20px);flex:0 0 calc(100% * 0.0625 - 20px)}.card{background:#fff;border:1px solid #c6c6c6;border-radius:4px;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:240px;height:100%;overflow:hidden}.card .title,.card>.body .title{color:#1a1b1c;line-height:normal}.card .title>.subtitle,.card>.body .title>.subtitle{color:grey;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}.card .actions,.card .description,.card .title{padding:16px}.card .description{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;color:#3f4143}.card>.media{-ms-flex-wrap:wrap;flex-wrap:wrap;display:-webkit-box;display:-ms-flexbox;display:flex}.card>.media img{display:block}.card>.media.two{padding-bottom:0!important;height:auto}.card>.media.two>a,.card>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.three{padding-bottom:0!important;height:auto}.card>.media.three>a,.card>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.four{padding-bottom:0!important;height:auto}.card>.media.four>a,.card>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.five{padding-bottom:0!important;height:auto}.card>.media.five>a,.card>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.six{padding-bottom:0!important;height:auto}.card>.media.six>a,.card>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.seven{padding-bottom:0!important;height:auto}.card>.media.seven>a,.card>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.eight{padding-bottom:0!important;height:auto}.card>.media.eight>a,.card>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.nine{padding-bottom:0!important;height:auto}.card>.media.nine>a,.card>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.ten{padding-bottom:0!important;height:auto}.card>.media.ten>a,.card>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.eleven{padding-bottom:0!important;height:auto}.card>.media.eleven>a,.card>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.twelve{padding-bottom:0!important;height:auto}.card>.media.twelve>a,.card>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.thirteen{padding-bottom:0!important;height:auto}.card>.media.thirteen>a,.card>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.fourteen{padding-bottom:0!important;height:auto}.card>.media.fourteen>a,.card>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.fifteen{padding-bottom:0!important;height:auto}.card>.media.fifteen>a,.card>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.sixteen{padding-bottom:0!important;height:auto}.card>.media.sixteen>a,.card>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card.horizontal{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:15px}.card.horizontal>.media{-ms-flex-item-align:normal;align-self:normal;width:100%}.card.horizontal>.media img{width:auto;-o-object-fit:cover;object-fit:cover}.card.horizontal>.body{-webkit-box-flex:inherit;-ms-flex:inherit;flex:inherit}.card.horizontal>.body .description,.card.horizontal>.body .title{padding:8px 16px}.card.horizontal>.body .description{-webkit-box-flex:1;-ms-flex:1;flex:1}@media only screen and (max-width:768px){.card,.cards>.card{-webkit-box-flex:0!important;-ms-flex:0 0 100%!important;flex:0 0 100%!important;width:100%;height:-webkit-fit-content!important;height:-moz-fit-content!important;height:fit-content!important}.card.horizontal{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.list{list-style:none;margin:1rem 0}.list>.item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:.55em;margin:0;-webkit-transition:.15s;transition:.15s}.list>.item>.material-icons,.list>.item>i,.list>.item>img{margin-right:1rem}.list>.item>.body{-webkit-box-flex:1;-ms-flex:1;flex:1;line-height:1.4;text-align:left}.list>.item>.body>.subtitle,.list>.item>.body>.title{display:block}.list>.item>.body>.title{font-size:1.28rem;font-weight:900;line-height:1}.list>.item>.body>.subtitle{font-size:.889em;font-weight:400;color:#77878b;margin-bottom:7px}.list>.item>.actions{margin-left:auto;width:auto;margin-left:1rem}.list>.item.active{background:#f0f0f0}.list.divided>.item{border-bottom:1px solid #c6c6c6}.list.divided>.item:last-child{border-bottom:none}.list.striped>.item:nth-of-type(odd){background:#f0f0f0}.list.hovered>.item:hover{background:#f0f0f0;-webkit-transition:.15s;transition:.15s}.menu{background:#fff;border-radius:0;list-style:none;margin:0;width:100%;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;padding:.9rem;-webkit-box-shadow:0 7px 10px rgba(0,0,0,.15);box-shadow:0 7px 10px rgba(0,0,0,.15);z-index:300}.menu .title{font-size:1.25em;min-height:2rem;color:#999;padding:.6rem 0;font-weight:300;letter-spacing:-.015rem}.menu .item{padding:0;position:relative;text-decoration:none;text-align:left}.menu .item>a{color:#606265;display:block;width:100%;padding:.28rem .9rem;text-decoration:none;font-size:1em}.menu .item>a,.menu .item>a:hover{-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.menu .item>a:hover{background:#f0f0f0;color:#292a2b}.menu .item>a.active,.menu .item>a:active,.menu .item>a:focus{background:#f0f0f0;color:#606265;font-weight:700;-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.menu .item>a:focus{font-weight:inherit}.menu .item i,.menu .item span.material-icons{color:#77878b;font-size:1.2rem;margin-right:10px;vertical-align:text-bottom}.menu .item .menu{padding:.4rem}.menu .badge{position:absolute;right:0;top:4px;padding:0 4px;font-size:.93em}.menu.small>.item a{font-size:.879em}.menu.divided .item{border-bottom:1px solid #e6e6e6}.menu.divided .item:last-child{border-bottom:none}.navbar{-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;min-height:80px;background:#0a8fff;color:#fff}.navbar,.navbar .container{width:100%}.navbar,.navbar .brand,.navbar .container{display:-webkit-box;display:-ms-flexbox;display:flex}.navbar .brand{padding:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:1rem}.navbar .brand img{max-height:60px;padding:8px}.navbar .brand a,.navbar .brand a:visited{font-size:1.1em;text-decoration:none;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;font-weight:700}.navbar .burger,.navbar input[type=checkbox]#burger{display:none}.navbar .burger:before{content:"dehaze";font-family:Material Icons;font-size:2.459rem;display:none;min-height:80px;min-width:80px;position:absolute;cursor:pointer;right:0;top:0}.navbar section.links,.navbar section.links div.section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.navbar section.links div.section{height:100%}.navbar section.links div.section:not(:first-child):last-child{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.navbar section.links div.section input[type=text]{background-color:#fff}.navbar.fixed{position:fixed;top:0;left:0;right:0;margin-top:0;-webkit-transform:translateY(0);transform:translateY(0);z-index:5}.navbar .buttons{height:100%;min-height:100%;-webkit-box-shadow:none;box-shadow:none}.navbar .buttons .button{background:transparent;border-color:transparent;border:none;color:#fff;min-height:100%}.navbar .buttons .button i,.navbar .buttons .button span.material-icons{color:#fff}.navbar .button,.navbar .dropdown .button{font-size:1.1em;padding:.935rem 1.4rem;font-weight:700}.navbar.light{background:#fff;color:#3f4143}.navbar.light .buttons .button{color:#3f4143;min-height:100%}.navbar.light .brand a,.navbar.light .brand a:visited,.navbar.light .buttons .button i,.navbar.light .buttons .button span.material-icons{color:#3f4143}.navbar.light section.links div.section input[type=text]{background-color:#fff;color:#3f4143}.navbar.dark{background:#363944;color:#fff}.navbar.dark .buttons .button{color:#fff;min-height:100%}.navbar.dark .brand a,.navbar.dark .brand a:visited,.navbar.dark .buttons .button i,.navbar.dark .buttons .button span.material-icons{color:#fff}.navbar.dark section.links div.section input[type=text]{background-color:#515666;border-color:#515666;color:#fff}.navbar-spacer{margin-top:100px}@media only screen and (max-width:768px){.navbar-spacer{margin-top:0}.navbar .container{padding:0}.navbar.fixed{position:relative}.navbar section.links{position:absolute;display:block;width:100%;height:0;top:80px;left:0;overflow-x:auto;overflow-y:hidden;background:#e6e6e6;z-index:1;margin:0!important;padding:0!important;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15)}.navbar section.links .section,.navbar section.links .section .buttons,.navbar section.links .section .buttons .button,.navbar section.links .section .buttons .dropdown,.navbar section.links .section .buttons .dropdown .button,.navbar section.links .section .buttons .dropdown .menu,.navbar section.links .section .buttons .dropdown .menu .button{display:block!important;width:100%;text-align:left;position:relative}.navbar section.links .section .buttons .button,.navbar section.links .section .buttons .dropdown .button{color:#3f4143}.navbar section.links .section .buttons .button i,.navbar section.links .section .buttons .button span.material-icons,.navbar section.links .section .buttons .dropdown .button i,.navbar section.links .section .buttons .dropdown .button span.material-icons{display:none}.navbar section.links .section .buttons .dropdown .menu{max-height:100%;-webkit-box-shadow:none;box-shadow:none}.navbar .burger{min-height:80px;min-width:80px}.navbar .burger,.navbar .burger:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.navbar .burger:before{content:"close"}.navbar input[type=checkbox]#burger:not(:checked)~section.links{height:0}.navbar input[type=checkbox]#burger:checked~section.links{height:auto}.navbar input[type=checkbox]#burger:not(:checked)~.burger:before{content:"dehaze"}.navbar input[type=checkbox]#burger:checked~.burger:before{content:"close"}}.panel{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;border:1px solid #c6c6c6;border-radius:4px;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15);background:#fff;margin:16px 0}.panel,.panel>.bottom,.panel>.header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal}.panel>.bottom,.panel>.header{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.panel>.bottom .actions,.panel>.header .actions{margin-left:auto}.panel>.bottom .actions:before,.panel>.header .actions:before{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.panel>.header{border-bottom:1px solid #c6c6c6;padding:12px 16px}.panel>.header.dashed{border-bottom-style:dashed}.panel>.header.dotted{border-bottom-style:dotted}.panel>.header .title{font-size:1.185rem;font-weight:900}.panel>.content{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:16px;height:auto}.panel>.content>.media{min-width:0;-webkit-box-flex:1;-ms-flex:auto;flex:auto;margin-bottom:32px;-ms-flex-wrap:wrap;flex-wrap:wrap;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;padding-bottom:56.25%!important;height:0;overflow:hidden;max-width:100%;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.panel>.content>.media embed,.panel>.content>.media iframe,.panel>.content>.media object{position:absolute;top:0;left:0;width:100%;height:100%}.panel>.content>.media video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.panel>.content>.media img{display:block}.panel>.content>.media.two{padding-bottom:0!important;height:auto}.panel>.content>.media.two>a,.panel>.content>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.three{padding-bottom:0!important;height:auto}.panel>.content>.media.three>a,.panel>.content>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.four{padding-bottom:0!important;height:auto}.panel>.content>.media.four>a,.panel>.content>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.five{padding-bottom:0!important;height:auto}.panel>.content>.media.five>a,.panel>.content>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.six{padding-bottom:0!important;height:auto}.panel>.content>.media.six>a,.panel>.content>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.seven{padding-bottom:0!important;height:auto}.panel>.content>.media.seven>a,.panel>.content>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.eight{padding-bottom:0!important;height:auto}.panel>.content>.media.eight>a,.panel>.content>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.nine{padding-bottom:0!important;height:auto}.panel>.content>.media.nine>a,.panel>.content>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.ten{padding-bottom:0!important;height:auto}.panel>.content>.media.ten>a,.panel>.content>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.eleven{padding-bottom:0!important;height:auto}.panel>.content>.media.eleven>a,.panel>.content>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.twelve{padding-bottom:0!important;height:auto}.panel>.content>.media.twelve>a,.panel>.content>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.thirteen{padding-bottom:0!important;height:auto}.panel>.content>.media.thirteen>a,.panel>.content>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.fourteen{padding-bottom:0!important;height:auto}.panel>.content>.media.fourteen>a,.panel>.content>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.fifteen{padding-bottom:0!important;height:auto}.panel>.content>.media.fifteen>a,.panel>.content>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.sixteen{padding-bottom:0!important;height:auto}.panel>.content>.media.sixteen>a,.panel>.content>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content .headline,.panel>.content p.headline{font-size:1.39em;line-height:1.5;margin-bottom:26px;color:#171819;letter-spacing:-.0158em}.panel>.bottom{min-height:50px;border-top:1px solid #c6c6c6;padding:6px}.process{-ms-flex-wrap:nowrap;flex-wrap:nowrap;margin:1em 0 5em;width:100%;list-style:none}.process,.process .item{display:-webkit-box;display:-ms-flexbox;display:flex}.process .item{-webkit-box-flex:1;-ms-flex:1 1 0px;flex:1 1 0;min-height:4rem;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;word-break:break-word;line-height:1.3;text-align:center}.process .item:not(:first-child):before{background:#0a8fff;content:"";height:6px;left:-50%;position:absolute;top:0;width:100%}.process .item a{color:#3f4143;display:inline-block;padding:10px 10px 0;text-decoration:none;font-weight:700}.process .item a:before{position:absolute;content:"";background:#0a8fff;top:0;left:50%;height:.8rem;width:3px;z-index:1}.process .item a:first-child:before{left:calc(50% - 2px)}.process .item.active a{color:#0a8fff;font-weight:700}.process .item.active a:after{content:"beenhere";font-family:Material Icons;position:absolute;top:calc(-15px - 1.8rem);left:calc(50% - 15px);color:#0a8fff;font-size:1.8rem}.process .item.active~.item:before{background:#c6c6c6}.process .item.active~.item a{color:#77878b}.process .item.active~.item a:hover{color:#0d0f0f}.process .item.active~.item a:before{background:#c6c6c6}.process.success .item:not(:first-child):before{background:#2ec4b6}.process.success .item a{padding:10px}.process.success .item a:before{background:#2ec4b6}.process.success .item.active a,.process.success .item.active a:after{color:#2ec4b6}.process.success .item.active~.item:before{background:#c6c6c6}.process.warning .item:not(:first-child):before{background:#de9e36}.process.warning .item a{padding:10px}.process.warning .item a:before{background:#de9e36}.process.warning .item.active a,.process.warning .item.active a:after{color:#de9e36}.process.warning .item.active~.item:before{background:#c6c6c6}.process.error .item:not(:first-child):before{background:#d62828}.process.error .item a{padding:10px}.process.error .item a:before{background:#d62828}.process.error .item.active a,.process.error .item.active a:after{color:#d62828}.process.error .item.active~.item:before{background:#c6c6c6}.process.dark .item:not(:first-child):before{background:#414552}.process.dark .item a{padding:10px}.process.dark .item a:before{background:#414552}.process.dark .item.active a,.process.dark .item.active a:after{color:#414552}.process.dark .item.active~.item:before{background:#c6c6c6}.process.vertical{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;margin:1em 0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.process.vertical .item{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:100%;min-width:100%;border-bottom:1px solid #c6c6c6;border-right:1px solid #c6c6c6;padding-left:20px}.process.vertical .item:first-child{border-top:1px solid #c6c6c6}.process.vertical .item:not(:first-child):before{width:3px;height:100%;left:0}.process.vertical .item a:before{width:9px}.process.vertical .item a:first-child:before{left:0;height:100%}.process.vertical .item.active a{font-weight:700}.process.vertical .item.active a:after{top:15px;left:calc(-15px - 1.8rem)}.process.vertical.reversed{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.process.vertical.reversed .item:last-child{border-top:1px solid #c6c6c6}.process.vertical.reversed .item:first-child{border-top:none}@media only screen and (max-width:768px){.process{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;margin:1em 0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.process .item{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:100%;min-width:100%;border-bottom:1px solid #c6c6c6;border-right:1px solid #c6c6c6;padding-left:20px}.process .item:first-child{border-top:1px solid #c6c6c6}.process .item:not(:first-child):before{width:3px;height:100%;left:0}.process .item a:before{width:9px}.process .item a:first-child:before{left:0;height:100%}.process .item.active a{font-weight:700}.process .item.active a:after{top:15px;left:calc(-15px - 1.8rem)}.process.reversed{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.process.reversed .item:last-child{border-top:1px solid #c6c6c6}.process.reversed .item:first-child{border-top:none}}.progress{width:100%;height:12px;background:#e6e6e6;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.15) inset;box-shadow:inset 0 1px 2px rgba(0,0,0,.15);border-radius:16px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.progress::-webkit-progress-bar{background:transparent;border-radius:16px}.progress::-webkit-progress-value{background:#0a8fff;border-radius:16px}.progress::-moz-progress-bar{background:#0a8fff;border-radius:16px}.progress.success::-webkit-progress-value{background:#2ec4b6}.progress.warning::-webkit-progress-value{background:#de9e36}.progress.error::-webkit-progress-value{background:#d62828}.progress.dark::-webkit-progress-value{background:#414552}.tab{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;border-bottom:2px solid #e6e6e6;padding:0}.tab>.buttons{-webkit-box-shadow:none;box-shadow:none;border-radius:0}.tab>.button,.tab>.buttons>.button,.tab>.buttons>.dropdown>.button,.tab>.buttons>.dropdown>a.button,.tab>.buttons>a.button,.tab>.dropdown>.button,.tab>.dropdown>a.button,.tab>a.button{background:transparent;border:none;border-bottom:2px solid transparent;border-radius:0!important;margin-bottom:-2px;line-height:normal;font-size:1.025em;font-weight:400;-webkit-transition:border-bottom-color,color .2s;transition:border-bottom-color,color .2s;color:#6b7a7d;padding:.935rem 1.4rem}.tab>.button:hover,.tab>.buttons>.button:hover,.tab>.buttons>.dropdown>.button:hover,.tab>.buttons>.dropdown>a.button:hover,.tab>.buttons>a.button:hover,.tab>.dropdown>.button:hover,.tab>.dropdown>a.button:hover,.tab>a.button:hover{color:#2b2d2e;border-bottom-color:#bdbdbd;-webkit-transition:border-bottom-color,color .2s;transition:border-bottom-color,color .2s}.tab>.button.disabled,.tab>.buttons>.button.disabled,.tab>.buttons>.dropdown>.button.disabled,.tab>.buttons>.dropdown>a.button.disabled,.tab>.buttons>a.button.disabled,.tab>.dropdown>.button.disabled,.tab>.dropdown>a.button.disabled,.tab>a.button.disabled{opacity:.45}.tab>.button.active,.tab>.buttons>.button.active,.tab>.buttons>.dropdown>.button.active,.tab>.buttons>.dropdown>a.button.active,.tab>.buttons>a.button.active,.tab>.dropdown>.button.active,.tab>.dropdown>a.button.active,.tab>a.button.active{color:#0a8fff;border-bottom-color:#0a8fff;font-weight:700}.tab>.button.active [class^=material-icons],.tab>.button.active i,.tab>.buttons>.button.active [class^=material-icons],.tab>.buttons>.button.active i,.tab>.buttons>.dropdown>.button.active [class^=material-icons],.tab>.buttons>.dropdown>.button.active i,.tab>.buttons>.dropdown>a.button.active [class^=material-icons],.tab>.buttons>.dropdown>a.button.active i,.tab>.buttons>a.button.active [class^=material-icons],.tab>.buttons>a.button.active i,.tab>.dropdown>.button.active [class^=material-icons],.tab>.dropdown>.button.active i,.tab>.dropdown>a.button.active [class^=material-icons],.tab>.dropdown>a.button.active i,.tab>a.button.active [class^=material-icons],.tab>a.button.active i{color:initial}.tab.success .button.active,.tab.success .dropdown .button.active,.tab.success .dropdown a.button.active,.tab.success a.button.active{color:#2ec4b6;border-bottom-color:#2ec4b6}.tab.warning .button.active,.tab.warning .dropdown .button.active,.tab.warning .dropdown a.button.active,.tab.warning a.button.active{color:#de9e36;border-bottom-color:#de9e36}.tab.error .button.active,.tab.error .dropdown .button.active,.tab.error .dropdown a.button.active,.tab.error a.button.active{color:#d62828;border-bottom-color:#d62828}.tab.dark .button.active,.tab.dark .dropdown .button.active,.tab.dark .dropdown a.button.active,.tab.dark a.button.active{color:#414552;border-bottom-color:#414552}.timeline .activity{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;position:relative;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.timeline .activity:before{content:"";display:block;position:absolute;top:0;bottom:0;left:0;width:1px;background-color:#c6c6c6}.timeline .activity:target .type{border-color:#0a8fff;-webkit-box-shadow:0 0 .2em #0a8fff;box-shadow:0 0 .2em #0a8fff}.timeline .activity .type{position:absolute;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;width:32px;height:32px;top:13px;left:-15px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#e6e6e6;border:2px solid #c6c6c6;border-radius:50%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-negative:0;flex-shrink:0;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15)}.timeline .activity .type.primary{background-color:#0a8fff;color:#fff;border-color:#0082f0}.timeline .activity .type.success{background-color:#2ec4b6;color:#fff;border-color:#29afa3}.timeline .activity .type.warning{background-color:#de9e36;color:#fff;border-color:#d79323}.timeline .activity .type.error{background-color:#d62828;color:#fff;border-color:#c12424}.timeline .activity .type.dark{background-color:#414552;color:#fff;border-color:#363944}.timeline .activity .actions,.timeline .activity .author,.timeline .activity .body,.timeline .activity .date,.timeline .activity .media{min-width:0;max-width:100%;color:#3f4143;-webkit-box-flex:1;-ms-flex:auto;flex:auto;margin-left:10px;width:100%}.timeline .activity .author{font-weight:700;font-size:1rem;color:#212223}.timeline .activity .date{font-size:.9em;opacity:.6}.timeline .activity .media{margin-top:16px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative;padding-bottom:56.25%!important;height:0;overflow:hidden;max-width:100%;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.timeline .activity .media embed,.timeline .activity .media iframe,.timeline .activity .media object{position:absolute;top:0;left:0;width:100%;height:100%}.timeline .activity .media video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.timeline .activity .media img{display:block}.timeline .activity>.media.two{padding-bottom:0!important;height:auto}.timeline .activity>.media.two>a,.timeline .activity>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.three{padding-bottom:0!important;height:auto}.timeline .activity>.media.three>a,.timeline .activity>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.four{padding-bottom:0!important;height:auto}.timeline .activity>.media.four>a,.timeline .activity>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.five{padding-bottom:0!important;height:auto}.timeline .activity>.media.five>a,.timeline .activity>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.six{padding-bottom:0!important;height:auto}.timeline .activity>.media.six>a,.timeline .activity>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.seven{padding-bottom:0!important;height:auto}.timeline .activity>.media.seven>a,.timeline .activity>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.eight{padding-bottom:0!important;height:auto}.timeline .activity>.media.eight>a,.timeline .activity>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.nine{padding-bottom:0!important;height:auto}.timeline .activity>.media.nine>a,.timeline .activity>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.ten{padding-bottom:0!important;height:auto}.timeline .activity>.media.ten>a,.timeline .activity>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.eleven{padding-bottom:0!important;height:auto}.timeline .activity>.media.eleven>a,.timeline .activity>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.twelve{padding-bottom:0!important;height:auto}.timeline .activity>.media.twelve>a,.timeline .activity>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.thirteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.thirteen>a,.timeline .activity>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.fourteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.fourteen>a,.timeline .activity>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.fifteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.fifteen>a,.timeline .activity>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.sixteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.sixteen>a,.timeline .activity>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity .actions{margin-top:16px}.timeline .activity:last-child:before{background:-webkit-gradient(linear,left top,left bottom,color-stop(45%,#c6c6c6),to(hsla(0,0%,100%,0)));background:linear-gradient(180deg,#c6c6c6 45%,hsla(0,0%,100%,0))}.timeline .activity:first-child:before{background:-webkit-gradient(linear,left bottom,left top,color-stop(45%,#c6c6c6),to(hsla(0,0%,100%,0)));background:linear-gradient(0deg,#c6c6c6 45%,hsla(0,0%,100%,0))}.tooltip{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;cursor:default}.tooltip .text{position:absolute;color:#fff;font-size:.9em;text-align:center;visibility:hidden;background-color:#414552;border-radius:4px;min-width:100px;max-width:180px;padding:5px;top:120%;opacity:0;-webkit-transition:opacity .18s;transition:opacity .18s;z-index:1}.tooltip .text:after{content:"";position:absolute;top:auto;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:transparent transparent #414552}.tooltip:hover .text{visibility:visible;opacity:1}.m-0{margin:0!important}.m-5{margin:5px!important}.m-10{margin:10px!important}.m-15{margin:15px!important}.m-20{margin:20px!important}.m-30{margin:30px!important}.m-40{margin:40px!important}.m-50{margin:50px!important}.mt-0{margin-top:0!important}.mt-5{margin-top:5px!important}.mt-10{margin-top:10px!important}.mt-15{margin-top:15px!important}.mt-20{margin-top:20px!important}.mt-30{margin-top:30px!important}.mt-40{margin-top:40px!important}.mt-50{margin-top:50px!important}.mr-0{margin-right:0!important}.mr-5{margin-right:5px!important}.mr-10{margin-right:10px!important}.mr-15{margin-right:15px!important}.mr-20{margin-right:20px!important}.mr-30{margin-right:30px!important}.mr-40{margin-right:40px!important}.mr-50{margin-right:50px!important}.mb-0{margin-bottom:0!important}.mb-5{margin-bottom:5px!important}.mb-10{margin-bottom:10px!important}.mb-15{margin-bottom:15px!important}.mb-20{margin-bottom:20px!important}.mb-30{margin-bottom:30px!important}.mb-40{margin-bottom:40px!important}.mb-50{margin-bottom:50px!important}.ml-0{margin-left:0!important}.ml-5{margin-left:5px!important}.ml-10{margin-left:10px!important}.ml-15{margin-left:15px!important}.ml-20{margin-left:20px!important}.ml-30{margin-left:30px!important}.ml-40{margin-left:40px!important}.ml-50{margin-left:50px!important}.m-auto{margin:auto!important}.mt-auto{margin-top:auto!important}.mr-auto{margin-right:auto!important}.mb-auto{margin-bottom:auto!important}.ml-auto{margin-left:auto!important}.p-0{padding:0!important}.p-5{padding:5px!important}.p-10{padding:10px!important}.p-15{padding:15px!important}.p-20{padding:20px!important}.p-30{padding:30px!important}.p-40{padding:40px!important}.p-50{padding:50px!important}.pt-0{padding-top:0!important}.pt-5{padding-top:5px!important}.pt-10{padding-top:10px!important}.pt-15{padding-top:15px!important}.pt-20{padding-top:20px!important}.pt-30{padding-top:30px!important}.pt-40{padding-top:40px!important}.pt-50{padding-top:50px!important}.pr-0{padding-right:0!important}.pr-5{padding-right:5px!important}.pr-10{padding-right:10px!important}.pr-15{padding-right:15px!important}.pr-20{padding-right:20px!important}.pr-30{padding-right:30px!important}.pr-40{padding-right:40px!important}.pr-50{padding-right:50px!important}.pb-0{padding-bottom:0!important}.pb-5{padding-bottom:5px!important}.pb-10{padding-bottom:10px!important}.pb-15{padding-bottom:15px!important}.pb-20{padding-bottom:20px!important}.pb-30{padding-bottom:30px!important}.pb-40{padding-bottom:40px!important}.pb-50{padding-bottom:50px!important}.pl-0{padding-left:0!important}.pl-5{padding-left:5px!important}.pl-10{padding-left:10px!important}.pl-15{padding-left:15px!important}.pl-20{padding-left:20px!important}.pl-30{padding-left:30px!important}.pl-40{padding-left:40px!important}.pl-50{padding-left:50px!important}.p-auto{padding:auto!important}.pt-auto{padding-top:auto!important}.pr-auto{padding-right:auto!important}.pb-auto{padding-bottom:auto!important}.pl-auto{padding-left:auto!important}.fw-100{font-weight:100!important}.fw-200{font-weight:200!important}.fw-300{font-weight:300!important}.fw-400{font-weight:400!important}.fw-500{font-weight:500!important}.fw-600{font-weight:600!important}.fw-700{font-weight:700!important}.fw-800{font-weight:800!important}.fw-900{font-weight:900!important}.mini-text{font-size:60%!important}.tiny-text{font-size:73%!important}.small-text{font-size:85%!important}.large-text{font-size:120%!important}.big-text{font-size:175%!important}.huge-text{font-size:200%!important}.giant-text{font-size:350%!important}.color-grey{color:#77878b!important}.color-white{color:#fff!important}.color-black{color:#000!important}.color-primary{color:#0a8fff!important}.color-success{color:#2ec4b6!important}.color-warning{color:#de9e36!important}.color-error{color:#d62828!important}.bg-grey{background-color:#77878b!important}.bg-secondary{background-color:#e6e6e6!important}.bg-white{background-color:#fff!important}.bg-black{background-color:#3f4143!important}.bg-dark{background-color:#414552!important}.bg-primary{background-color:#0a8fff!important}.bg-success{background-color:#2ec4b6!important}.bg-warning{background-color:#de9e36!important}.bg-error{background-color:#d62828!important}.bg-grid{height:100%;background-color:#fff;background-position:50%;background-image:-webkit-gradient(linear,left top,right top,color-stop(1%,#8ac9ff),color-stop(16%,transparent)),-webkit-gradient(linear,left top,left bottom,color-stop(1%,#8ac9ff),color-stop(16%,transparent));background-image:linear-gradient(90deg,#8ac9ff 1%,transparent 16%),linear-gradient(#8ac9ff 1%,transparent 16%);background-size:10px 10px}.bg-stripe{height:100%;background-image:linear-gradient(#fff,#fff 7px,#0a8fff 0,#dbdbdb);background-size:100% 8px}.cursor-alias{cursor:alias!important}.cursor-default{cursor:default!important}.cursor-grab{cursor:-webkit-grab!important;cursor:grab!important}.cursor-help{cursor:help!important}.cursor-move{cursor:move!important}.cursor-pointer{cursor:pointer!important}.cursor-wait{cursor:wait!important}.cursor-zoom-in{cursor:-webkit-zoom-in!important;cursor:zoom-in!important}.cursor-zoom-out{cursor:-webkit-zoom-out!important;cursor:zoom-out!important}.display-inline{display:inline!important}.display-flex{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important}.display-inline-flex{display:-webkit-inline-box!important;display:-ms-inline-flexbox!important;display:inline-flex!important}.display-grid{display:grid!important}.display-inline-grid{display:inline-grid!important}.display-block{display:block!important}.display-inline-block{display:inline-block!important}.display-table{display:table!important}.display-inline-table{display:inline-table!important}.display-table-row{display:table-row!important}.display-table-column{display:table-column!important}.display-table-cell{display:table-cell!important}.align-items-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.align-items-flex-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.align-items-flex-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.align-items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.align-items-stretch{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.align-items-initial{-webkit-box-align:initial;-ms-flex-align:initial;align-items:initial}.align-items-inherit{-webkit-box-align:inherit;-ms-flex-align:inherit;align-items:inherit}.align-self-auto{-ms-flex-item-align:auto;align-self:auto}.align-self-baseline{-ms-flex-item-align:baseline;align-self:baseline}.align-self-flex-start{-ms-flex-item-align:start;align-self:flex-start}.align-self-flex-end{-ms-flex-item-align:end;align-self:flex-end}.align-self-center{-ms-flex-item-align:center;align-self:center}.align-self-stretch{-ms-flex-item-align:stretch;align-self:stretch}.align-self-initial{-ms-flex-item-align:initial;align-self:auto}.align-self-inherit{-ms-flex-item-align:inherit;align-self:inherit}.justify-content-baseline{-webkit-box-pack:baseline;-ms-flex-pack:baseline;justify-content:baseline}.justify-content-flex-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-content-flex-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-content-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-content-space-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-content-space-around{-ms-flex-pack:distribute;justify-content:space-around}.justify-content-initial{-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:initial}.justify-content-inherit{-webkit-box-pack:inherit;-ms-flex-pack:inherit;justify-content:inherit}.filter-invert{-webkit-filter:invert(100%);filter:invert(100%)}.filter-gray{-webkit-filter:grayscale(100%);filter:grayscale(100%)}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-x-visible{overflow-x:visible}.overflow-x-scroll{overflow-x:scroll}.overflow-y-auto{overflow-y:auto}.overflow-y-hidden{overflow-y:hidden}.overflow-y-visible{overflow-y:visible}.overflow-y-scroll{overflow-y:scroll}.position-static{position:static}.position-absolute{position:absolute}.position-fixed{position:fixed}.position-relative{position:relative}.position-sticky{position:-webkit-sticky;position:sticky}.position-initial{position:static}.position-inherit{position:inherit}.z--1{z-index:-1!important}.z-0{z-index:0!important}.z-1{z-index:1!important}.z-10{z-index:10!important}.z-20{z-index:20!important}.z-30{z-index:30!important}.z-40{z-index:40!important}.z-50{z-index:50!important}.z-100{z-index:100!important}.z-999{z-index:999!important}.z-9999{z-index:9999!important}.flex-direction-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.flex-direction-row-reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.flex-direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.flex-direction-column-reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-direction-initial{-webkit-box-orient:initial;-webkit-box-direction:initial;-ms-flex-direction:initial;flex-direction:row}.flex-direction-inherit{-webkit-box-orient:inherit;-webkit-box-direction:inherit;-ms-flex-direction:inherit;flex-direction:inherit}.user-select-none{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.user-select-auto{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.user-select-text{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.user-select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.top-0{top:0}.top-auto{top:auto}.bottom-0{bottom:0}.bottom-auto{bottom:auto}.left-0{left:0}.left-auto{left:auto}.right-0{right:0}.right-auto{right:auto}.line-height-0{line-height:0!important}.line-height-1{line-height:1!important}.line-height-2{line-height:2!important}.line-height-3{line-height:3!important}.line-height-4{line-height:4!important}.line-height-5{line-height:5!important}.radius-4{border-radius:4px!important}.radius-8{border-radius:8px!important}.radius-10{border-radius:10px!important}.radius-12{border-radius:12px!important}.radius-14{border-radius:14px!important}.centered{margin:0 auto}.align.right{text-align:right!important}.align.left{text-align:left!important}.align.center{text-align:center!important}.align.justify{text-align:justify!important}.float.right{float:right}.float.left{float:left}.full.width{width:100%;max-width:100%;min-width:100%}.full.height{height:100%;min-height:100%;max-height:100%}.fade{opacity:0}.hide{display:none}.spacer{-webkit-box-flex:1!important;-ms-flex-positive:1!important;flex-grow:1!important;outline:none}.avatar{display:inline-block;border-radius:50%}.reset{padding:0!important;margin:0!important}.reverse{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);-ms-transform:rotateY(180deg);unicode-bidi:bidi-override;direction:rtl}.truncate{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transparent{background:transparent!important}.pure,.pure>div{background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none}.bordered{border:1px solid #c6c6c6!important}.borderless{border:none!important}.rounded{border-radius:4px}.radiusless{border-radius:0!important}.shadowed{-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15)}.shadowless{-webkit-box-shadow:none!important;box-shadow:none!important}.inset-0{top:0;right:0;bottom:0;left:0}.inset-auto{top:auto;right:auto;bottom:auto;left:auto} \ No newline at end of file +@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;900&display=swap);*,:after,:before{-webkit-box-sizing:inherit;box-sizing:inherit}*{margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;text-shadow:1px 1px 1px rgba(0,0,0,.004)!important}html{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:13px;font-weight:400;line-height:1.7;color:#3f4143;background-color:#fff}body,html{min-height:100%;height:100%;padding:0;margin:0;border:none}::-moz-selection{background-color:#0a8fff;color:#fff}::selection{background-color:#0a8fff;color:#fff}::-webkit-input-placeholder{color:#3f4143;opacity:.5}::-moz-placeholder{color:#3f4143;opacity:.5}::-ms-input-placeholder{color:#3f4143;opacity:.5}::placeholder{color:#3f4143;opacity:.5}a{color:#3f4143;outline:none;text-decoration:none}a.active,a:active,a:focus,a:hover{color:#007ae0;text-decoration:underline}a:visited{color:#3f4143}hr{margin:15px 0;background-color:#c6c6c6;border:none;height:1px}ol,ul{padding:0}ol,ol ol,ol ul,ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ol{list-style:decimal inside}dl dt{font-weight:700}canvas,embed,img,object,video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}img{border-style:none}iframe{outline:0}:not(pre)>code,:not(pre)>kbd,:not(pre)>samp{color:#d62828;white-space:nowrap;padding:2px 6px;font-size:.935em}.container{width:100%;margin:0 auto;padding:0 40px}.row{display:grid;grid-gap:6px;grid-template-columns:repeat(16,1fr)}.row>[class^=col]{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:.3rem;min-height:.125rem}.row.equal>[class^=col]{height:auto}@media only screen and (max-width:768px){.container{padding:0 13.33333px}}@media only screen and (min-width:0){.col-1,.col-xs-1{grid-column:span 1}.col-xs-1.offset-xs-2{grid-column:2/span 1}.col-xs-1.offset-xs-3{grid-column:3/span 1}.col-xs-1.offset-xs-4{grid-column:4/span 1}.col-xs-1.offset-xs-5{grid-column:5/span 1}.col-xs-1.offset-xs-6{grid-column:6/span 1}.col-xs-1.offset-xs-7{grid-column:7/span 1}.col-xs-1.offset-xs-8{grid-column:8/span 1}.col-xs-1.offset-xs-9{grid-column:9/span 1}.col-xs-1.offset-xs-10{grid-column:10/span 1}.col-xs-1.offset-xs-11{grid-column:11/span 1}.col-xs-1.offset-xs-12{grid-column:12/span 1}.col-xs-1.offset-xs-13{grid-column:13/span 1}.col-xs-1.offset-xs-14{grid-column:14/span 1}.col-xs-1.offset-xs-15{grid-column:15/span 1}.col-xs-1.offset-xs-16{grid-column:16/span 1}.col-2,.col-xs-2{grid-column:span 2}.col-xs-2.offset-xs-2{grid-column:2/span 2}.col-xs-2.offset-xs-3{grid-column:3/span 2}.col-xs-2.offset-xs-4{grid-column:4/span 2}.col-xs-2.offset-xs-5{grid-column:5/span 2}.col-xs-2.offset-xs-6{grid-column:6/span 2}.col-xs-2.offset-xs-7{grid-column:7/span 2}.col-xs-2.offset-xs-8{grid-column:8/span 2}.col-xs-2.offset-xs-9{grid-column:9/span 2}.col-xs-2.offset-xs-10{grid-column:10/span 2}.col-xs-2.offset-xs-11{grid-column:11/span 2}.col-xs-2.offset-xs-12{grid-column:12/span 2}.col-xs-2.offset-xs-13{grid-column:13/span 2}.col-xs-2.offset-xs-14{grid-column:14/span 2}.col-xs-2.offset-xs-15{grid-column:15/span 2}.col-xs-2.offset-xs-16{grid-column:16/span 2}.col-3,.col-xs-3{grid-column:span 3}.col-xs-3.offset-xs-2{grid-column:2/span 3}.col-xs-3.offset-xs-3{grid-column:3/span 3}.col-xs-3.offset-xs-4{grid-column:4/span 3}.col-xs-3.offset-xs-5{grid-column:5/span 3}.col-xs-3.offset-xs-6{grid-column:6/span 3}.col-xs-3.offset-xs-7{grid-column:7/span 3}.col-xs-3.offset-xs-8{grid-column:8/span 3}.col-xs-3.offset-xs-9{grid-column:9/span 3}.col-xs-3.offset-xs-10{grid-column:10/span 3}.col-xs-3.offset-xs-11{grid-column:11/span 3}.col-xs-3.offset-xs-12{grid-column:12/span 3}.col-xs-3.offset-xs-13{grid-column:13/span 3}.col-xs-3.offset-xs-14{grid-column:14/span 3}.col-xs-3.offset-xs-15{grid-column:15/span 3}.col-xs-3.offset-xs-16{grid-column:16/span 3}.col-4,.col-xs-4{grid-column:span 4}.col-xs-4.offset-xs-2{grid-column:2/span 4}.col-xs-4.offset-xs-3{grid-column:3/span 4}.col-xs-4.offset-xs-4{grid-column:4/span 4}.col-xs-4.offset-xs-5{grid-column:5/span 4}.col-xs-4.offset-xs-6{grid-column:6/span 4}.col-xs-4.offset-xs-7{grid-column:7/span 4}.col-xs-4.offset-xs-8{grid-column:8/span 4}.col-xs-4.offset-xs-9{grid-column:9/span 4}.col-xs-4.offset-xs-10{grid-column:10/span 4}.col-xs-4.offset-xs-11{grid-column:11/span 4}.col-xs-4.offset-xs-12{grid-column:12/span 4}.col-xs-4.offset-xs-13{grid-column:13/span 4}.col-xs-4.offset-xs-14{grid-column:14/span 4}.col-xs-4.offset-xs-15{grid-column:15/span 4}.col-xs-4.offset-xs-16{grid-column:16/span 4}.col-5,.col-xs-5{grid-column:span 5}.col-xs-5.offset-xs-2{grid-column:2/span 5}.col-xs-5.offset-xs-3{grid-column:3/span 5}.col-xs-5.offset-xs-4{grid-column:4/span 5}.col-xs-5.offset-xs-5{grid-column:5/span 5}.col-xs-5.offset-xs-6{grid-column:6/span 5}.col-xs-5.offset-xs-7{grid-column:7/span 5}.col-xs-5.offset-xs-8{grid-column:8/span 5}.col-xs-5.offset-xs-9{grid-column:9/span 5}.col-xs-5.offset-xs-10{grid-column:10/span 5}.col-xs-5.offset-xs-11{grid-column:11/span 5}.col-xs-5.offset-xs-12{grid-column:12/span 5}.col-xs-5.offset-xs-13{grid-column:13/span 5}.col-xs-5.offset-xs-14{grid-column:14/span 5}.col-xs-5.offset-xs-15{grid-column:15/span 5}.col-xs-5.offset-xs-16{grid-column:16/span 5}.col-6,.col-xs-6{grid-column:span 6}.col-xs-6.offset-xs-2{grid-column:2/span 6}.col-xs-6.offset-xs-3{grid-column:3/span 6}.col-xs-6.offset-xs-4{grid-column:4/span 6}.col-xs-6.offset-xs-5{grid-column:5/span 6}.col-xs-6.offset-xs-6{grid-column:6/span 6}.col-xs-6.offset-xs-7{grid-column:7/span 6}.col-xs-6.offset-xs-8{grid-column:8/span 6}.col-xs-6.offset-xs-9{grid-column:9/span 6}.col-xs-6.offset-xs-10{grid-column:10/span 6}.col-xs-6.offset-xs-11{grid-column:11/span 6}.col-xs-6.offset-xs-12{grid-column:12/span 6}.col-xs-6.offset-xs-13{grid-column:13/span 6}.col-xs-6.offset-xs-14{grid-column:14/span 6}.col-xs-6.offset-xs-15{grid-column:15/span 6}.col-xs-6.offset-xs-16{grid-column:16/span 6}.col-7,.col-xs-7{grid-column:span 7}.col-xs-7.offset-xs-2{grid-column:2/span 7}.col-xs-7.offset-xs-3{grid-column:3/span 7}.col-xs-7.offset-xs-4{grid-column:4/span 7}.col-xs-7.offset-xs-5{grid-column:5/span 7}.col-xs-7.offset-xs-6{grid-column:6/span 7}.col-xs-7.offset-xs-7{grid-column:7/span 7}.col-xs-7.offset-xs-8{grid-column:8/span 7}.col-xs-7.offset-xs-9{grid-column:9/span 7}.col-xs-7.offset-xs-10{grid-column:10/span 7}.col-xs-7.offset-xs-11{grid-column:11/span 7}.col-xs-7.offset-xs-12{grid-column:12/span 7}.col-xs-7.offset-xs-13{grid-column:13/span 7}.col-xs-7.offset-xs-14{grid-column:14/span 7}.col-xs-7.offset-xs-15{grid-column:15/span 7}.col-xs-7.offset-xs-16{grid-column:16/span 7}.col-8,.col-xs-8{grid-column:span 8}.col-xs-8.offset-xs-2{grid-column:2/span 8}.col-xs-8.offset-xs-3{grid-column:3/span 8}.col-xs-8.offset-xs-4{grid-column:4/span 8}.col-xs-8.offset-xs-5{grid-column:5/span 8}.col-xs-8.offset-xs-6{grid-column:6/span 8}.col-xs-8.offset-xs-7{grid-column:7/span 8}.col-xs-8.offset-xs-8{grid-column:8/span 8}.col-xs-8.offset-xs-9{grid-column:9/span 8}.col-xs-8.offset-xs-10{grid-column:10/span 8}.col-xs-8.offset-xs-11{grid-column:11/span 8}.col-xs-8.offset-xs-12{grid-column:12/span 8}.col-xs-8.offset-xs-13{grid-column:13/span 8}.col-xs-8.offset-xs-14{grid-column:14/span 8}.col-xs-8.offset-xs-15{grid-column:15/span 8}.col-xs-8.offset-xs-16{grid-column:16/span 8}.col-9,.col-xs-9{grid-column:span 9}.col-xs-9.offset-xs-2{grid-column:2/span 9}.col-xs-9.offset-xs-3{grid-column:3/span 9}.col-xs-9.offset-xs-4{grid-column:4/span 9}.col-xs-9.offset-xs-5{grid-column:5/span 9}.col-xs-9.offset-xs-6{grid-column:6/span 9}.col-xs-9.offset-xs-7{grid-column:7/span 9}.col-xs-9.offset-xs-8{grid-column:8/span 9}.col-xs-9.offset-xs-9{grid-column:9/span 9}.col-xs-9.offset-xs-10{grid-column:10/span 9}.col-xs-9.offset-xs-11{grid-column:11/span 9}.col-xs-9.offset-xs-12{grid-column:12/span 9}.col-xs-9.offset-xs-13{grid-column:13/span 9}.col-xs-9.offset-xs-14{grid-column:14/span 9}.col-xs-9.offset-xs-15{grid-column:15/span 9}.col-xs-9.offset-xs-16{grid-column:16/span 9}.col-10,.col-xs-10{grid-column:span 10}.col-xs-10.offset-xs-2{grid-column:2/span 10}.col-xs-10.offset-xs-3{grid-column:3/span 10}.col-xs-10.offset-xs-4{grid-column:4/span 10}.col-xs-10.offset-xs-5{grid-column:5/span 10}.col-xs-10.offset-xs-6{grid-column:6/span 10}.col-xs-10.offset-xs-7{grid-column:7/span 10}.col-xs-10.offset-xs-8{grid-column:8/span 10}.col-xs-10.offset-xs-9{grid-column:9/span 10}.col-xs-10.offset-xs-10{grid-column:10/span 10}.col-xs-10.offset-xs-11{grid-column:11/span 10}.col-xs-10.offset-xs-12{grid-column:12/span 10}.col-xs-10.offset-xs-13{grid-column:13/span 10}.col-xs-10.offset-xs-14{grid-column:14/span 10}.col-xs-10.offset-xs-15{grid-column:15/span 10}.col-xs-10.offset-xs-16{grid-column:16/span 10}.col-11,.col-xs-11{grid-column:span 11}.col-xs-11.offset-xs-2{grid-column:2/span 11}.col-xs-11.offset-xs-3{grid-column:3/span 11}.col-xs-11.offset-xs-4{grid-column:4/span 11}.col-xs-11.offset-xs-5{grid-column:5/span 11}.col-xs-11.offset-xs-6{grid-column:6/span 11}.col-xs-11.offset-xs-7{grid-column:7/span 11}.col-xs-11.offset-xs-8{grid-column:8/span 11}.col-xs-11.offset-xs-9{grid-column:9/span 11}.col-xs-11.offset-xs-10{grid-column:10/span 11}.col-xs-11.offset-xs-11{grid-column:11/span 11}.col-xs-11.offset-xs-12{grid-column:12/span 11}.col-xs-11.offset-xs-13{grid-column:13/span 11}.col-xs-11.offset-xs-14{grid-column:14/span 11}.col-xs-11.offset-xs-15{grid-column:15/span 11}.col-xs-11.offset-xs-16{grid-column:16/span 11}.col-12,.col-xs-12{grid-column:span 12}.col-xs-12.offset-xs-2{grid-column:2/span 12}.col-xs-12.offset-xs-3{grid-column:3/span 12}.col-xs-12.offset-xs-4{grid-column:4/span 12}.col-xs-12.offset-xs-5{grid-column:5/span 12}.col-xs-12.offset-xs-6{grid-column:6/span 12}.col-xs-12.offset-xs-7{grid-column:7/span 12}.col-xs-12.offset-xs-8{grid-column:8/span 12}.col-xs-12.offset-xs-9{grid-column:9/span 12}.col-xs-12.offset-xs-10{grid-column:10/span 12}.col-xs-12.offset-xs-11{grid-column:11/span 12}.col-xs-12.offset-xs-12{grid-column:12/span 12}.col-xs-12.offset-xs-13{grid-column:13/span 12}.col-xs-12.offset-xs-14{grid-column:14/span 12}.col-xs-12.offset-xs-15{grid-column:15/span 12}.col-xs-12.offset-xs-16{grid-column:16/span 12}.col-13,.col-xs-13{grid-column:span 13}.col-xs-13.offset-xs-2{grid-column:2/span 13}.col-xs-13.offset-xs-3{grid-column:3/span 13}.col-xs-13.offset-xs-4{grid-column:4/span 13}.col-xs-13.offset-xs-5{grid-column:5/span 13}.col-xs-13.offset-xs-6{grid-column:6/span 13}.col-xs-13.offset-xs-7{grid-column:7/span 13}.col-xs-13.offset-xs-8{grid-column:8/span 13}.col-xs-13.offset-xs-9{grid-column:9/span 13}.col-xs-13.offset-xs-10{grid-column:10/span 13}.col-xs-13.offset-xs-11{grid-column:11/span 13}.col-xs-13.offset-xs-12{grid-column:12/span 13}.col-xs-13.offset-xs-13{grid-column:13/span 13}.col-xs-13.offset-xs-14{grid-column:14/span 13}.col-xs-13.offset-xs-15{grid-column:15/span 13}.col-xs-13.offset-xs-16{grid-column:16/span 13}.col-14,.col-xs-14{grid-column:span 14}.col-xs-14.offset-xs-2{grid-column:2/span 14}.col-xs-14.offset-xs-3{grid-column:3/span 14}.col-xs-14.offset-xs-4{grid-column:4/span 14}.col-xs-14.offset-xs-5{grid-column:5/span 14}.col-xs-14.offset-xs-6{grid-column:6/span 14}.col-xs-14.offset-xs-7{grid-column:7/span 14}.col-xs-14.offset-xs-8{grid-column:8/span 14}.col-xs-14.offset-xs-9{grid-column:9/span 14}.col-xs-14.offset-xs-10{grid-column:10/span 14}.col-xs-14.offset-xs-11{grid-column:11/span 14}.col-xs-14.offset-xs-12{grid-column:12/span 14}.col-xs-14.offset-xs-13{grid-column:13/span 14}.col-xs-14.offset-xs-14{grid-column:14/span 14}.col-xs-14.offset-xs-15{grid-column:15/span 14}.col-xs-14.offset-xs-16{grid-column:16/span 14}.col-15,.col-xs-15{grid-column:span 15}.col-xs-15.offset-xs-2{grid-column:2/span 15}.col-xs-15.offset-xs-3{grid-column:3/span 15}.col-xs-15.offset-xs-4{grid-column:4/span 15}.col-xs-15.offset-xs-5{grid-column:5/span 15}.col-xs-15.offset-xs-6{grid-column:6/span 15}.col-xs-15.offset-xs-7{grid-column:7/span 15}.col-xs-15.offset-xs-8{grid-column:8/span 15}.col-xs-15.offset-xs-9{grid-column:9/span 15}.col-xs-15.offset-xs-10{grid-column:10/span 15}.col-xs-15.offset-xs-11{grid-column:11/span 15}.col-xs-15.offset-xs-12{grid-column:12/span 15}.col-xs-15.offset-xs-13{grid-column:13/span 15}.col-xs-15.offset-xs-14{grid-column:14/span 15}.col-xs-15.offset-xs-15{grid-column:15/span 15}.col-xs-15.offset-xs-16{grid-column:16/span 15}.col-16,.col-xs-16{grid-column:span 16}.col-xs-16.offset-xs-2{grid-column:2/span 16}.col-xs-16.offset-xs-3{grid-column:3/span 16}.col-xs-16.offset-xs-4{grid-column:4/span 16}.col-xs-16.offset-xs-5{grid-column:5/span 16}.col-xs-16.offset-xs-6{grid-column:6/span 16}.col-xs-16.offset-xs-7{grid-column:7/span 16}.col-xs-16.offset-xs-8{grid-column:8/span 16}.col-xs-16.offset-xs-9{grid-column:9/span 16}.col-xs-16.offset-xs-10{grid-column:10/span 16}.col-xs-16.offset-xs-11{grid-column:11/span 16}.col-xs-16.offset-xs-12{grid-column:12/span 16}.col-xs-16.offset-xs-13{grid-column:13/span 16}.col-xs-16.offset-xs-14{grid-column:14/span 16}.col-xs-16.offset-xs-15{grid-column:15/span 16}.col-xs-16.offset-xs-16{grid-column:16/span 16}}@media only screen and (min-width:500px){.col-1,.col-sm-1{grid-column:span 1}.col-sm-1.offset-sm-2{grid-column:2/span 1}.col-sm-1.offset-sm-3{grid-column:3/span 1}.col-sm-1.offset-sm-4{grid-column:4/span 1}.col-sm-1.offset-sm-5{grid-column:5/span 1}.col-sm-1.offset-sm-6{grid-column:6/span 1}.col-sm-1.offset-sm-7{grid-column:7/span 1}.col-sm-1.offset-sm-8{grid-column:8/span 1}.col-sm-1.offset-sm-9{grid-column:9/span 1}.col-sm-1.offset-sm-10{grid-column:10/span 1}.col-sm-1.offset-sm-11{grid-column:11/span 1}.col-sm-1.offset-sm-12{grid-column:12/span 1}.col-sm-1.offset-sm-13{grid-column:13/span 1}.col-sm-1.offset-sm-14{grid-column:14/span 1}.col-sm-1.offset-sm-15{grid-column:15/span 1}.col-sm-1.offset-sm-16{grid-column:16/span 1}.col-2,.col-sm-2{grid-column:span 2}.col-sm-2.offset-sm-2{grid-column:2/span 2}.col-sm-2.offset-sm-3{grid-column:3/span 2}.col-sm-2.offset-sm-4{grid-column:4/span 2}.col-sm-2.offset-sm-5{grid-column:5/span 2}.col-sm-2.offset-sm-6{grid-column:6/span 2}.col-sm-2.offset-sm-7{grid-column:7/span 2}.col-sm-2.offset-sm-8{grid-column:8/span 2}.col-sm-2.offset-sm-9{grid-column:9/span 2}.col-sm-2.offset-sm-10{grid-column:10/span 2}.col-sm-2.offset-sm-11{grid-column:11/span 2}.col-sm-2.offset-sm-12{grid-column:12/span 2}.col-sm-2.offset-sm-13{grid-column:13/span 2}.col-sm-2.offset-sm-14{grid-column:14/span 2}.col-sm-2.offset-sm-15{grid-column:15/span 2}.col-sm-2.offset-sm-16{grid-column:16/span 2}.col-3,.col-sm-3{grid-column:span 3}.col-sm-3.offset-sm-2{grid-column:2/span 3}.col-sm-3.offset-sm-3{grid-column:3/span 3}.col-sm-3.offset-sm-4{grid-column:4/span 3}.col-sm-3.offset-sm-5{grid-column:5/span 3}.col-sm-3.offset-sm-6{grid-column:6/span 3}.col-sm-3.offset-sm-7{grid-column:7/span 3}.col-sm-3.offset-sm-8{grid-column:8/span 3}.col-sm-3.offset-sm-9{grid-column:9/span 3}.col-sm-3.offset-sm-10{grid-column:10/span 3}.col-sm-3.offset-sm-11{grid-column:11/span 3}.col-sm-3.offset-sm-12{grid-column:12/span 3}.col-sm-3.offset-sm-13{grid-column:13/span 3}.col-sm-3.offset-sm-14{grid-column:14/span 3}.col-sm-3.offset-sm-15{grid-column:15/span 3}.col-sm-3.offset-sm-16{grid-column:16/span 3}.col-4,.col-sm-4{grid-column:span 4}.col-sm-4.offset-sm-2{grid-column:2/span 4}.col-sm-4.offset-sm-3{grid-column:3/span 4}.col-sm-4.offset-sm-4{grid-column:4/span 4}.col-sm-4.offset-sm-5{grid-column:5/span 4}.col-sm-4.offset-sm-6{grid-column:6/span 4}.col-sm-4.offset-sm-7{grid-column:7/span 4}.col-sm-4.offset-sm-8{grid-column:8/span 4}.col-sm-4.offset-sm-9{grid-column:9/span 4}.col-sm-4.offset-sm-10{grid-column:10/span 4}.col-sm-4.offset-sm-11{grid-column:11/span 4}.col-sm-4.offset-sm-12{grid-column:12/span 4}.col-sm-4.offset-sm-13{grid-column:13/span 4}.col-sm-4.offset-sm-14{grid-column:14/span 4}.col-sm-4.offset-sm-15{grid-column:15/span 4}.col-sm-4.offset-sm-16{grid-column:16/span 4}.col-5,.col-sm-5{grid-column:span 5}.col-sm-5.offset-sm-2{grid-column:2/span 5}.col-sm-5.offset-sm-3{grid-column:3/span 5}.col-sm-5.offset-sm-4{grid-column:4/span 5}.col-sm-5.offset-sm-5{grid-column:5/span 5}.col-sm-5.offset-sm-6{grid-column:6/span 5}.col-sm-5.offset-sm-7{grid-column:7/span 5}.col-sm-5.offset-sm-8{grid-column:8/span 5}.col-sm-5.offset-sm-9{grid-column:9/span 5}.col-sm-5.offset-sm-10{grid-column:10/span 5}.col-sm-5.offset-sm-11{grid-column:11/span 5}.col-sm-5.offset-sm-12{grid-column:12/span 5}.col-sm-5.offset-sm-13{grid-column:13/span 5}.col-sm-5.offset-sm-14{grid-column:14/span 5}.col-sm-5.offset-sm-15{grid-column:15/span 5}.col-sm-5.offset-sm-16{grid-column:16/span 5}.col-6,.col-sm-6{grid-column:span 6}.col-sm-6.offset-sm-2{grid-column:2/span 6}.col-sm-6.offset-sm-3{grid-column:3/span 6}.col-sm-6.offset-sm-4{grid-column:4/span 6}.col-sm-6.offset-sm-5{grid-column:5/span 6}.col-sm-6.offset-sm-6{grid-column:6/span 6}.col-sm-6.offset-sm-7{grid-column:7/span 6}.col-sm-6.offset-sm-8{grid-column:8/span 6}.col-sm-6.offset-sm-9{grid-column:9/span 6}.col-sm-6.offset-sm-10{grid-column:10/span 6}.col-sm-6.offset-sm-11{grid-column:11/span 6}.col-sm-6.offset-sm-12{grid-column:12/span 6}.col-sm-6.offset-sm-13{grid-column:13/span 6}.col-sm-6.offset-sm-14{grid-column:14/span 6}.col-sm-6.offset-sm-15{grid-column:15/span 6}.col-sm-6.offset-sm-16{grid-column:16/span 6}.col-7,.col-sm-7{grid-column:span 7}.col-sm-7.offset-sm-2{grid-column:2/span 7}.col-sm-7.offset-sm-3{grid-column:3/span 7}.col-sm-7.offset-sm-4{grid-column:4/span 7}.col-sm-7.offset-sm-5{grid-column:5/span 7}.col-sm-7.offset-sm-6{grid-column:6/span 7}.col-sm-7.offset-sm-7{grid-column:7/span 7}.col-sm-7.offset-sm-8{grid-column:8/span 7}.col-sm-7.offset-sm-9{grid-column:9/span 7}.col-sm-7.offset-sm-10{grid-column:10/span 7}.col-sm-7.offset-sm-11{grid-column:11/span 7}.col-sm-7.offset-sm-12{grid-column:12/span 7}.col-sm-7.offset-sm-13{grid-column:13/span 7}.col-sm-7.offset-sm-14{grid-column:14/span 7}.col-sm-7.offset-sm-15{grid-column:15/span 7}.col-sm-7.offset-sm-16{grid-column:16/span 7}.col-8,.col-sm-8{grid-column:span 8}.col-sm-8.offset-sm-2{grid-column:2/span 8}.col-sm-8.offset-sm-3{grid-column:3/span 8}.col-sm-8.offset-sm-4{grid-column:4/span 8}.col-sm-8.offset-sm-5{grid-column:5/span 8}.col-sm-8.offset-sm-6{grid-column:6/span 8}.col-sm-8.offset-sm-7{grid-column:7/span 8}.col-sm-8.offset-sm-8{grid-column:8/span 8}.col-sm-8.offset-sm-9{grid-column:9/span 8}.col-sm-8.offset-sm-10{grid-column:10/span 8}.col-sm-8.offset-sm-11{grid-column:11/span 8}.col-sm-8.offset-sm-12{grid-column:12/span 8}.col-sm-8.offset-sm-13{grid-column:13/span 8}.col-sm-8.offset-sm-14{grid-column:14/span 8}.col-sm-8.offset-sm-15{grid-column:15/span 8}.col-sm-8.offset-sm-16{grid-column:16/span 8}.col-9,.col-sm-9{grid-column:span 9}.col-sm-9.offset-sm-2{grid-column:2/span 9}.col-sm-9.offset-sm-3{grid-column:3/span 9}.col-sm-9.offset-sm-4{grid-column:4/span 9}.col-sm-9.offset-sm-5{grid-column:5/span 9}.col-sm-9.offset-sm-6{grid-column:6/span 9}.col-sm-9.offset-sm-7{grid-column:7/span 9}.col-sm-9.offset-sm-8{grid-column:8/span 9}.col-sm-9.offset-sm-9{grid-column:9/span 9}.col-sm-9.offset-sm-10{grid-column:10/span 9}.col-sm-9.offset-sm-11{grid-column:11/span 9}.col-sm-9.offset-sm-12{grid-column:12/span 9}.col-sm-9.offset-sm-13{grid-column:13/span 9}.col-sm-9.offset-sm-14{grid-column:14/span 9}.col-sm-9.offset-sm-15{grid-column:15/span 9}.col-sm-9.offset-sm-16{grid-column:16/span 9}.col-10,.col-sm-10{grid-column:span 10}.col-sm-10.offset-sm-2{grid-column:2/span 10}.col-sm-10.offset-sm-3{grid-column:3/span 10}.col-sm-10.offset-sm-4{grid-column:4/span 10}.col-sm-10.offset-sm-5{grid-column:5/span 10}.col-sm-10.offset-sm-6{grid-column:6/span 10}.col-sm-10.offset-sm-7{grid-column:7/span 10}.col-sm-10.offset-sm-8{grid-column:8/span 10}.col-sm-10.offset-sm-9{grid-column:9/span 10}.col-sm-10.offset-sm-10{grid-column:10/span 10}.col-sm-10.offset-sm-11{grid-column:11/span 10}.col-sm-10.offset-sm-12{grid-column:12/span 10}.col-sm-10.offset-sm-13{grid-column:13/span 10}.col-sm-10.offset-sm-14{grid-column:14/span 10}.col-sm-10.offset-sm-15{grid-column:15/span 10}.col-sm-10.offset-sm-16{grid-column:16/span 10}.col-11,.col-sm-11{grid-column:span 11}.col-sm-11.offset-sm-2{grid-column:2/span 11}.col-sm-11.offset-sm-3{grid-column:3/span 11}.col-sm-11.offset-sm-4{grid-column:4/span 11}.col-sm-11.offset-sm-5{grid-column:5/span 11}.col-sm-11.offset-sm-6{grid-column:6/span 11}.col-sm-11.offset-sm-7{grid-column:7/span 11}.col-sm-11.offset-sm-8{grid-column:8/span 11}.col-sm-11.offset-sm-9{grid-column:9/span 11}.col-sm-11.offset-sm-10{grid-column:10/span 11}.col-sm-11.offset-sm-11{grid-column:11/span 11}.col-sm-11.offset-sm-12{grid-column:12/span 11}.col-sm-11.offset-sm-13{grid-column:13/span 11}.col-sm-11.offset-sm-14{grid-column:14/span 11}.col-sm-11.offset-sm-15{grid-column:15/span 11}.col-sm-11.offset-sm-16{grid-column:16/span 11}.col-12,.col-sm-12{grid-column:span 12}.col-sm-12.offset-sm-2{grid-column:2/span 12}.col-sm-12.offset-sm-3{grid-column:3/span 12}.col-sm-12.offset-sm-4{grid-column:4/span 12}.col-sm-12.offset-sm-5{grid-column:5/span 12}.col-sm-12.offset-sm-6{grid-column:6/span 12}.col-sm-12.offset-sm-7{grid-column:7/span 12}.col-sm-12.offset-sm-8{grid-column:8/span 12}.col-sm-12.offset-sm-9{grid-column:9/span 12}.col-sm-12.offset-sm-10{grid-column:10/span 12}.col-sm-12.offset-sm-11{grid-column:11/span 12}.col-sm-12.offset-sm-12{grid-column:12/span 12}.col-sm-12.offset-sm-13{grid-column:13/span 12}.col-sm-12.offset-sm-14{grid-column:14/span 12}.col-sm-12.offset-sm-15{grid-column:15/span 12}.col-sm-12.offset-sm-16{grid-column:16/span 12}.col-13,.col-sm-13{grid-column:span 13}.col-sm-13.offset-sm-2{grid-column:2/span 13}.col-sm-13.offset-sm-3{grid-column:3/span 13}.col-sm-13.offset-sm-4{grid-column:4/span 13}.col-sm-13.offset-sm-5{grid-column:5/span 13}.col-sm-13.offset-sm-6{grid-column:6/span 13}.col-sm-13.offset-sm-7{grid-column:7/span 13}.col-sm-13.offset-sm-8{grid-column:8/span 13}.col-sm-13.offset-sm-9{grid-column:9/span 13}.col-sm-13.offset-sm-10{grid-column:10/span 13}.col-sm-13.offset-sm-11{grid-column:11/span 13}.col-sm-13.offset-sm-12{grid-column:12/span 13}.col-sm-13.offset-sm-13{grid-column:13/span 13}.col-sm-13.offset-sm-14{grid-column:14/span 13}.col-sm-13.offset-sm-15{grid-column:15/span 13}.col-sm-13.offset-sm-16{grid-column:16/span 13}.col-14,.col-sm-14{grid-column:span 14}.col-sm-14.offset-sm-2{grid-column:2/span 14}.col-sm-14.offset-sm-3{grid-column:3/span 14}.col-sm-14.offset-sm-4{grid-column:4/span 14}.col-sm-14.offset-sm-5{grid-column:5/span 14}.col-sm-14.offset-sm-6{grid-column:6/span 14}.col-sm-14.offset-sm-7{grid-column:7/span 14}.col-sm-14.offset-sm-8{grid-column:8/span 14}.col-sm-14.offset-sm-9{grid-column:9/span 14}.col-sm-14.offset-sm-10{grid-column:10/span 14}.col-sm-14.offset-sm-11{grid-column:11/span 14}.col-sm-14.offset-sm-12{grid-column:12/span 14}.col-sm-14.offset-sm-13{grid-column:13/span 14}.col-sm-14.offset-sm-14{grid-column:14/span 14}.col-sm-14.offset-sm-15{grid-column:15/span 14}.col-sm-14.offset-sm-16{grid-column:16/span 14}.col-15,.col-sm-15{grid-column:span 15}.col-sm-15.offset-sm-2{grid-column:2/span 15}.col-sm-15.offset-sm-3{grid-column:3/span 15}.col-sm-15.offset-sm-4{grid-column:4/span 15}.col-sm-15.offset-sm-5{grid-column:5/span 15}.col-sm-15.offset-sm-6{grid-column:6/span 15}.col-sm-15.offset-sm-7{grid-column:7/span 15}.col-sm-15.offset-sm-8{grid-column:8/span 15}.col-sm-15.offset-sm-9{grid-column:9/span 15}.col-sm-15.offset-sm-10{grid-column:10/span 15}.col-sm-15.offset-sm-11{grid-column:11/span 15}.col-sm-15.offset-sm-12{grid-column:12/span 15}.col-sm-15.offset-sm-13{grid-column:13/span 15}.col-sm-15.offset-sm-14{grid-column:14/span 15}.col-sm-15.offset-sm-15{grid-column:15/span 15}.col-sm-15.offset-sm-16{grid-column:16/span 15}.col-16,.col-sm-16{grid-column:span 16}.col-sm-16.offset-sm-2{grid-column:2/span 16}.col-sm-16.offset-sm-3{grid-column:3/span 16}.col-sm-16.offset-sm-4{grid-column:4/span 16}.col-sm-16.offset-sm-5{grid-column:5/span 16}.col-sm-16.offset-sm-6{grid-column:6/span 16}.col-sm-16.offset-sm-7{grid-column:7/span 16}.col-sm-16.offset-sm-8{grid-column:8/span 16}.col-sm-16.offset-sm-9{grid-column:9/span 16}.col-sm-16.offset-sm-10{grid-column:10/span 16}.col-sm-16.offset-sm-11{grid-column:11/span 16}.col-sm-16.offset-sm-12{grid-column:12/span 16}.col-sm-16.offset-sm-13{grid-column:13/span 16}.col-sm-16.offset-sm-14{grid-column:14/span 16}.col-sm-16.offset-sm-15{grid-column:15/span 16}.col-sm-16.offset-sm-16{grid-column:16/span 16}}@media only screen and (min-width:768px){.col-1,.col-md-1{grid-column:span 1}.col-md-1.offset-md-2{grid-column:2/span 1}.col-md-1.offset-md-3{grid-column:3/span 1}.col-md-1.offset-md-4{grid-column:4/span 1}.col-md-1.offset-md-5{grid-column:5/span 1}.col-md-1.offset-md-6{grid-column:6/span 1}.col-md-1.offset-md-7{grid-column:7/span 1}.col-md-1.offset-md-8{grid-column:8/span 1}.col-md-1.offset-md-9{grid-column:9/span 1}.col-md-1.offset-md-10{grid-column:10/span 1}.col-md-1.offset-md-11{grid-column:11/span 1}.col-md-1.offset-md-12{grid-column:12/span 1}.col-md-1.offset-md-13{grid-column:13/span 1}.col-md-1.offset-md-14{grid-column:14/span 1}.col-md-1.offset-md-15{grid-column:15/span 1}.col-md-1.offset-md-16{grid-column:16/span 1}.col-2,.col-md-2{grid-column:span 2}.col-md-2.offset-md-2{grid-column:2/span 2}.col-md-2.offset-md-3{grid-column:3/span 2}.col-md-2.offset-md-4{grid-column:4/span 2}.col-md-2.offset-md-5{grid-column:5/span 2}.col-md-2.offset-md-6{grid-column:6/span 2}.col-md-2.offset-md-7{grid-column:7/span 2}.col-md-2.offset-md-8{grid-column:8/span 2}.col-md-2.offset-md-9{grid-column:9/span 2}.col-md-2.offset-md-10{grid-column:10/span 2}.col-md-2.offset-md-11{grid-column:11/span 2}.col-md-2.offset-md-12{grid-column:12/span 2}.col-md-2.offset-md-13{grid-column:13/span 2}.col-md-2.offset-md-14{grid-column:14/span 2}.col-md-2.offset-md-15{grid-column:15/span 2}.col-md-2.offset-md-16{grid-column:16/span 2}.col-3,.col-md-3{grid-column:span 3}.col-md-3.offset-md-2{grid-column:2/span 3}.col-md-3.offset-md-3{grid-column:3/span 3}.col-md-3.offset-md-4{grid-column:4/span 3}.col-md-3.offset-md-5{grid-column:5/span 3}.col-md-3.offset-md-6{grid-column:6/span 3}.col-md-3.offset-md-7{grid-column:7/span 3}.col-md-3.offset-md-8{grid-column:8/span 3}.col-md-3.offset-md-9{grid-column:9/span 3}.col-md-3.offset-md-10{grid-column:10/span 3}.col-md-3.offset-md-11{grid-column:11/span 3}.col-md-3.offset-md-12{grid-column:12/span 3}.col-md-3.offset-md-13{grid-column:13/span 3}.col-md-3.offset-md-14{grid-column:14/span 3}.col-md-3.offset-md-15{grid-column:15/span 3}.col-md-3.offset-md-16{grid-column:16/span 3}.col-4,.col-md-4{grid-column:span 4}.col-md-4.offset-md-2{grid-column:2/span 4}.col-md-4.offset-md-3{grid-column:3/span 4}.col-md-4.offset-md-4{grid-column:4/span 4}.col-md-4.offset-md-5{grid-column:5/span 4}.col-md-4.offset-md-6{grid-column:6/span 4}.col-md-4.offset-md-7{grid-column:7/span 4}.col-md-4.offset-md-8{grid-column:8/span 4}.col-md-4.offset-md-9{grid-column:9/span 4}.col-md-4.offset-md-10{grid-column:10/span 4}.col-md-4.offset-md-11{grid-column:11/span 4}.col-md-4.offset-md-12{grid-column:12/span 4}.col-md-4.offset-md-13{grid-column:13/span 4}.col-md-4.offset-md-14{grid-column:14/span 4}.col-md-4.offset-md-15{grid-column:15/span 4}.col-md-4.offset-md-16{grid-column:16/span 4}.col-5,.col-md-5{grid-column:span 5}.col-md-5.offset-md-2{grid-column:2/span 5}.col-md-5.offset-md-3{grid-column:3/span 5}.col-md-5.offset-md-4{grid-column:4/span 5}.col-md-5.offset-md-5{grid-column:5/span 5}.col-md-5.offset-md-6{grid-column:6/span 5}.col-md-5.offset-md-7{grid-column:7/span 5}.col-md-5.offset-md-8{grid-column:8/span 5}.col-md-5.offset-md-9{grid-column:9/span 5}.col-md-5.offset-md-10{grid-column:10/span 5}.col-md-5.offset-md-11{grid-column:11/span 5}.col-md-5.offset-md-12{grid-column:12/span 5}.col-md-5.offset-md-13{grid-column:13/span 5}.col-md-5.offset-md-14{grid-column:14/span 5}.col-md-5.offset-md-15{grid-column:15/span 5}.col-md-5.offset-md-16{grid-column:16/span 5}.col-6,.col-md-6{grid-column:span 6}.col-md-6.offset-md-2{grid-column:2/span 6}.col-md-6.offset-md-3{grid-column:3/span 6}.col-md-6.offset-md-4{grid-column:4/span 6}.col-md-6.offset-md-5{grid-column:5/span 6}.col-md-6.offset-md-6{grid-column:6/span 6}.col-md-6.offset-md-7{grid-column:7/span 6}.col-md-6.offset-md-8{grid-column:8/span 6}.col-md-6.offset-md-9{grid-column:9/span 6}.col-md-6.offset-md-10{grid-column:10/span 6}.col-md-6.offset-md-11{grid-column:11/span 6}.col-md-6.offset-md-12{grid-column:12/span 6}.col-md-6.offset-md-13{grid-column:13/span 6}.col-md-6.offset-md-14{grid-column:14/span 6}.col-md-6.offset-md-15{grid-column:15/span 6}.col-md-6.offset-md-16{grid-column:16/span 6}.col-7,.col-md-7{grid-column:span 7}.col-md-7.offset-md-2{grid-column:2/span 7}.col-md-7.offset-md-3{grid-column:3/span 7}.col-md-7.offset-md-4{grid-column:4/span 7}.col-md-7.offset-md-5{grid-column:5/span 7}.col-md-7.offset-md-6{grid-column:6/span 7}.col-md-7.offset-md-7{grid-column:7/span 7}.col-md-7.offset-md-8{grid-column:8/span 7}.col-md-7.offset-md-9{grid-column:9/span 7}.col-md-7.offset-md-10{grid-column:10/span 7}.col-md-7.offset-md-11{grid-column:11/span 7}.col-md-7.offset-md-12{grid-column:12/span 7}.col-md-7.offset-md-13{grid-column:13/span 7}.col-md-7.offset-md-14{grid-column:14/span 7}.col-md-7.offset-md-15{grid-column:15/span 7}.col-md-7.offset-md-16{grid-column:16/span 7}.col-8,.col-md-8{grid-column:span 8}.col-md-8.offset-md-2{grid-column:2/span 8}.col-md-8.offset-md-3{grid-column:3/span 8}.col-md-8.offset-md-4{grid-column:4/span 8}.col-md-8.offset-md-5{grid-column:5/span 8}.col-md-8.offset-md-6{grid-column:6/span 8}.col-md-8.offset-md-7{grid-column:7/span 8}.col-md-8.offset-md-8{grid-column:8/span 8}.col-md-8.offset-md-9{grid-column:9/span 8}.col-md-8.offset-md-10{grid-column:10/span 8}.col-md-8.offset-md-11{grid-column:11/span 8}.col-md-8.offset-md-12{grid-column:12/span 8}.col-md-8.offset-md-13{grid-column:13/span 8}.col-md-8.offset-md-14{grid-column:14/span 8}.col-md-8.offset-md-15{grid-column:15/span 8}.col-md-8.offset-md-16{grid-column:16/span 8}.col-9,.col-md-9{grid-column:span 9}.col-md-9.offset-md-2{grid-column:2/span 9}.col-md-9.offset-md-3{grid-column:3/span 9}.col-md-9.offset-md-4{grid-column:4/span 9}.col-md-9.offset-md-5{grid-column:5/span 9}.col-md-9.offset-md-6{grid-column:6/span 9}.col-md-9.offset-md-7{grid-column:7/span 9}.col-md-9.offset-md-8{grid-column:8/span 9}.col-md-9.offset-md-9{grid-column:9/span 9}.col-md-9.offset-md-10{grid-column:10/span 9}.col-md-9.offset-md-11{grid-column:11/span 9}.col-md-9.offset-md-12{grid-column:12/span 9}.col-md-9.offset-md-13{grid-column:13/span 9}.col-md-9.offset-md-14{grid-column:14/span 9}.col-md-9.offset-md-15{grid-column:15/span 9}.col-md-9.offset-md-16{grid-column:16/span 9}.col-10,.col-md-10{grid-column:span 10}.col-md-10.offset-md-2{grid-column:2/span 10}.col-md-10.offset-md-3{grid-column:3/span 10}.col-md-10.offset-md-4{grid-column:4/span 10}.col-md-10.offset-md-5{grid-column:5/span 10}.col-md-10.offset-md-6{grid-column:6/span 10}.col-md-10.offset-md-7{grid-column:7/span 10}.col-md-10.offset-md-8{grid-column:8/span 10}.col-md-10.offset-md-9{grid-column:9/span 10}.col-md-10.offset-md-10{grid-column:10/span 10}.col-md-10.offset-md-11{grid-column:11/span 10}.col-md-10.offset-md-12{grid-column:12/span 10}.col-md-10.offset-md-13{grid-column:13/span 10}.col-md-10.offset-md-14{grid-column:14/span 10}.col-md-10.offset-md-15{grid-column:15/span 10}.col-md-10.offset-md-16{grid-column:16/span 10}.col-11,.col-md-11{grid-column:span 11}.col-md-11.offset-md-2{grid-column:2/span 11}.col-md-11.offset-md-3{grid-column:3/span 11}.col-md-11.offset-md-4{grid-column:4/span 11}.col-md-11.offset-md-5{grid-column:5/span 11}.col-md-11.offset-md-6{grid-column:6/span 11}.col-md-11.offset-md-7{grid-column:7/span 11}.col-md-11.offset-md-8{grid-column:8/span 11}.col-md-11.offset-md-9{grid-column:9/span 11}.col-md-11.offset-md-10{grid-column:10/span 11}.col-md-11.offset-md-11{grid-column:11/span 11}.col-md-11.offset-md-12{grid-column:12/span 11}.col-md-11.offset-md-13{grid-column:13/span 11}.col-md-11.offset-md-14{grid-column:14/span 11}.col-md-11.offset-md-15{grid-column:15/span 11}.col-md-11.offset-md-16{grid-column:16/span 11}.col-12,.col-md-12{grid-column:span 12}.col-md-12.offset-md-2{grid-column:2/span 12}.col-md-12.offset-md-3{grid-column:3/span 12}.col-md-12.offset-md-4{grid-column:4/span 12}.col-md-12.offset-md-5{grid-column:5/span 12}.col-md-12.offset-md-6{grid-column:6/span 12}.col-md-12.offset-md-7{grid-column:7/span 12}.col-md-12.offset-md-8{grid-column:8/span 12}.col-md-12.offset-md-9{grid-column:9/span 12}.col-md-12.offset-md-10{grid-column:10/span 12}.col-md-12.offset-md-11{grid-column:11/span 12}.col-md-12.offset-md-12{grid-column:12/span 12}.col-md-12.offset-md-13{grid-column:13/span 12}.col-md-12.offset-md-14{grid-column:14/span 12}.col-md-12.offset-md-15{grid-column:15/span 12}.col-md-12.offset-md-16{grid-column:16/span 12}.col-13,.col-md-13{grid-column:span 13}.col-md-13.offset-md-2{grid-column:2/span 13}.col-md-13.offset-md-3{grid-column:3/span 13}.col-md-13.offset-md-4{grid-column:4/span 13}.col-md-13.offset-md-5{grid-column:5/span 13}.col-md-13.offset-md-6{grid-column:6/span 13}.col-md-13.offset-md-7{grid-column:7/span 13}.col-md-13.offset-md-8{grid-column:8/span 13}.col-md-13.offset-md-9{grid-column:9/span 13}.col-md-13.offset-md-10{grid-column:10/span 13}.col-md-13.offset-md-11{grid-column:11/span 13}.col-md-13.offset-md-12{grid-column:12/span 13}.col-md-13.offset-md-13{grid-column:13/span 13}.col-md-13.offset-md-14{grid-column:14/span 13}.col-md-13.offset-md-15{grid-column:15/span 13}.col-md-13.offset-md-16{grid-column:16/span 13}.col-14,.col-md-14{grid-column:span 14}.col-md-14.offset-md-2{grid-column:2/span 14}.col-md-14.offset-md-3{grid-column:3/span 14}.col-md-14.offset-md-4{grid-column:4/span 14}.col-md-14.offset-md-5{grid-column:5/span 14}.col-md-14.offset-md-6{grid-column:6/span 14}.col-md-14.offset-md-7{grid-column:7/span 14}.col-md-14.offset-md-8{grid-column:8/span 14}.col-md-14.offset-md-9{grid-column:9/span 14}.col-md-14.offset-md-10{grid-column:10/span 14}.col-md-14.offset-md-11{grid-column:11/span 14}.col-md-14.offset-md-12{grid-column:12/span 14}.col-md-14.offset-md-13{grid-column:13/span 14}.col-md-14.offset-md-14{grid-column:14/span 14}.col-md-14.offset-md-15{grid-column:15/span 14}.col-md-14.offset-md-16{grid-column:16/span 14}.col-15,.col-md-15{grid-column:span 15}.col-md-15.offset-md-2{grid-column:2/span 15}.col-md-15.offset-md-3{grid-column:3/span 15}.col-md-15.offset-md-4{grid-column:4/span 15}.col-md-15.offset-md-5{grid-column:5/span 15}.col-md-15.offset-md-6{grid-column:6/span 15}.col-md-15.offset-md-7{grid-column:7/span 15}.col-md-15.offset-md-8{grid-column:8/span 15}.col-md-15.offset-md-9{grid-column:9/span 15}.col-md-15.offset-md-10{grid-column:10/span 15}.col-md-15.offset-md-11{grid-column:11/span 15}.col-md-15.offset-md-12{grid-column:12/span 15}.col-md-15.offset-md-13{grid-column:13/span 15}.col-md-15.offset-md-14{grid-column:14/span 15}.col-md-15.offset-md-15{grid-column:15/span 15}.col-md-15.offset-md-16{grid-column:16/span 15}.col-16,.col-md-16{grid-column:span 16}.col-md-16.offset-md-2{grid-column:2/span 16}.col-md-16.offset-md-3{grid-column:3/span 16}.col-md-16.offset-md-4{grid-column:4/span 16}.col-md-16.offset-md-5{grid-column:5/span 16}.col-md-16.offset-md-6{grid-column:6/span 16}.col-md-16.offset-md-7{grid-column:7/span 16}.col-md-16.offset-md-8{grid-column:8/span 16}.col-md-16.offset-md-9{grid-column:9/span 16}.col-md-16.offset-md-10{grid-column:10/span 16}.col-md-16.offset-md-11{grid-column:11/span 16}.col-md-16.offset-md-12{grid-column:12/span 16}.col-md-16.offset-md-13{grid-column:13/span 16}.col-md-16.offset-md-14{grid-column:14/span 16}.col-md-16.offset-md-15{grid-column:15/span 16}.col-md-16.offset-md-16{grid-column:16/span 16}}@media only screen and (min-width:992px){.col-1,.col-lg-1{grid-column:span 1}.col-lg-1.offset-lg-2{grid-column:2/span 1}.col-lg-1.offset-lg-3{grid-column:3/span 1}.col-lg-1.offset-lg-4{grid-column:4/span 1}.col-lg-1.offset-lg-5{grid-column:5/span 1}.col-lg-1.offset-lg-6{grid-column:6/span 1}.col-lg-1.offset-lg-7{grid-column:7/span 1}.col-lg-1.offset-lg-8{grid-column:8/span 1}.col-lg-1.offset-lg-9{grid-column:9/span 1}.col-lg-1.offset-lg-10{grid-column:10/span 1}.col-lg-1.offset-lg-11{grid-column:11/span 1}.col-lg-1.offset-lg-12{grid-column:12/span 1}.col-lg-1.offset-lg-13{grid-column:13/span 1}.col-lg-1.offset-lg-14{grid-column:14/span 1}.col-lg-1.offset-lg-15{grid-column:15/span 1}.col-lg-1.offset-lg-16{grid-column:16/span 1}.col-2,.col-lg-2{grid-column:span 2}.col-lg-2.offset-lg-2{grid-column:2/span 2}.col-lg-2.offset-lg-3{grid-column:3/span 2}.col-lg-2.offset-lg-4{grid-column:4/span 2}.col-lg-2.offset-lg-5{grid-column:5/span 2}.col-lg-2.offset-lg-6{grid-column:6/span 2}.col-lg-2.offset-lg-7{grid-column:7/span 2}.col-lg-2.offset-lg-8{grid-column:8/span 2}.col-lg-2.offset-lg-9{grid-column:9/span 2}.col-lg-2.offset-lg-10{grid-column:10/span 2}.col-lg-2.offset-lg-11{grid-column:11/span 2}.col-lg-2.offset-lg-12{grid-column:12/span 2}.col-lg-2.offset-lg-13{grid-column:13/span 2}.col-lg-2.offset-lg-14{grid-column:14/span 2}.col-lg-2.offset-lg-15{grid-column:15/span 2}.col-lg-2.offset-lg-16{grid-column:16/span 2}.col-3,.col-lg-3{grid-column:span 3}.col-lg-3.offset-lg-2{grid-column:2/span 3}.col-lg-3.offset-lg-3{grid-column:3/span 3}.col-lg-3.offset-lg-4{grid-column:4/span 3}.col-lg-3.offset-lg-5{grid-column:5/span 3}.col-lg-3.offset-lg-6{grid-column:6/span 3}.col-lg-3.offset-lg-7{grid-column:7/span 3}.col-lg-3.offset-lg-8{grid-column:8/span 3}.col-lg-3.offset-lg-9{grid-column:9/span 3}.col-lg-3.offset-lg-10{grid-column:10/span 3}.col-lg-3.offset-lg-11{grid-column:11/span 3}.col-lg-3.offset-lg-12{grid-column:12/span 3}.col-lg-3.offset-lg-13{grid-column:13/span 3}.col-lg-3.offset-lg-14{grid-column:14/span 3}.col-lg-3.offset-lg-15{grid-column:15/span 3}.col-lg-3.offset-lg-16{grid-column:16/span 3}.col-4,.col-lg-4{grid-column:span 4}.col-lg-4.offset-lg-2{grid-column:2/span 4}.col-lg-4.offset-lg-3{grid-column:3/span 4}.col-lg-4.offset-lg-4{grid-column:4/span 4}.col-lg-4.offset-lg-5{grid-column:5/span 4}.col-lg-4.offset-lg-6{grid-column:6/span 4}.col-lg-4.offset-lg-7{grid-column:7/span 4}.col-lg-4.offset-lg-8{grid-column:8/span 4}.col-lg-4.offset-lg-9{grid-column:9/span 4}.col-lg-4.offset-lg-10{grid-column:10/span 4}.col-lg-4.offset-lg-11{grid-column:11/span 4}.col-lg-4.offset-lg-12{grid-column:12/span 4}.col-lg-4.offset-lg-13{grid-column:13/span 4}.col-lg-4.offset-lg-14{grid-column:14/span 4}.col-lg-4.offset-lg-15{grid-column:15/span 4}.col-lg-4.offset-lg-16{grid-column:16/span 4}.col-5,.col-lg-5{grid-column:span 5}.col-lg-5.offset-lg-2{grid-column:2/span 5}.col-lg-5.offset-lg-3{grid-column:3/span 5}.col-lg-5.offset-lg-4{grid-column:4/span 5}.col-lg-5.offset-lg-5{grid-column:5/span 5}.col-lg-5.offset-lg-6{grid-column:6/span 5}.col-lg-5.offset-lg-7{grid-column:7/span 5}.col-lg-5.offset-lg-8{grid-column:8/span 5}.col-lg-5.offset-lg-9{grid-column:9/span 5}.col-lg-5.offset-lg-10{grid-column:10/span 5}.col-lg-5.offset-lg-11{grid-column:11/span 5}.col-lg-5.offset-lg-12{grid-column:12/span 5}.col-lg-5.offset-lg-13{grid-column:13/span 5}.col-lg-5.offset-lg-14{grid-column:14/span 5}.col-lg-5.offset-lg-15{grid-column:15/span 5}.col-lg-5.offset-lg-16{grid-column:16/span 5}.col-6,.col-lg-6{grid-column:span 6}.col-lg-6.offset-lg-2{grid-column:2/span 6}.col-lg-6.offset-lg-3{grid-column:3/span 6}.col-lg-6.offset-lg-4{grid-column:4/span 6}.col-lg-6.offset-lg-5{grid-column:5/span 6}.col-lg-6.offset-lg-6{grid-column:6/span 6}.col-lg-6.offset-lg-7{grid-column:7/span 6}.col-lg-6.offset-lg-8{grid-column:8/span 6}.col-lg-6.offset-lg-9{grid-column:9/span 6}.col-lg-6.offset-lg-10{grid-column:10/span 6}.col-lg-6.offset-lg-11{grid-column:11/span 6}.col-lg-6.offset-lg-12{grid-column:12/span 6}.col-lg-6.offset-lg-13{grid-column:13/span 6}.col-lg-6.offset-lg-14{grid-column:14/span 6}.col-lg-6.offset-lg-15{grid-column:15/span 6}.col-lg-6.offset-lg-16{grid-column:16/span 6}.col-7,.col-lg-7{grid-column:span 7}.col-lg-7.offset-lg-2{grid-column:2/span 7}.col-lg-7.offset-lg-3{grid-column:3/span 7}.col-lg-7.offset-lg-4{grid-column:4/span 7}.col-lg-7.offset-lg-5{grid-column:5/span 7}.col-lg-7.offset-lg-6{grid-column:6/span 7}.col-lg-7.offset-lg-7{grid-column:7/span 7}.col-lg-7.offset-lg-8{grid-column:8/span 7}.col-lg-7.offset-lg-9{grid-column:9/span 7}.col-lg-7.offset-lg-10{grid-column:10/span 7}.col-lg-7.offset-lg-11{grid-column:11/span 7}.col-lg-7.offset-lg-12{grid-column:12/span 7}.col-lg-7.offset-lg-13{grid-column:13/span 7}.col-lg-7.offset-lg-14{grid-column:14/span 7}.col-lg-7.offset-lg-15{grid-column:15/span 7}.col-lg-7.offset-lg-16{grid-column:16/span 7}.col-8,.col-lg-8{grid-column:span 8}.col-lg-8.offset-lg-2{grid-column:2/span 8}.col-lg-8.offset-lg-3{grid-column:3/span 8}.col-lg-8.offset-lg-4{grid-column:4/span 8}.col-lg-8.offset-lg-5{grid-column:5/span 8}.col-lg-8.offset-lg-6{grid-column:6/span 8}.col-lg-8.offset-lg-7{grid-column:7/span 8}.col-lg-8.offset-lg-8{grid-column:8/span 8}.col-lg-8.offset-lg-9{grid-column:9/span 8}.col-lg-8.offset-lg-10{grid-column:10/span 8}.col-lg-8.offset-lg-11{grid-column:11/span 8}.col-lg-8.offset-lg-12{grid-column:12/span 8}.col-lg-8.offset-lg-13{grid-column:13/span 8}.col-lg-8.offset-lg-14{grid-column:14/span 8}.col-lg-8.offset-lg-15{grid-column:15/span 8}.col-lg-8.offset-lg-16{grid-column:16/span 8}.col-9,.col-lg-9{grid-column:span 9}.col-lg-9.offset-lg-2{grid-column:2/span 9}.col-lg-9.offset-lg-3{grid-column:3/span 9}.col-lg-9.offset-lg-4{grid-column:4/span 9}.col-lg-9.offset-lg-5{grid-column:5/span 9}.col-lg-9.offset-lg-6{grid-column:6/span 9}.col-lg-9.offset-lg-7{grid-column:7/span 9}.col-lg-9.offset-lg-8{grid-column:8/span 9}.col-lg-9.offset-lg-9{grid-column:9/span 9}.col-lg-9.offset-lg-10{grid-column:10/span 9}.col-lg-9.offset-lg-11{grid-column:11/span 9}.col-lg-9.offset-lg-12{grid-column:12/span 9}.col-lg-9.offset-lg-13{grid-column:13/span 9}.col-lg-9.offset-lg-14{grid-column:14/span 9}.col-lg-9.offset-lg-15{grid-column:15/span 9}.col-lg-9.offset-lg-16{grid-column:16/span 9}.col-10,.col-lg-10{grid-column:span 10}.col-lg-10.offset-lg-2{grid-column:2/span 10}.col-lg-10.offset-lg-3{grid-column:3/span 10}.col-lg-10.offset-lg-4{grid-column:4/span 10}.col-lg-10.offset-lg-5{grid-column:5/span 10}.col-lg-10.offset-lg-6{grid-column:6/span 10}.col-lg-10.offset-lg-7{grid-column:7/span 10}.col-lg-10.offset-lg-8{grid-column:8/span 10}.col-lg-10.offset-lg-9{grid-column:9/span 10}.col-lg-10.offset-lg-10{grid-column:10/span 10}.col-lg-10.offset-lg-11{grid-column:11/span 10}.col-lg-10.offset-lg-12{grid-column:12/span 10}.col-lg-10.offset-lg-13{grid-column:13/span 10}.col-lg-10.offset-lg-14{grid-column:14/span 10}.col-lg-10.offset-lg-15{grid-column:15/span 10}.col-lg-10.offset-lg-16{grid-column:16/span 10}.col-11,.col-lg-11{grid-column:span 11}.col-lg-11.offset-lg-2{grid-column:2/span 11}.col-lg-11.offset-lg-3{grid-column:3/span 11}.col-lg-11.offset-lg-4{grid-column:4/span 11}.col-lg-11.offset-lg-5{grid-column:5/span 11}.col-lg-11.offset-lg-6{grid-column:6/span 11}.col-lg-11.offset-lg-7{grid-column:7/span 11}.col-lg-11.offset-lg-8{grid-column:8/span 11}.col-lg-11.offset-lg-9{grid-column:9/span 11}.col-lg-11.offset-lg-10{grid-column:10/span 11}.col-lg-11.offset-lg-11{grid-column:11/span 11}.col-lg-11.offset-lg-12{grid-column:12/span 11}.col-lg-11.offset-lg-13{grid-column:13/span 11}.col-lg-11.offset-lg-14{grid-column:14/span 11}.col-lg-11.offset-lg-15{grid-column:15/span 11}.col-lg-11.offset-lg-16{grid-column:16/span 11}.col-12,.col-lg-12{grid-column:span 12}.col-lg-12.offset-lg-2{grid-column:2/span 12}.col-lg-12.offset-lg-3{grid-column:3/span 12}.col-lg-12.offset-lg-4{grid-column:4/span 12}.col-lg-12.offset-lg-5{grid-column:5/span 12}.col-lg-12.offset-lg-6{grid-column:6/span 12}.col-lg-12.offset-lg-7{grid-column:7/span 12}.col-lg-12.offset-lg-8{grid-column:8/span 12}.col-lg-12.offset-lg-9{grid-column:9/span 12}.col-lg-12.offset-lg-10{grid-column:10/span 12}.col-lg-12.offset-lg-11{grid-column:11/span 12}.col-lg-12.offset-lg-12{grid-column:12/span 12}.col-lg-12.offset-lg-13{grid-column:13/span 12}.col-lg-12.offset-lg-14{grid-column:14/span 12}.col-lg-12.offset-lg-15{grid-column:15/span 12}.col-lg-12.offset-lg-16{grid-column:16/span 12}.col-13,.col-lg-13{grid-column:span 13}.col-lg-13.offset-lg-2{grid-column:2/span 13}.col-lg-13.offset-lg-3{grid-column:3/span 13}.col-lg-13.offset-lg-4{grid-column:4/span 13}.col-lg-13.offset-lg-5{grid-column:5/span 13}.col-lg-13.offset-lg-6{grid-column:6/span 13}.col-lg-13.offset-lg-7{grid-column:7/span 13}.col-lg-13.offset-lg-8{grid-column:8/span 13}.col-lg-13.offset-lg-9{grid-column:9/span 13}.col-lg-13.offset-lg-10{grid-column:10/span 13}.col-lg-13.offset-lg-11{grid-column:11/span 13}.col-lg-13.offset-lg-12{grid-column:12/span 13}.col-lg-13.offset-lg-13{grid-column:13/span 13}.col-lg-13.offset-lg-14{grid-column:14/span 13}.col-lg-13.offset-lg-15{grid-column:15/span 13}.col-lg-13.offset-lg-16{grid-column:16/span 13}.col-14,.col-lg-14{grid-column:span 14}.col-lg-14.offset-lg-2{grid-column:2/span 14}.col-lg-14.offset-lg-3{grid-column:3/span 14}.col-lg-14.offset-lg-4{grid-column:4/span 14}.col-lg-14.offset-lg-5{grid-column:5/span 14}.col-lg-14.offset-lg-6{grid-column:6/span 14}.col-lg-14.offset-lg-7{grid-column:7/span 14}.col-lg-14.offset-lg-8{grid-column:8/span 14}.col-lg-14.offset-lg-9{grid-column:9/span 14}.col-lg-14.offset-lg-10{grid-column:10/span 14}.col-lg-14.offset-lg-11{grid-column:11/span 14}.col-lg-14.offset-lg-12{grid-column:12/span 14}.col-lg-14.offset-lg-13{grid-column:13/span 14}.col-lg-14.offset-lg-14{grid-column:14/span 14}.col-lg-14.offset-lg-15{grid-column:15/span 14}.col-lg-14.offset-lg-16{grid-column:16/span 14}.col-15,.col-lg-15{grid-column:span 15}.col-lg-15.offset-lg-2{grid-column:2/span 15}.col-lg-15.offset-lg-3{grid-column:3/span 15}.col-lg-15.offset-lg-4{grid-column:4/span 15}.col-lg-15.offset-lg-5{grid-column:5/span 15}.col-lg-15.offset-lg-6{grid-column:6/span 15}.col-lg-15.offset-lg-7{grid-column:7/span 15}.col-lg-15.offset-lg-8{grid-column:8/span 15}.col-lg-15.offset-lg-9{grid-column:9/span 15}.col-lg-15.offset-lg-10{grid-column:10/span 15}.col-lg-15.offset-lg-11{grid-column:11/span 15}.col-lg-15.offset-lg-12{grid-column:12/span 15}.col-lg-15.offset-lg-13{grid-column:13/span 15}.col-lg-15.offset-lg-14{grid-column:14/span 15}.col-lg-15.offset-lg-15{grid-column:15/span 15}.col-lg-15.offset-lg-16{grid-column:16/span 15}.col-16,.col-lg-16{grid-column:span 16}.col-lg-16.offset-lg-2{grid-column:2/span 16}.col-lg-16.offset-lg-3{grid-column:3/span 16}.col-lg-16.offset-lg-4{grid-column:4/span 16}.col-lg-16.offset-lg-5{grid-column:5/span 16}.col-lg-16.offset-lg-6{grid-column:6/span 16}.col-lg-16.offset-lg-7{grid-column:7/span 16}.col-lg-16.offset-lg-8{grid-column:8/span 16}.col-lg-16.offset-lg-9{grid-column:9/span 16}.col-lg-16.offset-lg-10{grid-column:10/span 16}.col-lg-16.offset-lg-11{grid-column:11/span 16}.col-lg-16.offset-lg-12{grid-column:12/span 16}.col-lg-16.offset-lg-13{grid-column:13/span 16}.col-lg-16.offset-lg-14{grid-column:14/span 16}.col-lg-16.offset-lg-15{grid-column:15/span 16}.col-lg-16.offset-lg-16{grid-column:16/span 16}}@media only screen and (min-width:1260px){.col-1,.col-xl-1{grid-column:span 1}.col-xl-1.offset-xl-2{grid-column:2/span 1}.col-xl-1.offset-xl-3{grid-column:3/span 1}.col-xl-1.offset-xl-4{grid-column:4/span 1}.col-xl-1.offset-xl-5{grid-column:5/span 1}.col-xl-1.offset-xl-6{grid-column:6/span 1}.col-xl-1.offset-xl-7{grid-column:7/span 1}.col-xl-1.offset-xl-8{grid-column:8/span 1}.col-xl-1.offset-xl-9{grid-column:9/span 1}.col-xl-1.offset-xl-10{grid-column:10/span 1}.col-xl-1.offset-xl-11{grid-column:11/span 1}.col-xl-1.offset-xl-12{grid-column:12/span 1}.col-xl-1.offset-xl-13{grid-column:13/span 1}.col-xl-1.offset-xl-14{grid-column:14/span 1}.col-xl-1.offset-xl-15{grid-column:15/span 1}.col-xl-1.offset-xl-16{grid-column:16/span 1}.col-2,.col-xl-2{grid-column:span 2}.col-xl-2.offset-xl-2{grid-column:2/span 2}.col-xl-2.offset-xl-3{grid-column:3/span 2}.col-xl-2.offset-xl-4{grid-column:4/span 2}.col-xl-2.offset-xl-5{grid-column:5/span 2}.col-xl-2.offset-xl-6{grid-column:6/span 2}.col-xl-2.offset-xl-7{grid-column:7/span 2}.col-xl-2.offset-xl-8{grid-column:8/span 2}.col-xl-2.offset-xl-9{grid-column:9/span 2}.col-xl-2.offset-xl-10{grid-column:10/span 2}.col-xl-2.offset-xl-11{grid-column:11/span 2}.col-xl-2.offset-xl-12{grid-column:12/span 2}.col-xl-2.offset-xl-13{grid-column:13/span 2}.col-xl-2.offset-xl-14{grid-column:14/span 2}.col-xl-2.offset-xl-15{grid-column:15/span 2}.col-xl-2.offset-xl-16{grid-column:16/span 2}.col-3,.col-xl-3{grid-column:span 3}.col-xl-3.offset-xl-2{grid-column:2/span 3}.col-xl-3.offset-xl-3{grid-column:3/span 3}.col-xl-3.offset-xl-4{grid-column:4/span 3}.col-xl-3.offset-xl-5{grid-column:5/span 3}.col-xl-3.offset-xl-6{grid-column:6/span 3}.col-xl-3.offset-xl-7{grid-column:7/span 3}.col-xl-3.offset-xl-8{grid-column:8/span 3}.col-xl-3.offset-xl-9{grid-column:9/span 3}.col-xl-3.offset-xl-10{grid-column:10/span 3}.col-xl-3.offset-xl-11{grid-column:11/span 3}.col-xl-3.offset-xl-12{grid-column:12/span 3}.col-xl-3.offset-xl-13{grid-column:13/span 3}.col-xl-3.offset-xl-14{grid-column:14/span 3}.col-xl-3.offset-xl-15{grid-column:15/span 3}.col-xl-3.offset-xl-16{grid-column:16/span 3}.col-4,.col-xl-4{grid-column:span 4}.col-xl-4.offset-xl-2{grid-column:2/span 4}.col-xl-4.offset-xl-3{grid-column:3/span 4}.col-xl-4.offset-xl-4{grid-column:4/span 4}.col-xl-4.offset-xl-5{grid-column:5/span 4}.col-xl-4.offset-xl-6{grid-column:6/span 4}.col-xl-4.offset-xl-7{grid-column:7/span 4}.col-xl-4.offset-xl-8{grid-column:8/span 4}.col-xl-4.offset-xl-9{grid-column:9/span 4}.col-xl-4.offset-xl-10{grid-column:10/span 4}.col-xl-4.offset-xl-11{grid-column:11/span 4}.col-xl-4.offset-xl-12{grid-column:12/span 4}.col-xl-4.offset-xl-13{grid-column:13/span 4}.col-xl-4.offset-xl-14{grid-column:14/span 4}.col-xl-4.offset-xl-15{grid-column:15/span 4}.col-xl-4.offset-xl-16{grid-column:16/span 4}.col-5,.col-xl-5{grid-column:span 5}.col-xl-5.offset-xl-2{grid-column:2/span 5}.col-xl-5.offset-xl-3{grid-column:3/span 5}.col-xl-5.offset-xl-4{grid-column:4/span 5}.col-xl-5.offset-xl-5{grid-column:5/span 5}.col-xl-5.offset-xl-6{grid-column:6/span 5}.col-xl-5.offset-xl-7{grid-column:7/span 5}.col-xl-5.offset-xl-8{grid-column:8/span 5}.col-xl-5.offset-xl-9{grid-column:9/span 5}.col-xl-5.offset-xl-10{grid-column:10/span 5}.col-xl-5.offset-xl-11{grid-column:11/span 5}.col-xl-5.offset-xl-12{grid-column:12/span 5}.col-xl-5.offset-xl-13{grid-column:13/span 5}.col-xl-5.offset-xl-14{grid-column:14/span 5}.col-xl-5.offset-xl-15{grid-column:15/span 5}.col-xl-5.offset-xl-16{grid-column:16/span 5}.col-6,.col-xl-6{grid-column:span 6}.col-xl-6.offset-xl-2{grid-column:2/span 6}.col-xl-6.offset-xl-3{grid-column:3/span 6}.col-xl-6.offset-xl-4{grid-column:4/span 6}.col-xl-6.offset-xl-5{grid-column:5/span 6}.col-xl-6.offset-xl-6{grid-column:6/span 6}.col-xl-6.offset-xl-7{grid-column:7/span 6}.col-xl-6.offset-xl-8{grid-column:8/span 6}.col-xl-6.offset-xl-9{grid-column:9/span 6}.col-xl-6.offset-xl-10{grid-column:10/span 6}.col-xl-6.offset-xl-11{grid-column:11/span 6}.col-xl-6.offset-xl-12{grid-column:12/span 6}.col-xl-6.offset-xl-13{grid-column:13/span 6}.col-xl-6.offset-xl-14{grid-column:14/span 6}.col-xl-6.offset-xl-15{grid-column:15/span 6}.col-xl-6.offset-xl-16{grid-column:16/span 6}.col-7,.col-xl-7{grid-column:span 7}.col-xl-7.offset-xl-2{grid-column:2/span 7}.col-xl-7.offset-xl-3{grid-column:3/span 7}.col-xl-7.offset-xl-4{grid-column:4/span 7}.col-xl-7.offset-xl-5{grid-column:5/span 7}.col-xl-7.offset-xl-6{grid-column:6/span 7}.col-xl-7.offset-xl-7{grid-column:7/span 7}.col-xl-7.offset-xl-8{grid-column:8/span 7}.col-xl-7.offset-xl-9{grid-column:9/span 7}.col-xl-7.offset-xl-10{grid-column:10/span 7}.col-xl-7.offset-xl-11{grid-column:11/span 7}.col-xl-7.offset-xl-12{grid-column:12/span 7}.col-xl-7.offset-xl-13{grid-column:13/span 7}.col-xl-7.offset-xl-14{grid-column:14/span 7}.col-xl-7.offset-xl-15{grid-column:15/span 7}.col-xl-7.offset-xl-16{grid-column:16/span 7}.col-8,.col-xl-8{grid-column:span 8}.col-xl-8.offset-xl-2{grid-column:2/span 8}.col-xl-8.offset-xl-3{grid-column:3/span 8}.col-xl-8.offset-xl-4{grid-column:4/span 8}.col-xl-8.offset-xl-5{grid-column:5/span 8}.col-xl-8.offset-xl-6{grid-column:6/span 8}.col-xl-8.offset-xl-7{grid-column:7/span 8}.col-xl-8.offset-xl-8{grid-column:8/span 8}.col-xl-8.offset-xl-9{grid-column:9/span 8}.col-xl-8.offset-xl-10{grid-column:10/span 8}.col-xl-8.offset-xl-11{grid-column:11/span 8}.col-xl-8.offset-xl-12{grid-column:12/span 8}.col-xl-8.offset-xl-13{grid-column:13/span 8}.col-xl-8.offset-xl-14{grid-column:14/span 8}.col-xl-8.offset-xl-15{grid-column:15/span 8}.col-xl-8.offset-xl-16{grid-column:16/span 8}.col-9,.col-xl-9{grid-column:span 9}.col-xl-9.offset-xl-2{grid-column:2/span 9}.col-xl-9.offset-xl-3{grid-column:3/span 9}.col-xl-9.offset-xl-4{grid-column:4/span 9}.col-xl-9.offset-xl-5{grid-column:5/span 9}.col-xl-9.offset-xl-6{grid-column:6/span 9}.col-xl-9.offset-xl-7{grid-column:7/span 9}.col-xl-9.offset-xl-8{grid-column:8/span 9}.col-xl-9.offset-xl-9{grid-column:9/span 9}.col-xl-9.offset-xl-10{grid-column:10/span 9}.col-xl-9.offset-xl-11{grid-column:11/span 9}.col-xl-9.offset-xl-12{grid-column:12/span 9}.col-xl-9.offset-xl-13{grid-column:13/span 9}.col-xl-9.offset-xl-14{grid-column:14/span 9}.col-xl-9.offset-xl-15{grid-column:15/span 9}.col-xl-9.offset-xl-16{grid-column:16/span 9}.col-10,.col-xl-10{grid-column:span 10}.col-xl-10.offset-xl-2{grid-column:2/span 10}.col-xl-10.offset-xl-3{grid-column:3/span 10}.col-xl-10.offset-xl-4{grid-column:4/span 10}.col-xl-10.offset-xl-5{grid-column:5/span 10}.col-xl-10.offset-xl-6{grid-column:6/span 10}.col-xl-10.offset-xl-7{grid-column:7/span 10}.col-xl-10.offset-xl-8{grid-column:8/span 10}.col-xl-10.offset-xl-9{grid-column:9/span 10}.col-xl-10.offset-xl-10{grid-column:10/span 10}.col-xl-10.offset-xl-11{grid-column:11/span 10}.col-xl-10.offset-xl-12{grid-column:12/span 10}.col-xl-10.offset-xl-13{grid-column:13/span 10}.col-xl-10.offset-xl-14{grid-column:14/span 10}.col-xl-10.offset-xl-15{grid-column:15/span 10}.col-xl-10.offset-xl-16{grid-column:16/span 10}.col-11,.col-xl-11{grid-column:span 11}.col-xl-11.offset-xl-2{grid-column:2/span 11}.col-xl-11.offset-xl-3{grid-column:3/span 11}.col-xl-11.offset-xl-4{grid-column:4/span 11}.col-xl-11.offset-xl-5{grid-column:5/span 11}.col-xl-11.offset-xl-6{grid-column:6/span 11}.col-xl-11.offset-xl-7{grid-column:7/span 11}.col-xl-11.offset-xl-8{grid-column:8/span 11}.col-xl-11.offset-xl-9{grid-column:9/span 11}.col-xl-11.offset-xl-10{grid-column:10/span 11}.col-xl-11.offset-xl-11{grid-column:11/span 11}.col-xl-11.offset-xl-12{grid-column:12/span 11}.col-xl-11.offset-xl-13{grid-column:13/span 11}.col-xl-11.offset-xl-14{grid-column:14/span 11}.col-xl-11.offset-xl-15{grid-column:15/span 11}.col-xl-11.offset-xl-16{grid-column:16/span 11}.col-12,.col-xl-12{grid-column:span 12}.col-xl-12.offset-xl-2{grid-column:2/span 12}.col-xl-12.offset-xl-3{grid-column:3/span 12}.col-xl-12.offset-xl-4{grid-column:4/span 12}.col-xl-12.offset-xl-5{grid-column:5/span 12}.col-xl-12.offset-xl-6{grid-column:6/span 12}.col-xl-12.offset-xl-7{grid-column:7/span 12}.col-xl-12.offset-xl-8{grid-column:8/span 12}.col-xl-12.offset-xl-9{grid-column:9/span 12}.col-xl-12.offset-xl-10{grid-column:10/span 12}.col-xl-12.offset-xl-11{grid-column:11/span 12}.col-xl-12.offset-xl-12{grid-column:12/span 12}.col-xl-12.offset-xl-13{grid-column:13/span 12}.col-xl-12.offset-xl-14{grid-column:14/span 12}.col-xl-12.offset-xl-15{grid-column:15/span 12}.col-xl-12.offset-xl-16{grid-column:16/span 12}.col-13,.col-xl-13{grid-column:span 13}.col-xl-13.offset-xl-2{grid-column:2/span 13}.col-xl-13.offset-xl-3{grid-column:3/span 13}.col-xl-13.offset-xl-4{grid-column:4/span 13}.col-xl-13.offset-xl-5{grid-column:5/span 13}.col-xl-13.offset-xl-6{grid-column:6/span 13}.col-xl-13.offset-xl-7{grid-column:7/span 13}.col-xl-13.offset-xl-8{grid-column:8/span 13}.col-xl-13.offset-xl-9{grid-column:9/span 13}.col-xl-13.offset-xl-10{grid-column:10/span 13}.col-xl-13.offset-xl-11{grid-column:11/span 13}.col-xl-13.offset-xl-12{grid-column:12/span 13}.col-xl-13.offset-xl-13{grid-column:13/span 13}.col-xl-13.offset-xl-14{grid-column:14/span 13}.col-xl-13.offset-xl-15{grid-column:15/span 13}.col-xl-13.offset-xl-16{grid-column:16/span 13}.col-14,.col-xl-14{grid-column:span 14}.col-xl-14.offset-xl-2{grid-column:2/span 14}.col-xl-14.offset-xl-3{grid-column:3/span 14}.col-xl-14.offset-xl-4{grid-column:4/span 14}.col-xl-14.offset-xl-5{grid-column:5/span 14}.col-xl-14.offset-xl-6{grid-column:6/span 14}.col-xl-14.offset-xl-7{grid-column:7/span 14}.col-xl-14.offset-xl-8{grid-column:8/span 14}.col-xl-14.offset-xl-9{grid-column:9/span 14}.col-xl-14.offset-xl-10{grid-column:10/span 14}.col-xl-14.offset-xl-11{grid-column:11/span 14}.col-xl-14.offset-xl-12{grid-column:12/span 14}.col-xl-14.offset-xl-13{grid-column:13/span 14}.col-xl-14.offset-xl-14{grid-column:14/span 14}.col-xl-14.offset-xl-15{grid-column:15/span 14}.col-xl-14.offset-xl-16{grid-column:16/span 14}.col-15,.col-xl-15{grid-column:span 15}.col-xl-15.offset-xl-2{grid-column:2/span 15}.col-xl-15.offset-xl-3{grid-column:3/span 15}.col-xl-15.offset-xl-4{grid-column:4/span 15}.col-xl-15.offset-xl-5{grid-column:5/span 15}.col-xl-15.offset-xl-6{grid-column:6/span 15}.col-xl-15.offset-xl-7{grid-column:7/span 15}.col-xl-15.offset-xl-8{grid-column:8/span 15}.col-xl-15.offset-xl-9{grid-column:9/span 15}.col-xl-15.offset-xl-10{grid-column:10/span 15}.col-xl-15.offset-xl-11{grid-column:11/span 15}.col-xl-15.offset-xl-12{grid-column:12/span 15}.col-xl-15.offset-xl-13{grid-column:13/span 15}.col-xl-15.offset-xl-14{grid-column:14/span 15}.col-xl-15.offset-xl-15{grid-column:15/span 15}.col-xl-15.offset-xl-16{grid-column:16/span 15}.col-16,.col-xl-16{grid-column:span 16}.col-xl-16.offset-xl-2{grid-column:2/span 16}.col-xl-16.offset-xl-3{grid-column:3/span 16}.col-xl-16.offset-xl-4{grid-column:4/span 16}.col-xl-16.offset-xl-5{grid-column:5/span 16}.col-xl-16.offset-xl-6{grid-column:6/span 16}.col-xl-16.offset-xl-7{grid-column:7/span 16}.col-xl-16.offset-xl-8{grid-column:8/span 16}.col-xl-16.offset-xl-9{grid-column:9/span 16}.col-xl-16.offset-xl-10{grid-column:10/span 16}.col-xl-16.offset-xl-11{grid-column:11/span 16}.col-xl-16.offset-xl-12{grid-column:12/span 16}.col-xl-16.offset-xl-13{grid-column:13/span 16}.col-xl-16.offset-xl-14{grid-column:14/span 16}.col-xl-16.offset-xl-15{grid-column:15/span 16}.col-xl-16.offset-xl-16{grid-column:16/span 16}}.button,a.button{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:1em;font-weight:700;text-decoration:none;white-space:nowrap;outline:none;width:-webkit-min-content;width:-moz-min-content;width:min-content;background:#fff;background-image:none;border:1px solid #c6c6c6;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:4px;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;line-height:1;padding:.935rem 1.6rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:visible;text-align:center}.button,.button:focus,.button:hover,a.button,a.button:focus,a.button:hover{color:#3f4143;-webkit-transition:background .2s,color .2s;transition:background .2s,color .2s}.button:focus,.button:hover,a.button:focus,a.button:hover{background:#e6e6e6;background-image:none}.button:active,a.button:active{color:#3f4143;background:#fff}.button:focus,a.button:focus{background:#fff}.button:focus>[class^=material-icons],.button:focus>i,a.button:focus>[class^=material-icons],a.button:focus>i{color:#0a8fff}.button.active,a.button.active{color:#3f4143;background:#dcdcdc;background-image:none;text-decoration:none}.button.active:focus,.button.active:hover,a.button.active:focus,a.button.active:hover{color:#3f4143;background:#e6e6e6}.button.active [class^=material-icons],.button.active i,a.button.active [class^=material-icons],a.button.active i{color:#3f4143;text-shadow:none}.button.disabled,.button:disabled,.button[disabled],a.button.disabled,a.button:disabled,a.button[disabled]{cursor:default;opacity:.59;pointer-events:none}.button.block,a.button.block{display:block;width:100%}.button [class^=material-icons],.button i,a.button [class^=material-icons],a.button i{font-size:1.35em;color:#3f4143;text-shadow:none}.button.primary,a.button.primary{background:#0a8fff;color:#fff;text-shadow:0 1px 1px #007fea;border:1px solid #2e9fff}.button.primary.active,.button.primary:active,.button.primary:hover,a.button.primary.active,a.button.primary:active,a.button.primary:hover{background:#30a0ff;color:#fff}.button.primary [class^=material-icons],.button.primary i,a.button.primary [class^=material-icons],a.button.primary i{color:#fff;text-shadow:none}.button.success,a.button.success{background:#2ec4b6;color:#fff;text-shadow:0 1px 1px #28ab9f;border:1px solid #43d3c5}.button.success.active,.button.success:active,.button.success:hover,a.button.success.active,a.button.success:active,a.button.success:hover{background:#45d3c6;color:#fff}.button.success [class^=material-icons],.button.success i,a.button.success [class^=material-icons],a.button.success i{color:#fff;text-shadow:none}.button.warning,a.button.warning{background:#de9e36;color:#fff;text-shadow:0 1px 1px #d39023;border:1px solid #e3ad55}.button.warning.active,.button.warning:active,.button.warning:hover,a.button.warning.active,a.button.warning:active,a.button.warning:hover{background:#e3ae57;color:#fff}.button.warning [class^=material-icons],.button.warning i,a.button.warning [class^=material-icons],a.button.warning i{color:#fff;text-shadow:none}.button.error,a.button.error{background:#d62828;color:#fff;text-shadow:0 1px 1px #bc2323;border:1px solid #dc4545}.button.error.active,.button.error:active,.button.error:hover,a.button.error.active,a.button.error:active,a.button.error:hover{background:#dd4848;color:#fff}.button.error [class^=material-icons],.button.error i,a.button.error [class^=material-icons],a.button.error i{color:#fff;text-shadow:none}.button.dark,a.button.dark{background:#26272b;color:#fff;text-shadow:0 1px 1px #18181b;border:1px solid #37383e}.button.dark.active,.button.dark:active,.button.dark:hover,a.button.dark.active,a.button.dark:active,a.button.dark:hover{background:#38393f;color:#fff}.button.dark [class^=material-icons],.button.dark i,a.button.dark [class^=material-icons],a.button.dark i{color:#fff;text-shadow:none}.button.link.button,.button.link>.button,a.button.link.button,a.button.link>.button{background:transparent;color:#fff;text-shadow:0 1px 1px transparent;border:1px solid;-webkit-box-shadow:none;box-shadow:none;border:none;color:#3f4143}.button.link.button.active,.button.link.button:active,.button.link.button:hover,.button.link>.button.active,.button.link>.button:active,.button.link>.button:hover,a.button.link.button.active,a.button.link.button:active,a.button.link.button:hover,a.button.link>.button.active,a.button.link>.button:active,a.button.link>.button:hover{background:hsla(0,0%,7%,0);color:#fff}.button.link.button [class^=material-icons],.button.link.button i,.button.link>.button [class^=material-icons],.button.link>.button i,a.button.link.button [class^=material-icons],a.button.link.button i,a.button.link>.button [class^=material-icons],a.button.link>.button i{color:#fff;text-shadow:none}.button.link.button:hover,.button.link>.button:hover,a.button.link.button:hover,a.button.link>.button:hover{background:#dcdcdc;color:#3f4143}.button.tiny,a.button.tiny{font-size:.809em;padding:.415rem .5rem;font-weight:700}.button.mini,a.button.mini{font-size:.909em;padding:.445rem .9rem;font-weight:700}.button.small,a.button.small{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.button.large,a.button.large{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.button.huge,a.button.huge{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}.button.secondary,a.button.secondary{color:#3f4143;background-image:-webkit-gradient(linear,left bottom,left top,from(#e6e6e6),to(#fff));background-image:linear-gradient(0deg,#e6e6e6 0,#fff)}.button.secondary.active,.button.secondary:active,.button.secondary:focus,.button.secondary:hover,a.button.secondary.active,a.button.secondary:active,a.button.secondary:focus,a.button.secondary:hover{color:#3f4143;background-image:-webkit-gradient(linear,left bottom,left top,from(#fff),to(#e6e6e6));background-image:linear-gradient(0deg,#fff 0,#e6e6e6);z-index:1;border-color:#c6c6c6}.button.secondary.active [class^=material-icons],.button.secondary.active i,.button.secondary:active [class^=material-icons],.button.secondary:active i,.button.secondary:focus [class^=material-icons],.button.secondary:focus i,.button.secondary:hover [class^=material-icons],.button.secondary:hover i,a.button.secondary.active [class^=material-icons],a.button.secondary.active i,a.button.secondary:active [class^=material-icons],a.button.secondary:active i,a.button.secondary:focus [class^=material-icons],a.button.secondary:focus i,a.button.secondary:hover [class^=material-icons],a.button.secondary:hover i{color:#3f4143}.buttons{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-negative:0;flex-shrink:0;border-radius:4px;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15)}.buttons .button{-webkit-box-shadow:none;box-shadow:none}.buttons .button:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.buttons .button:not(:first-child):not(:last-child){border-radius:0;margin-left:-1px}.buttons .button:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}.buttons.secondary>.button{color:#3f4143;background-image:-webkit-gradient(linear,left bottom,left top,from(#e6e6e6),to(#fff));background-image:linear-gradient(0deg,#e6e6e6 0,#fff)}.buttons.secondary>.button.active,.buttons.secondary>.button:active,.buttons.secondary>.button:focus,.buttons.secondary>.button:hover{color:#3f4143;background-image:-webkit-gradient(linear,left bottom,left top,from(#fff),to(#e6e6e6));background-image:linear-gradient(0deg,#fff 0,#e6e6e6);z-index:1;border-color:#c6c6c6}.buttons.secondary>.button.active [class^=material-icons],.buttons.secondary>.button.active i,.buttons.secondary>.button:active [class^=material-icons],.buttons.secondary>.button:active i,.buttons.secondary>.button:focus [class^=material-icons],.buttons.secondary>.button:focus i,.buttons.secondary>.button:hover [class^=material-icons],.buttons.secondary>.button:hover i{color:#3f4143}.buttons.block{display:-webkit-box;display:-ms-flexbox;display:flex}.buttons.block .button{-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0}.buttons .inactive{padding-left:.45rem!important;padding-right:.45rem!important;pointer-events:none;cursor:default;background-image:none!important}.buttons.tiny>.button,.buttons.tiny>.dropdown>.button{font-size:.809em;padding:.415rem .5rem;font-weight:700}.buttons.mini>.button,.buttons.mini>.dropdown>.button{font-size:.909em;padding:.445rem .9rem;font-weight:700}.buttons.small>.button,.buttons.small>.dropdown>.button{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.buttons.large>.button,.buttons.large>.dropdown>.button{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.buttons.huge>.button,.buttons.huge>.dropdown>.button{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}.buttons.primary>.button,.buttons.primary>.dropdown>.button{background:#0a8fff;color:#fff;text-shadow:0 1px 1px #007fea;border:1px solid #007ce5}.buttons.primary>.button.active,.buttons.primary>.button:active,.buttons.primary>.button:hover,.buttons.primary>.dropdown>.button.active,.buttons.primary>.dropdown>.button:active,.buttons.primary>.dropdown>.button:hover{background:#30a0ff;color:#fff}.buttons.primary>.button [class^=material-icons],.buttons.primary>.button i,.buttons.primary>.dropdown>.button [class^=material-icons],.buttons.primary>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.success>.button,.buttons.success>.dropdown>.button{background:#2ec4b6;color:#fff;text-shadow:0 1px 1px #28ab9f;border:1px solid #27a79b}.buttons.success>.button.active,.buttons.success>.button:active,.buttons.success>.button:hover,.buttons.success>.dropdown>.button.active,.buttons.success>.dropdown>.button:active,.buttons.success>.dropdown>.button:hover{background:#45d3c6;color:#fff}.buttons.success>.button [class^=material-icons],.buttons.success>.button i,.buttons.success>.dropdown>.button [class^=material-icons],.buttons.success>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.warning>.button,.buttons.warning>.dropdown>.button{background:#de9e36;color:#fff;text-shadow:0 1px 1px #d39023;border:1px solid #ce8d22}.buttons.warning>.button.active,.buttons.warning>.button:active,.buttons.warning>.button:hover,.buttons.warning>.dropdown>.button.active,.buttons.warning>.dropdown>.button:active,.buttons.warning>.dropdown>.button:hover{background:#e3ae57;color:#fff}.buttons.warning>.button [class^=material-icons],.buttons.warning>.button i,.buttons.warning>.dropdown>.button [class^=material-icons],.buttons.warning>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.error>.button,.buttons.error>.dropdown>.button{background:#d62828;color:#fff;text-shadow:0 1px 1px #bc2323;border:1px solid #b82222}.buttons.error>.button.active,.buttons.error>.button:active,.buttons.error>.button:hover,.buttons.error>.dropdown>.button.active,.buttons.error>.dropdown>.button:active,.buttons.error>.dropdown>.button:hover{background:#dd4848;color:#fff}.buttons.error>.button [class^=material-icons],.buttons.error>.button i,.buttons.error>.dropdown>.button [class^=material-icons],.buttons.error>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.dark>.button,.buttons.dark>.dropdown>.button{background:#26272b;color:#fff;text-shadow:0 1px 1px #18181b;border:1px solid #151618}.buttons.dark>.button.active,.buttons.dark>.button:active,.buttons.dark>.button:hover,.buttons.dark>.dropdown>.button.active,.buttons.dark>.dropdown>.button:active,.buttons.dark>.dropdown>.button:hover{background:#38393f;color:#fff}.buttons.dark>.button [class^=material-icons],.buttons.dark>.button i,.buttons.dark>.dropdown>.button [class^=material-icons],.buttons.dark>.dropdown>.button i{color:#fff;text-shadow:none}.buttons.link.button,.buttons.link>.button{background:transparent;color:#fff;text-shadow:0 1px 1px transparent;border:1px solid;-webkit-box-shadow:none;box-shadow:none;border:none;color:#3f4143}.buttons.link.button.active,.buttons.link.button:active,.buttons.link.button:hover,.buttons.link>.button.active,.buttons.link>.button:active,.buttons.link>.button:hover{background:hsla(0,0%,7%,0);color:#fff}.buttons.link.button [class^=material-icons],.buttons.link.button i,.buttons.link>.button [class^=material-icons],.buttons.link>.button i{color:#fff;text-shadow:none}.buttons.link.button:hover,.buttons.link>.button:hover{background:#dcdcdc;color:#3f4143}.buttons .dropdown:last-child:not(:first-child),.buttons .dropdown:last-child:not(:first-child)>.button{border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}.buttons .dropdown:last-child,.buttons .dropdown:last-child>.button:first-child,.buttons .dropdown:last-child>.button:last-child{border-bottom-right-radius:4px;border-top-right-radius:4px}.buttons .dropdown:not(:first-child):not(:last-child)>.button{border-radius:0;margin-left:-1px}@media only screen and (max-width:768px){.buttons{-webkit-box-shadow:none;box-shadow:none}}.buttons.vertical{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column}.buttons.vertical.block,.buttons.vertical.block>.button,.buttons.vertical>.button,.buttons.vertical>.dropdown>.button{width:100%}.buttons.vertical>.button{border-radius:0}.buttons.vertical>.button:last-child:not(:first-child),.buttons.vertical>.button:not(:first-child):not(:last-child){margin:-1px 0 0}.buttons.vertical.block{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.buttons.vertical>.dropdown:last-child:not(:first-child),.buttons.vertical>.dropdown:last-child:not(:first-child)>.button,.buttons.vertical>.dropdown:not(:first-child):not(:last-child)>.button{margin:-1px 0 0;border-radius:0}.buttons.vertical>.dropdown>.primary.button,.buttons.vertical>.primary.button{border:1px solid #007fea}.buttons.vertical>.dropdown>.success.button,.buttons.vertical>.success.button{border:1px solid #28ab9f}.buttons.vertical>.dropdown>.warning.button,.buttons.vertical>.warning.button{border:1px solid #d39023}.buttons.vertical>.dropdown>.error.button,.buttons.vertical>.error.button{border:1px solid #bc2323}.buttons.vertical>.dark.button,.buttons.vertical>.dropdown>.dark.button{border:1px solid #18181b}.dropdown{display:inline-block;position:relative}.dropdown>.menu{-webkit-animation:slide-down .15s ease 1;animation:slide-down .15s ease 1;display:none;left:0;max-height:45vh;overflow-y:auto;position:absolute;top:100%;z-index:301;width:auto}.dropdown>.menu>.item>a{padding:.1rem .9rem}.dropdown.left>.menu,.dropdown.right>.menu{top:0}.dropdown.right>.menu{left:100%;right:auto}.dropdown.left>.menu{left:auto;right:100%}.dropdown.top.left>.menu{right:auto!important;left:0!important}.dropdown.top.right>.menu{right:0!important;left:auto!important}.dropdown.top>.menu{bottom:100%;top:auto;right:0;left:auto;-webkit-box-shadow:0 -3px 10px rgba(0,0,0,.15);box-shadow:0 -3px 10px rgba(0,0,0,.15)}.dropdown.bottom.left>.menu,.dropdown.bottom.right>.menu{top:100%}.dropdown.bottom.left>.menu{right:auto!important;left:0!important}.dropdown.bottom.right>.menu{right:0!important;left:auto!important}.dropdown.active>.menu,.dropdown>.menu:focus,.dropdown>.menu:hover,.dropdown>.toggle:focus+.menu,.dropdown>.toggle:hover+.menu{display:block}.dropdown.clickable>.toggle:hover+.menu{display:none}.dropdown.clickable>.toggle:active+.menu,.dropdown.clickable>.toggle:focus+.menu{display:block}.dropdown>.buttons>.toggle:nth-last-child(2){border-bottom-right-radius:4px;border-top-right-radius:4px}.dropdown.tiny>.button,.dropdown.tiny>.dropdown>.button{font-size:.809em;padding:.415rem .5rem;font-weight:700}.dropdown.mini>.button,.dropdown.mini>.dropdown>.button{font-size:.909em;padding:.445rem .9rem;font-weight:700}.dropdown.small>.button,.dropdown.small>.dropdown>.button{font-size:.979em;padding:.645rem 1.4rem;font-weight:700}.dropdown.large>.button,.dropdown.large>.dropdown>.button{font-size:1.25em;padding:1.15rem 2.1rem;font-weight:700}.dropdown.huge>.button,.dropdown.huge>.dropdown>.button{font-size:1.45em;padding:1.3rem 2.4rem;font-weight:700}input:not([type]),input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=file],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{-webkit-appearance:none;background-color:#fff;border:1px solid #c6c6c6;height:2.5rem;border-radius:0;outline:2px solid transparent;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:inherit;box-sizing:inherit;outline-offset:-2px;padding:.4rem .5rem;width:100%;max-width:100%;font-family:inherit;color:#3f4143;font-size:1.088em}input:not([type]):focus,input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=datetime]:focus,input[type=email]:focus,input[type=file]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select:focus,textarea:focus{outline:2px solid #26272b;outline-offset:-2px;-webkit-transition:.35s;transition:.35s}input:not([type]).success,input[type=color].success,input[type=date].success,input[type=datetime-local].success,input[type=datetime].success,input[type=email].success,input[type=file].success,input[type=month].success,input[type=number].success,input[type=password].success,input[type=search].success,input[type=tel].success,input[type=text].success,input[type=time].success,input[type=url].success,input[type=week].success,select.success,textarea.success{color:#2ec4b6;outline-color:#2ec4b6}input:not([type]).error,input[type=color].error,input[type=date].error,input[type=datetime-local].error,input[type=datetime].error,input[type=email].error,input[type=file].error,input[type=month].error,input[type=number].error,input[type=password].error,input[type=search].error,input[type=tel].error,input[type=text].error,input[type=time].error,input[type=url].error,input[type=week].error,select.error,textarea.error{color:#d62828;outline-color:#d62828}select{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTE2LjU5IDguNTlMMTIgMTMuMTcgNy40MSA4LjU5IDYgMTBsNiA2IDYtNnoiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:right 10px center}select[multiple]{background:none;height:auto}textarea{min-height:6.5rem;resize:vertical}label,legend{display:block;font-size:1rem;font-weight:400}fieldset{border-width:0;padding:0}input[type=checkbox],input[type=radio]{display:inline}input:disabled{opacity:.59}.form{position:relative;max-width:100%;padding:0 16px}.form .item{margin:6px 0 .75em;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;width:100%;max-width:100%;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.form .item,.form .item>label,.form label{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.form .item>label,.form label{margin:0;color:#3f4143;font-size:.8579rem;font-weight:700;text-transform:none}.form .item>input[type=file]{opacity:0;position:absolute;top:0;left:0;height:100%;cursor:default}.form .group,.form .item>.group{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}.form .group>*,.form .item>.group>*{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}.form .group>:last-child,.form .item>.group>:last-child{margin-left:-1px}.form .group>:not(:first-child):not(:last-child),.form .item>.group>:not(:first-child):not(:last-child){margin-left:-1px;margin-right:0}.form .group>.buttons,.form .item>.group>.buttons{-webkit-box-shadow:none;box-shadow:none}.form .group>.button,.form .item>.group>.button{height:2.5rem;-webkit-box-shadow:none;box-shadow:none}.form .group>.button:first-child,.form .item>.group>.button:first-child{border-bottom-right-radius:0;border-top-right-radius:0}.form .group>.button:last-child:not(:first-child),.form .item>.group>.button:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.form .items{margin:6px 0 .75em;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form .items>.item{margin:6px 6px .75em}.form .two.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.5 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.5 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .two.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .three.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.333333333333333 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.333333333333333 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .three.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .four.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.25 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.25 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .four.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .five.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.2 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.2 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .five.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .six.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.166666666666667 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.166666666666667 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .six.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .seven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.142857142857143 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.142857142857143 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .seven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .eight.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.125 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.125 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .eight.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .nine.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.111111111111111 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.111111111111111 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .nine.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .ten.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.1 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.1 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .ten.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .eleven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.090909090909091 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.090909090909091 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .eleven.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .twelve.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.083333333333333 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.083333333333333 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .twelve.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .thirteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.076923076923077 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.076923076923077 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .thirteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .fourteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.071428571428571 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.071428571428571 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .fourteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .fifteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.066666666666667 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.066666666666667 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .fifteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form .sixteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.0625 - (2 * 6px 6px 0.75em));flex:0 0 calc(100% * 0.0625 - (2 * 6px 6px 0.75em))}@media only screen and (max-width:768px){.form .sixteen.items>.item{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%}}.form.small input:not([type]),.form.small input[type=color],.form.small input[type=date],.form.small input[type=datetime-local],.form.small input[type=datetime],.form.small input[type=email],.form.small input[type=file],.form.small input[type=month],.form.small input[type=number],.form.small input[type=password],.form.small input[type=search],.form.small input[type=tel],.form.small input[type=text],.form.small input[type=time],.form.small input[type=url],.form.small input[type=week],.form.small select,.form.small textarea{height:1.9rem;font-size:1em}.form.small .button{height:1.9rem!important;font-size:.979em!important;padding:.645rem 1.4rem!important}.form.small>.item>label,.form.small>.items>.item>label,.form.small label{font-size:1em}.form.large input:not([type]),.form.large input[type=color],.form.large input[type=date],.form.large input[type=datetime-local],.form.large input[type=datetime],.form.large input[type=email],.form.large input[type=file],.form.large input[type=month],.form.large input[type=number],.form.large input[type=password],.form.large input[type=search],.form.large input[type=tel],.form.large input[type=text],.form.large input[type=time],.form.large input[type=url],.form.large input[type=week],.form.large select,.form.large textarea{height:2.9rem;font-size:1.2em}.form.large .button{height:2.9rem!important;font-size:1.25em!important;padding:1.15rem 2.1rem!important}.form.large>.item>label,.form.large>.items>.item>label,.form.large label{font-size:1.2em}.checkbox,.radio{position:relative}.checkbox label,.radio label{padding:0 1.2rem 0 1.7rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-weight:400;margin:0}.checkbox input,.radio input{left:0;opacity:0;position:absolute;top:0}.checkbox input+label:after,.checkbox input+label:before,.radio input+label:after,.radio input+label:before{position:absolute;-webkit-transition:opacity .11s ease-in-out;transition:opacity .11s ease-in-out;font-family:Material Icons;font-style:normal;font-weight:400;text-transform:none;font-size:1.35rem;top:-8px;left:0}.checkbox input+label:before,.radio input+label:before{opacity:1}.checkbox input+label:after,.radio input+label:after{opacity:0}.checkbox input:checked+label:after,.radio input:checked+label:after{opacity:1}.checkbox input+label:before{content:"check_box_outline_blank";color:#3f4143}.checkbox input+label:after{content:"check_box";color:#0a8fff}.radio input+label:before{content:"radio_button_unchecked";color:#3f4143}.radio input+label:after{content:"radio_button_checked";color:#0a8fff}h1{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h1,h1{font-size:2rem;font-weight:900}@media only screen and (max-width:768px){.h1,h1{font-size:1.7rem}}h2{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h2,h2{font-size:1.8rem;font-weight:900}@media only screen and (max-width:768px){.h2,h2{font-size:1.5rem}}h3{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h3,h3{font-size:1.6rem;font-weight:900}@media only screen and (max-width:768px){.h3,h3{font-size:1.3rem}}h4{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h4,h4{font-size:1.4rem;font-weight:900}@media only screen and (max-width:768px){.h4,h4{font-size:1.1rem}}h5{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h5,h5{font-size:1.2rem;font-weight:900}@media only screen and (max-width:768px){.h5,h5{font-size:.9rem}}h6{margin-top:0;color:inherit;line-height:2;margin-bottom:1em}.h6,h6{font-size:1rem;font-weight:900}@media only screen and (max-width:768px){.h6,h6{font-size:inherit}}.h1.bordered,.h2.bordered,.h3.bordered,.h4.bordered,.h5.bordered,.h6.bordered,h1.bordered,h2.bordered,h3.bordered,h4.bordered,h5.bordered,h6.bordered{border-width:0 0 1px!important;padding-bottom:10px;margin-bottom:20px}p{margin:0 0 1em;font-size:1.0495rem}a,ins,u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}abbr[title]{border-bottom:1px dotted;cursor:help;text-decoration:none}blockquote{border-left:.1rem dotted #26272b;margin-left:0;padding:.4rem .8rem;font-style:italic;color:#3f4143}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}.table{position:relative;border-collapse:collapse;border-spacing:0;width:100%;max-width:100%;text-align:left;margin-bottom:1.5rem}.table.striped tbody tr.active,.table.striped tbody tr:nth-of-type(odd),.table.striped tr.active,.table.striped tr:nth-of-type(odd){background:#e6e6e6}.table.striped thead tr{background:transparent!important}.table.hovered tbody tr:hover,.table.hovered tr:hover{background:#e6e6e6;color:#3f4143}.table.hovered thead tr{background:transparent!important}.table tbody tr,.table tr{-webkit-transition:all .3s;transition:all .3s}.table tbody tr.active,.table tbody tr.active:hover,.table tr.active,.table tr.active:hover{background:#e6e6e6}.table td,.table th{border-bottom:1px solid #e6e6e6;padding:5px 7px;text-align:inherit}.table thead tr{background:transparent}.table thead tr th{border-bottom-width:1px;border-bottom-color:#c6c6c6;font-weight:400;color:#a8a8a8}.material-icons{font-size:1.1rem;line-height:1;vertical-align:middle}.label,a.label{background-color:#fff;color:#3f4143;display:inline-block;font-weight:700;line-height:1.2;margin:.1rem .05rem;border-radius:4px;text-decoration:none;border:1px solid #c6c6c6;-webkit-box-shadow:0 .155em 0 rgba(0,0,0,.095);box-shadow:0 .155em 0 rgba(0,0,0,.095);border-color:#c6c6c6;padding:.28rem .9rem;font-size:.9195em}.label>.material-icons,.label>i,a.label>.material-icons,a.label>i{vertical-align:text-top}.label.primary,a.label.primary{background-color:#0a8fff;color:#fff;border-color:#007ce5}.label.success,a.label.success{background-color:#2ec4b6;color:#fff;border-color:#27a79b}.label.warning,a.label.warning{background-color:#de9e36;color:#fff;border-color:#ce8d22}.label.error,a.label.error{background-color:#d62828;color:#fff;border-color:#b82222}.label.dark,a.label.dark{background-color:#26272b;color:#fff;border-color:#151618}.label.small,a.label.small{padding:.18rem .85rem;font-size:.8195em}.label.large,a.label.large{padding:.415rem 1.159rem;font-size:1em}.alert{color:#3f4143;display:block;border:1px solid #c6c6c6;border-radius:4px;padding:.6rem;margin:0 0 8px;width:100%;font-weight:700}.alert a{color:#3f4143;text-decoration:underline}.alert a.active,.alert a:active,.alert a:focus,.alert a:hover{opacity:.75}.alert p:last-child{margin-bottom:0}.alert>.material-icons,.alert>i{vertical-align:text-top}.alert.primary{background-color:#0a8fff;color:#fff;border-color:#0082f0}.alert.success{background-color:#2ec4b6;color:#fff;border-color:#29afa3}.alert.warning{background-color:#de9e36;color:#fff;border-color:#d79323}.alert.error{background-color:#d62828;color:#fff;border-color:#c12424}.alert.dark{background-color:#26272b;color:#fff;border-color:#1a1b1d}.alert.small{padding:.4rem;font-size:.749rem}.alert.large{padding:.8rem;font-size:1.1rem}.badge{background-color:#fff;color:#3f4143;position:relative;white-space:nowrap;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-weight:700;border-radius:500px;padding:1px 6px;font-size:.854rem}.badge.primary{background-color:#0a8fff;color:#fff}.badge.success{background-color:#2ec4b6;color:#fff}.badge.warning{background-color:#de9e36;color:#fff}.badge.error{background-color:#d62828;color:#fff}.badge.dark{background-color:#26272b;color:#fff}.badge.tiny{padding:0 4px;font-size:.659rem}.badge.small{padding:1px 4px;font-size:.749rem}.badge.large{padding:2px 8px;font-size:1.1rem}.billboard{background-color:#fff;color:#3f4143;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:4.5rem 2.5rem;border-color:#f4f4f4;border:1px solid #c6c6c6}.billboard.primary{background-color:#0a8fff;color:#fff;border-color:#0083f2}.billboard.success{background-color:#2ec4b6;color:#fff;border-color:#2ab1a5}.billboard.warning{background-color:#de9e36;color:#fff;border-color:#d99424}.billboard.error{background-color:#d62828;color:#fff;border-color:#c32424}.billboard.dark{background-color:#26272b;color:#fff;border-color:#1b1c1f}.billboard.small{font-size:1em}.billboard.small,.billboard.small .body{padding:2.5rem 1.5rem}.billboard.small p{font-size:1em}.billboard.large{font-size:1.6em}.billboard.large,.billboard.large .body{padding:7.5rem 4rem}.billboard.large p{font-size:1.6em}.billboard .media{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.billboard .body{padding:4.5rem 2.5rem;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.cover{min-height:100vh;max-height:100%;min-width:100%;border:0;background-size:cover;background-position:50%;background-repeat:no-repeat}@media only screen and (max-width:768px){.billboard{padding:2.5rem 1rem;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.billboard .media img{width:100%}.billboard .body{padding:2.5rem 1rem}.billboard.small,.billboard.small .body{padding:1rem}.billboard.small p{font-size:1em}.billboard.large,.billboard.large .body{padding:1rem}.billboard.large p{font-size:1.358em}}.breadcrumb{display:inline-block;white-space:nowrap}.breadcrumb .item,.breadcrumb a.item{text-decoration:none;font-size:inherit;font-weight:600}.breadcrumb .item.active,.breadcrumb .item:active,.breadcrumb .item:focus,.breadcrumb .item:hover,.breadcrumb a.item.active,.breadcrumb a.item:active,.breadcrumb a.item:focus,.breadcrumb a.item:hover{color:#0a8fff}.breadcrumb .item:after,.breadcrumb a.item:after{font-family:Material Icons;content:"keyboard_arrow_right";color:#0a8fff;padding:0 .25em;vertical-align:middle;font-size:1.4rem;cursor:auto}.breadcrumb .item:first-child,.breadcrumb a.item:first-child{margin-left:0}.breadcrumb .item.active,.breadcrumb a.item.active{color:#0a8fff;font-weight:700}.breadcrumb .item.active:after,.breadcrumb a.item.active:after{content:none}.breadcrumb.small .item{font-size:.9589em}.breadcrumb.small .item:after{padding:.15em;font-size:1.25rem}.breadcrumb.large .item{font-size:1.18em}.breadcrumb.large .item:after{padding:.18em;font-size:1.7rem}@media only screen and (max-width:768px){.breadcrumb .item:after{font-size:1rem;vertical-align:middle}}.cards{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.cards.two>.card{-ms-flex:0 0 calc(100% * 0.5 - 20px);flex:0 0 calc(100% * 0.5 - 20px)}.cards.three>.card,.cards.two>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.three>.card{-ms-flex:0 0 calc(100% * 0.333333333333333 - 20px);flex:0 0 calc(100% * 0.333333333333333 - 20px)}.cards.four>.card{-ms-flex:0 0 calc(100% * 0.25 - 20px);flex:0 0 calc(100% * 0.25 - 20px)}.cards.five>.card,.cards.four>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.five>.card{-ms-flex:0 0 calc(100% * 0.2 - 20px);flex:0 0 calc(100% * 0.2 - 20px)}.cards.six>.card{-ms-flex:0 0 calc(100% * 0.166666666666667 - 20px);flex:0 0 calc(100% * 0.166666666666667 - 20px)}.cards.seven>.card,.cards.six>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.seven>.card{-ms-flex:0 0 calc(100% * 0.142857142857143 - 20px);flex:0 0 calc(100% * 0.142857142857143 - 20px)}.cards.eight>.card{-ms-flex:0 0 calc(100% * 0.125 - 20px);flex:0 0 calc(100% * 0.125 - 20px)}.cards.eight>.card,.cards.nine>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.nine>.card{-ms-flex:0 0 calc(100% * 0.111111111111111 - 20px);flex:0 0 calc(100% * 0.111111111111111 - 20px)}.cards.ten>.card{-ms-flex:0 0 calc(100% * 0.1 - 20px);flex:0 0 calc(100% * 0.1 - 20px)}.cards.eleven>.card,.cards.ten>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.eleven>.card{-ms-flex:0 0 calc(100% * 0.090909090909091 - 20px);flex:0 0 calc(100% * 0.090909090909091 - 20px)}.cards.twelve>.card{-ms-flex:0 0 calc(100% * 0.083333333333333 - 20px);flex:0 0 calc(100% * 0.083333333333333 - 20px)}.cards.thirteen>.card,.cards.twelve>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.thirteen>.card{-ms-flex:0 0 calc(100% * 0.076923076923077 - 20px);flex:0 0 calc(100% * 0.076923076923077 - 20px)}.cards.fourteen>.card{-webkit-box-flex:0;-ms-flex:0 0 calc(100% * 0.071428571428571 - 20px);flex:0 0 calc(100% * 0.071428571428571 - 20px);height:auto;margin:10px}.cards.fifteen>.card{-ms-flex:0 0 calc(100% * 0.066666666666667 - 20px);flex:0 0 calc(100% * 0.066666666666667 - 20px)}.cards.fifteen>.card,.cards.sixteen>.card{-webkit-box-flex:0;height:auto;margin:10px}.cards.sixteen>.card{-ms-flex:0 0 calc(100% * 0.0625 - 20px);flex:0 0 calc(100% * 0.0625 - 20px)}.card{background-color:#fff;border:1px solid #c6c6c6;border-radius:4px;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:240px;height:100%;overflow:hidden}.card .title,.card>.body .title{color:#3f4143;line-height:normal}.card .title>.subtitle,.card>.body .title>.subtitle{color:#a8a8a8;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto}.card .actions,.card .description,.card .title{padding:16px}.card .description{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;color:#3f4143}.card>.media{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.card>.media img{display:block;width:100%}.card>.media.two{padding-bottom:0!important;height:auto}.card>.media.two>a,.card>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.three{padding-bottom:0!important;height:auto}.card>.media.three>a,.card>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.four{padding-bottom:0!important;height:auto}.card>.media.four>a,.card>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.five{padding-bottom:0!important;height:auto}.card>.media.five>a,.card>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.six{padding-bottom:0!important;height:auto}.card>.media.six>a,.card>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.seven{padding-bottom:0!important;height:auto}.card>.media.seven>a,.card>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.eight{padding-bottom:0!important;height:auto}.card>.media.eight>a,.card>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.nine{padding-bottom:0!important;height:auto}.card>.media.nine>a,.card>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.ten{padding-bottom:0!important;height:auto}.card>.media.ten>a,.card>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.eleven{padding-bottom:0!important;height:auto}.card>.media.eleven>a,.card>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.twelve{padding-bottom:0!important;height:auto}.card>.media.twelve>a,.card>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.thirteen{padding-bottom:0!important;height:auto}.card>.media.thirteen>a,.card>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.fourteen{padding-bottom:0!important;height:auto}.card>.media.fourteen>a,.card>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.fifteen{padding-bottom:0!important;height:auto}.card>.media.fifteen>a,.card>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card>.media.sixteen{padding-bottom:0!important;height:auto}.card>.media.sixteen>a,.card>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:0}.card.horizontal{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;width:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:15px}.card.horizontal>.media{-ms-flex-item-align:normal;align-self:normal;width:100%}.card.horizontal>.media img{width:auto;-o-object-fit:cover;object-fit:cover}.card.horizontal>.body{-webkit-box-flex:inherit;-ms-flex:inherit;flex:inherit}.card.horizontal>.body .description,.card.horizontal>.body .title{padding:8px 16px}.card.horizontal>.body .description{-webkit-box-flex:1;-ms-flex:1;flex:1}@media only screen and (max-width:768px){.card,.cards>.card{-webkit-box-flex:0!important;-ms-flex:0 0 100%!important;flex:0 0 100%!important;width:100%;height:-webkit-fit-content!important;height:-moz-fit-content!important;height:fit-content!important}.card.horizontal{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}.list{list-style:none;margin:1rem 0}.list>.item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:.55em;margin:0;-webkit-transition:.15s;transition:.15s}.list>.item>.material-icons,.list>.item>i,.list>.item>img{margin-right:1rem}.list>.item>.body{-webkit-box-flex:1;-ms-flex:1;flex:1;line-height:1.4;text-align:left}.list>.item>.body>.subtitle,.list>.item>.body>.title{display:block}.list>.item>.body>.title{font-size:1.28rem;font-weight:900;line-height:1}.list>.item>.body>.subtitle{font-size:.889em;font-weight:400;color:#0a8fff;margin-bottom:7px}.list>.item>.actions{margin-left:auto;width:auto;margin-left:1rem}.list>.item.active{background:#e3e3e3}.list.divided>.item{border-bottom:1px solid #c6c6c6}.list.divided>.item:last-child{border-bottom:none}.list.striped>.item:nth-of-type(odd){background:#e6e6e6}.list.hovered>.item:hover{background:#e6e6e6;-webkit-transition:.15s;transition:.15s}.menu{background-color:#fff;border-radius:0;list-style:none;margin:0;width:100%;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;padding:.9rem;-webkit-box-shadow:0 7px 10px rgba(0,0,0,.15);box-shadow:0 7px 10px rgba(0,0,0,.15);z-index:300}.menu .title{font-size:1.25em;min-height:2rem;color:#3f4143;padding:.6rem 0;font-weight:700;letter-spacing:-.015rem}.menu .item{padding:0;position:relative;text-decoration:none;text-align:left}.menu .item>a{display:block;width:100%;padding:.28rem .9rem;text-decoration:none;font-size:1em;font-weight:600}.menu .item>a,.menu .item>a:hover{color:#3f4143;-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.menu .item>a:hover{background:#e3e3e3}.menu .item>a.active,.menu .item>a:active,.menu .item>a:focus{background:#e3e3e3;color:#3f4143;-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.menu .item i,.menu .item span.material-icons{color:#a8a8a8;font-size:1.2rem;margin-right:10px;vertical-align:text-bottom}.menu .item .menu{padding:.4rem}.menu .badge{position:absolute;right:0;top:4px;padding:0 4px;font-size:.93em}.menu.small>.item a{font-size:.879em}.menu.divided .item{border-bottom:1px solid #dcdcdc}.menu.divided .item:last-child{border-bottom:none}.navbar{-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;min-height:80px;background:#007ce5;color:#fff}.navbar,.navbar .container{width:100%}.navbar,.navbar .brand,.navbar .container{display:-webkit-box;display:-ms-flexbox;display:flex}.navbar .brand{padding:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-height:100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:1rem}.navbar .brand img{max-height:60px;padding:8px}.navbar .brand a,.navbar .brand a:visited{font-size:1.1em;text-decoration:none;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;font-weight:700}.navbar .burger,.navbar input[type=checkbox]#burger{display:none}.navbar .burger:before{content:"dehaze";font-family:Material Icons;font-size:2.459rem;display:none;min-height:80px;min-width:80px;position:absolute;cursor:pointer;right:0;top:0}.navbar section.links,.navbar section.links div.section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.navbar section.links div.section{height:100%}.navbar section.links div.section:not(:first-child):last-child{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.navbar section.links div.section input[type=text]{background-color:#007ce5;color:#fff;border-color:#33a2ff}.navbar section.links div.section input[type=text]::-webkit-input-placeholder{color:#fff}.navbar section.links div.section input[type=text]::-moz-placeholder{color:#fff}.navbar section.links div.section input[type=text]::-ms-input-placeholder{color:#fff}.navbar section.links div.section input[type=text]::placeholder{color:#fff}.navbar section.links div.section input[type=text]:focus{outline:2px solid #8fccff}.navbar.fixed{position:fixed;top:0;left:0;right:0;margin-top:0;-webkit-transform:translateY(0);transform:translateY(0);z-index:5}.navbar .buttons{height:100%;min-height:100%;-webkit-box-shadow:none;box-shadow:none}.navbar .buttons .button{background:transparent;border-color:transparent;border:none;color:#fff;min-height:100%}.navbar .buttons .button i,.navbar .buttons .button span.material-icons{color:#fff}.navbar .button,.navbar .dropdown .button{font-size:1.1em;padding:.935rem 1.4rem;font-weight:700}.navbar.light{background:#fff;color:#000}.navbar.light .buttons .button{color:#000;min-height:100%}.navbar.light .brand a,.navbar.light .brand a:visited,.navbar.light .buttons .button i,.navbar.light .buttons .button span.material-icons{color:#000}.navbar.light section.links div.section input[type=text]{background-color:#fff;border-color:#26272b;color:#000}.navbar.light section.links div.section input[type=text]::-webkit-input-placeholder{color:#000}.navbar.light section.links div.section input[type=text]::-moz-placeholder{color:#000}.navbar.light section.links div.section input[type=text]::-ms-input-placeholder{color:#000}.navbar.light section.links div.section input[type=text]::placeholder{color:#000}.navbar.light section.links div.section input[type=text]:focus{outline:2px solid #45474e}.navbar.dark{background:#1a1b1d;color:#fff}.navbar.dark .buttons .button{color:#fff;min-height:100%}.navbar.dark .brand a,.navbar.dark .brand a:visited,.navbar.dark .buttons .button i,.navbar.dark .buttons .button span.material-icons{color:#fff}.navbar.dark section.links div.section input[type=text]{background-color:#37383e;border-color:#4f5159;color:#fff}.navbar.dark section.links div.section input[type=text]::-webkit-input-placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]::-moz-placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]::-ms-input-placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]::placeholder{color:#fff}.navbar.dark section.links div.section input[type=text]:focus{outline:2px solid #6e717c}.navbar-spacer{margin-top:100px}@media only screen and (max-width:768px){.navbar-spacer{margin-top:0}.navbar .container{padding:0}.navbar.fixed{position:relative}.navbar section.links{position:absolute;display:block;width:100%;height:0;top:80px;left:0;overflow-x:auto;overflow-y:hidden;background:#e6e6e6;z-index:1;margin:0!important;padding:0!important;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15)}.navbar section.links .section,.navbar section.links .section .buttons,.navbar section.links .section .buttons .button,.navbar section.links .section .buttons .dropdown,.navbar section.links .section .buttons .dropdown .button,.navbar section.links .section .buttons .dropdown .menu,.navbar section.links .section .buttons .dropdown .menu .button{display:block!important;width:100%;text-align:left;position:relative}.navbar section.links .section .buttons .button,.navbar section.links .section .buttons .dropdown .button{color:#3f4143}.navbar section.links .section .buttons .button i,.navbar section.links .section .buttons .button span.material-icons,.navbar section.links .section .buttons .dropdown .button i,.navbar section.links .section .buttons .dropdown .button span.material-icons{display:none}.navbar section.links .section .buttons .dropdown .menu{max-height:100%;-webkit-box-shadow:none;box-shadow:none}.navbar .burger{min-height:80px;min-width:80px}.navbar .burger,.navbar .burger:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.navbar .burger:before{content:"close"}.navbar input[type=checkbox]#burger:not(:checked)~section.links{height:0}.navbar input[type=checkbox]#burger:checked~section.links{height:auto}.navbar input[type=checkbox]#burger:not(:checked)~.burger:before{content:"dehaze"}.navbar input[type=checkbox]#burger:checked~.burger:before{content:"close"}}.panel{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;border:1px solid #c6c6c6;border-radius:4px;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15);background-color:#fff;margin:16px 0}.panel,.panel>.bottom,.panel>.header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal}.panel>.bottom,.panel>.header{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.panel>.bottom .actions,.panel>.header .actions{margin-left:auto}.panel>.bottom .actions:before,.panel>.header .actions:before{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.panel>.header{border-bottom:1px solid #c6c6c6;padding:12px 16px}.panel>.header.dashed{border-bottom-style:dashed}.panel>.header.dotted{border-bottom-style:dotted}.panel>.header .title{font-size:1.185rem;font-weight:900}.panel>.content{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:16px;height:auto}.panel>.content>.media{min-width:0;-webkit-box-flex:1;-ms-flex:auto;flex:auto;margin-bottom:32px;-ms-flex-wrap:wrap;flex-wrap:wrap;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;padding-bottom:56.25%!important;height:0;overflow:hidden;max-width:100%;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.panel>.content>.media embed,.panel>.content>.media iframe,.panel>.content>.media object{position:absolute;top:0;left:0;width:100%;height:100%}.panel>.content>.media video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.panel>.content>.media img{display:block}.panel>.content>.media.two{padding-bottom:0!important;height:auto}.panel>.content>.media.two>a,.panel>.content>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.three{padding-bottom:0!important;height:auto}.panel>.content>.media.three>a,.panel>.content>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.four{padding-bottom:0!important;height:auto}.panel>.content>.media.four>a,.panel>.content>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.five{padding-bottom:0!important;height:auto}.panel>.content>.media.five>a,.panel>.content>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.six{padding-bottom:0!important;height:auto}.panel>.content>.media.six>a,.panel>.content>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.seven{padding-bottom:0!important;height:auto}.panel>.content>.media.seven>a,.panel>.content>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.eight{padding-bottom:0!important;height:auto}.panel>.content>.media.eight>a,.panel>.content>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.nine{padding-bottom:0!important;height:auto}.panel>.content>.media.nine>a,.panel>.content>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.ten{padding-bottom:0!important;height:auto}.panel>.content>.media.ten>a,.panel>.content>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.eleven{padding-bottom:0!important;height:auto}.panel>.content>.media.eleven>a,.panel>.content>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.twelve{padding-bottom:0!important;height:auto}.panel>.content>.media.twelve>a,.panel>.content>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.thirteen{padding-bottom:0!important;height:auto}.panel>.content>.media.thirteen>a,.panel>.content>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.fourteen{padding-bottom:0!important;height:auto}.panel>.content>.media.fourteen>a,.panel>.content>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.fifteen{padding-bottom:0!important;height:auto}.panel>.content>.media.fifteen>a,.panel>.content>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content>.media.sixteen{padding-bottom:0!important;height:auto}.panel>.content>.media.sixteen>a,.panel>.content>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.panel>.content .headline,.panel>.content p.headline{font-size:1.39em;line-height:1.5;margin-bottom:26px;color:#171819;letter-spacing:-.0158em}.panel>.bottom{min-height:50px;border-top:1px solid #c6c6c6;padding:6px}.process{-ms-flex-wrap:nowrap;flex-wrap:nowrap;margin:1em 0 5em;width:100%;list-style:none}.process,.process .item{display:-webkit-box;display:-ms-flexbox;display:flex}.process .item{-webkit-box-flex:1;-ms-flex:1 1 0px;flex:1 1 0;min-height:4rem;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;word-break:break-word;line-height:1.3;text-align:center}.process .item:not(:first-child):before{background:#0a8fff;content:"";height:6px;left:-50%;position:absolute;top:0;width:100%}.process .item a{color:#3f4143;display:inline-block;padding:10px 10px 0;text-decoration:none;font-weight:700}.process .item a:before{position:absolute;content:"";background:#0a8fff;top:0;left:50%;height:.8rem;width:3px;z-index:1}.process .item a:first-child:before{left:calc(50% - 2px)}.process .item.active a{color:#0a8fff;font-weight:700}.process .item.active a:after{content:"beenhere";font-family:Material Icons;position:absolute;top:calc(-15px - 1.8rem);left:calc(50% - 15px);color:#0a8fff;font-size:1.8rem}.process .item.active~.item:before{background:#c6c6c6}.process .item.active~.item a{color:#3f4143}.process .item.active~.item a:hover{color:#0a8fff}.process .item.active~.item a:before{background:#c6c6c6}.process.success .item:not(:first-child):before{background:#2ec4b6}.process.success .item a{padding:10px}.process.success .item a:before{background:#2ec4b6}.process.success .item.active a,.process.success .item.active a:after{color:#2ec4b6}.process.success .item.active~.item:before{background:#c6c6c6}.process.warning .item:not(:first-child):before{background:#de9e36}.process.warning .item a{padding:10px}.process.warning .item a:before{background:#de9e36}.process.warning .item.active a,.process.warning .item.active a:after{color:#de9e36}.process.warning .item.active~.item:before{background:#c6c6c6}.process.error .item:not(:first-child):before{background:#d62828}.process.error .item a{padding:10px}.process.error .item a:before{background:#d62828}.process.error .item.active a,.process.error .item.active a:after{color:#d62828}.process.error .item.active~.item:before{background:#c6c6c6}.process.dark .item:not(:first-child):before{background:#26272b}.process.dark .item a{padding:10px}.process.dark .item a:before{background:#26272b}.process.dark .item.active a,.process.dark .item.active a:after{color:#26272b}.process.dark .item.active~.item:before{background:#c6c6c6}.process.vertical{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;margin:1em 0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.process.vertical .item{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:100%;min-width:100%;border-bottom:1px solid #c6c6c6;border-right:1px solid #c6c6c6;padding-left:20px}.process.vertical .item:first-child{border-top:1px solid #c6c6c6}.process.vertical .item:not(:first-child):before{width:3px;height:100%;left:0}.process.vertical .item a:before{width:9px}.process.vertical .item a:first-child:before{left:0;height:100%}.process.vertical .item.active a{font-weight:700}.process.vertical .item.active a:after{top:15px;left:calc(-15px - 1.8rem)}.process.vertical.reversed{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.process.vertical.reversed .item:last-child{border-top:1px solid #c6c6c6}.process.vertical.reversed .item:first-child{border-top:none}@media only screen and (max-width:768px){.process{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;margin:1em 0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.process .item{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:100%;min-width:100%;border-bottom:1px solid #c6c6c6;border-right:1px solid #c6c6c6;padding-left:20px}.process .item:first-child{border-top:1px solid #c6c6c6}.process .item:not(:first-child):before{width:3px;height:100%;left:0}.process .item a:before{width:9px}.process .item a:first-child:before{left:0;height:100%}.process .item.active a{font-weight:700}.process .item.active a:after{top:15px;left:calc(-15px - 1.8rem)}.process.reversed{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.process.reversed .item:last-child{border-top:1px solid #c6c6c6}.process.reversed .item:first-child{border-top:none}}.progress{width:100%;height:12px;background:#e6e6e6;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.15);box-shadow:inset 0 1px 2px rgba(0,0,0,.15);border-radius:16px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.progress::-webkit-progress-bar{background:transparent;border-radius:16px}.progress::-webkit-progress-value{background:#0a8fff;border-radius:16px}.progress::-moz-progress-bar{background:#0a8fff;border-radius:16px}.progress.success::-webkit-progress-value{background:#2ec4b6}.progress.warning::-webkit-progress-value{background:#de9e36}.progress.error::-webkit-progress-value{background:#d62828}.progress.dark::-webkit-progress-value{background:#26272b}.tab{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;border-bottom:2px solid #e6e6e6;padding:0}.tab>.buttons{-webkit-box-shadow:none;box-shadow:none;border-radius:0}.tab>.button,.tab>.buttons>.button,.tab>.buttons>.dropdown>.button,.tab>.buttons>.dropdown>a.button,.tab>.buttons>a.button,.tab>.dropdown>.button,.tab>.dropdown>a.button,.tab>a.button{background:transparent;border:none;border-bottom:2px solid transparent;border-radius:0!important;margin-bottom:-2px;line-height:normal;font-size:1.025em;-webkit-transition:border-bottom-color,color .2s;transition:border-bottom-color,color .2s;color:#3f4143;padding:.935rem 1.4rem;-webkit-box-shadow:none;box-shadow:none}.tab>.button:hover,.tab>.buttons>.button:hover,.tab>.buttons>.dropdown>.button:hover,.tab>.buttons>.dropdown>a.button:hover,.tab>.buttons>a.button:hover,.tab>.dropdown>.button:hover,.tab>.dropdown>a.button:hover,.tab>a.button:hover{color:#3f4143;border-bottom-color:#a8a8a8;-webkit-transition:border-bottom-color,color .2s;transition:border-bottom-color,color .2s}.tab>.button.disabled,.tab>.buttons>.button.disabled,.tab>.buttons>.dropdown>.button.disabled,.tab>.buttons>.dropdown>a.button.disabled,.tab>.buttons>a.button.disabled,.tab>.dropdown>.button.disabled,.tab>.dropdown>a.button.disabled,.tab>a.button.disabled{opacity:.45}.tab>.button.active,.tab>.buttons>.button.active,.tab>.buttons>.dropdown>.button.active,.tab>.buttons>.dropdown>a.button.active,.tab>.buttons>a.button.active,.tab>.dropdown>.button.active,.tab>.dropdown>a.button.active,.tab>a.button.active{color:#0a8fff;border-bottom-color:#0a8fff;font-weight:700}.tab>.button.active [class^=material-icons],.tab>.button.active i,.tab>.buttons>.button.active [class^=material-icons],.tab>.buttons>.button.active i,.tab>.buttons>.dropdown>.button.active [class^=material-icons],.tab>.buttons>.dropdown>.button.active i,.tab>.buttons>.dropdown>a.button.active [class^=material-icons],.tab>.buttons>.dropdown>a.button.active i,.tab>.buttons>a.button.active [class^=material-icons],.tab>.buttons>a.button.active i,.tab>.dropdown>.button.active [class^=material-icons],.tab>.dropdown>.button.active i,.tab>.dropdown>a.button.active [class^=material-icons],.tab>.dropdown>a.button.active i,.tab>a.button.active [class^=material-icons],.tab>a.button.active i{color:inherit}.tab.success .button.active,.tab.success .dropdown .button.active,.tab.success .dropdown a.button.active,.tab.success a.button.active{color:#2ec4b6;border-bottom-color:#2ec4b6}.tab.warning .button.active,.tab.warning .dropdown .button.active,.tab.warning .dropdown a.button.active,.tab.warning a.button.active{color:#de9e36;border-bottom-color:#de9e36}.tab.error .button.active,.tab.error .dropdown .button.active,.tab.error .dropdown a.button.active,.tab.error a.button.active{color:#d62828;border-bottom-color:#d62828}.tab.dark .button.active,.tab.dark .dropdown .button.active,.tab.dark .dropdown a.button.active,.tab.dark a.button.active{color:#3f4143;border-bottom-color:#26272b}.timeline .activity{display:-webkit-box;display:-ms-flexbox;display:flex;padding:1.25em 2em 2.85em;position:relative;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.timeline .activity:before{content:"";display:block;position:absolute;top:0;bottom:0;left:0;width:1px;background-color:#c6c6c6}.timeline .activity:target .type{border-color:#0a8fff;-webkit-box-shadow:0 0 .2em #0a8fff;box-shadow:0 0 .2em #0a8fff}.timeline .activity .type{position:absolute;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;width:32px;height:32px;top:13px;left:-15px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#e6e6e6;border:2px solid #c6c6c6;border-radius:50%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-negative:0;flex-shrink:0;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15)}.timeline .activity .type.primary{background-color:#0a8fff;color:#fff;border-color:#0082f0}.timeline .activity .type.success{background-color:#2ec4b6;color:#fff;border-color:#29afa3}.timeline .activity .type.warning{background-color:#de9e36;color:#fff;border-color:#d79323}.timeline .activity .type.error{background-color:#d62828;color:#fff;border-color:#c12424}.timeline .activity .type.dark{background-color:#26272b;color:#fff;border-color:#1a1b1d}.timeline .activity .actions,.timeline .activity .author,.timeline .activity .body,.timeline .activity .date,.timeline .activity .media{min-width:0;max-width:100%;color:#3f4143;-webkit-box-flex:1;-ms-flex:auto;flex:auto;margin-left:10px;width:100%}.timeline .activity .author{font-weight:700;font-size:1rem;color:#212223}.timeline .activity .date{font-size:.9em;opacity:.6}.timeline .activity .media{margin-top:16px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative;padding-bottom:56.25%!important;height:0;overflow:hidden;max-width:100%;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.timeline .activity .media embed,.timeline .activity .media iframe,.timeline .activity .media object{position:absolute;top:0;left:0;width:100%;height:100%}.timeline .activity .media video{max-width:100%;height:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.timeline .activity .media img{display:block}.timeline .activity>.media.two{padding-bottom:0!important;height:auto}.timeline .activity>.media.two>a,.timeline .activity>.media.two>div{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.three{padding-bottom:0!important;height:auto}.timeline .activity>.media.three>a,.timeline .activity>.media.three>div{-webkit-box-flex:0;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.four{padding-bottom:0!important;height:auto}.timeline .activity>.media.four>a,.timeline .activity>.media.four>div{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.five{padding-bottom:0!important;height:auto}.timeline .activity>.media.five>a,.timeline .activity>.media.five>div{-webkit-box-flex:0;-ms-flex:0 0 20%;flex:0 0 20%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.six{padding-bottom:0!important;height:auto}.timeline .activity>.media.six>a,.timeline .activity>.media.six>div{-webkit-box-flex:0;-ms-flex:0 0 16.66667%;flex:0 0 16.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.seven{padding-bottom:0!important;height:auto}.timeline .activity>.media.seven>a,.timeline .activity>.media.seven>div{-webkit-box-flex:0;-ms-flex:0 0 14.28571%;flex:0 0 14.28571%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.eight{padding-bottom:0!important;height:auto}.timeline .activity>.media.eight>a,.timeline .activity>.media.eight>div{-webkit-box-flex:0;-ms-flex:0 0 12.5%;flex:0 0 12.5%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.nine{padding-bottom:0!important;height:auto}.timeline .activity>.media.nine>a,.timeline .activity>.media.nine>div{-webkit-box-flex:0;-ms-flex:0 0 11.11111%;flex:0 0 11.11111%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.ten{padding-bottom:0!important;height:auto}.timeline .activity>.media.ten>a,.timeline .activity>.media.ten>div{-webkit-box-flex:0;-ms-flex:0 0 10%;flex:0 0 10%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.eleven{padding-bottom:0!important;height:auto}.timeline .activity>.media.eleven>a,.timeline .activity>.media.eleven>div{-webkit-box-flex:0;-ms-flex:0 0 9.09091%;flex:0 0 9.09091%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.twelve{padding-bottom:0!important;height:auto}.timeline .activity>.media.twelve>a,.timeline .activity>.media.twelve>div{-webkit-box-flex:0;-ms-flex:0 0 8.33333%;flex:0 0 8.33333%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.thirteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.thirteen>a,.timeline .activity>.media.thirteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.69231%;flex:0 0 7.69231%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.fourteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.fourteen>a,.timeline .activity>.media.fourteen>div{-webkit-box-flex:0;-ms-flex:0 0 7.14286%;flex:0 0 7.14286%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.fifteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.fifteen>a,.timeline .activity>.media.fifteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.66667%;flex:0 0 6.66667%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity>.media.sixteen{padding-bottom:0!important;height:auto}.timeline .activity>.media.sixteen>a,.timeline .activity>.media.sixteen>div{-webkit-box-flex:0;-ms-flex:0 0 6.25%;flex:0 0 6.25%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding:1px}.timeline .activity .actions{margin-top:16px}.timeline .activity:last-child:before{background:-webkit-gradient(linear,left top,left bottom,color-stop(45%,#c6c6c6),to(hsla(0,0%,100%,0)));background:linear-gradient(180deg,#c6c6c6 45%,hsla(0,0%,100%,0))}.timeline .activity:first-child:before{background:-webkit-gradient(linear,left bottom,left top,color-stop(45%,#c6c6c6),to(hsla(0,0%,100%,0)));background:linear-gradient(0deg,#c6c6c6 45%,hsla(0,0%,100%,0))}.tooltip{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;cursor:default}.tooltip .text{position:absolute;color:#fff;font-size:.9em;font-weight:600;text-align:center;visibility:hidden;background-color:#26272b;border-radius:4px;min-width:100px;max-width:180px;padding:5px;top:120%;opacity:0;-webkit-transition:opacity .18s;transition:opacity .18s;z-index:1}.tooltip .text:after{content:"";position:absolute;top:auto;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:transparent transparent #26272b}.tooltip:hover .text{visibility:visible;opacity:1}.m-0{margin:0!important}.m-5{margin:5px!important}.m-10{margin:10px!important}.m-15{margin:15px!important}.m-20{margin:20px!important}.m-30{margin:30px!important}.m-40{margin:40px!important}.m-50{margin:50px!important}.mt-0{margin-top:0!important}.mt-5{margin-top:5px!important}.mt-10{margin-top:10px!important}.mt-15{margin-top:15px!important}.mt-20{margin-top:20px!important}.mt-30{margin-top:30px!important}.mt-40{margin-top:40px!important}.mt-50{margin-top:50px!important}.mr-0{margin-right:0!important}.mr-5{margin-right:5px!important}.mr-10{margin-right:10px!important}.mr-15{margin-right:15px!important}.mr-20{margin-right:20px!important}.mr-30{margin-right:30px!important}.mr-40{margin-right:40px!important}.mr-50{margin-right:50px!important}.mb-0{margin-bottom:0!important}.mb-5{margin-bottom:5px!important}.mb-10{margin-bottom:10px!important}.mb-15{margin-bottom:15px!important}.mb-20{margin-bottom:20px!important}.mb-30{margin-bottom:30px!important}.mb-40{margin-bottom:40px!important}.mb-50{margin-bottom:50px!important}.ml-0{margin-left:0!important}.ml-5{margin-left:5px!important}.ml-10{margin-left:10px!important}.ml-15{margin-left:15px!important}.ml-20{margin-left:20px!important}.ml-30{margin-left:30px!important}.ml-40{margin-left:40px!important}.ml-50{margin-left:50px!important}.m-auto{margin:auto!important}.mt-auto{margin-top:auto!important}.mr-auto{margin-right:auto!important}.mb-auto{margin-bottom:auto!important}.ml-auto{margin-left:auto!important}.p-0{padding:0!important}.p-5{padding:5px!important}.p-10{padding:10px!important}.p-15{padding:15px!important}.p-20{padding:20px!important}.p-30{padding:30px!important}.p-40{padding:40px!important}.p-50{padding:50px!important}.pt-0{padding-top:0!important}.pt-5{padding-top:5px!important}.pt-10{padding-top:10px!important}.pt-15{padding-top:15px!important}.pt-20{padding-top:20px!important}.pt-30{padding-top:30px!important}.pt-40{padding-top:40px!important}.pt-50{padding-top:50px!important}.pr-0{padding-right:0!important}.pr-5{padding-right:5px!important}.pr-10{padding-right:10px!important}.pr-15{padding-right:15px!important}.pr-20{padding-right:20px!important}.pr-30{padding-right:30px!important}.pr-40{padding-right:40px!important}.pr-50{padding-right:50px!important}.pb-0{padding-bottom:0!important}.pb-5{padding-bottom:5px!important}.pb-10{padding-bottom:10px!important}.pb-15{padding-bottom:15px!important}.pb-20{padding-bottom:20px!important}.pb-30{padding-bottom:30px!important}.pb-40{padding-bottom:40px!important}.pb-50{padding-bottom:50px!important}.pl-0{padding-left:0!important}.pl-5{padding-left:5px!important}.pl-10{padding-left:10px!important}.pl-15{padding-left:15px!important}.pl-20{padding-left:20px!important}.pl-30{padding-left:30px!important}.pl-40{padding-left:40px!important}.pl-50{padding-left:50px!important}.p-auto{padding:auto!important}.pt-auto{padding-top:auto!important}.pr-auto{padding-right:auto!important}.pb-auto{padding-bottom:auto!important}.pl-auto{padding-left:auto!important}.fw-100{font-weight:100!important}.fw-200{font-weight:200!important}.fw-300{font-weight:300!important}.fw-400{font-weight:400!important}.fw-500{font-weight:500!important}.fw-600{font-weight:600!important}.fw-700{font-weight:700!important}.fw-800{font-weight:800!important}.fw-900{font-weight:900!important}.mini-text{font-size:60%!important}.tiny-text{font-size:73%!important}.small-text{font-size:85%!important}.large-text{font-size:120%!important}.big-text{font-size:175%!important}.huge-text{font-size:200%!important}.giant-text{font-size:350%!important}.color-grey{color:#a8a8a8!important}.color-white{color:#fff!important}.color-black{color:#000!important}.color-primary{color:#0a8fff!important}.color-success{color:#2ec4b6!important}.color-warning{color:#de9e36!important}.color-error{color:#d62828!important}.bg-grey{background-color:#a8a8a8!important}.bg-secondary{background-color:#e6e6e6!important}.bg-white{background-color:#fff!important}.bg-black{background-color:#000!important}.bg-dark{background-color:#26272b!important}.bg-primary{background-color:#0a8fff!important}.bg-success{background-color:#2ec4b6!important}.bg-warning{background-color:#de9e36!important}.bg-error{background-color:#d62828!important}.cursor-alias{cursor:alias!important}.cursor-default{cursor:default!important}.cursor-grab{cursor:-webkit-grab!important;cursor:grab!important}.cursor-help{cursor:help!important}.cursor-move{cursor:move!important}.cursor-pointer{cursor:pointer!important}.cursor-wait{cursor:wait!important}.cursor-zoom-in{cursor:-webkit-zoom-in!important;cursor:zoom-in!important}.cursor-zoom-out{cursor:-webkit-zoom-out!important;cursor:zoom-out!important}.display-inline{display:inline!important}.display-flex{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important}.display-inline-flex{display:-webkit-inline-box!important;display:-ms-inline-flexbox!important;display:inline-flex!important}.display-grid{display:grid!important}.display-inline-grid{display:inline-grid!important}.display-block{display:block!important}.display-inline-block{display:inline-block!important}.display-table{display:table!important}.display-inline-table{display:inline-table!important}.display-table-row{display:table-row!important}.display-table-column{display:table-column!important}.display-table-cell{display:table-cell!important}.align-items-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.align-items-flex-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.align-items-flex-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.align-items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.align-items-stretch{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.align-items-initial{-webkit-box-align:initial;-ms-flex-align:initial;align-items:initial}.align-items-inherit{-webkit-box-align:inherit;-ms-flex-align:inherit;align-items:inherit}.align-self-auto{-ms-flex-item-align:auto;align-self:auto}.align-self-baseline{-ms-flex-item-align:baseline;align-self:baseline}.align-self-flex-start{-ms-flex-item-align:start;align-self:flex-start}.align-self-flex-end{-ms-flex-item-align:end;align-self:flex-end}.align-self-center{-ms-flex-item-align:center;align-self:center}.align-self-stretch{-ms-flex-item-align:stretch;align-self:stretch}.align-self-initial{-ms-flex-item-align:initial;align-self:auto}.align-self-inherit{-ms-flex-item-align:inherit;align-self:inherit}.justify-content-baseline{-webkit-box-pack:baseline;-ms-flex-pack:baseline;justify-content:baseline}.justify-content-flex-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-content-flex-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-content-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-content-space-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-content-space-around{-ms-flex-pack:distribute;justify-content:space-around}.justify-content-initial{-webkit-box-pack:initial;-ms-flex-pack:initial;justify-content:initial}.justify-content-inherit{-webkit-box-pack:inherit;-ms-flex-pack:inherit;justify-content:inherit}.filter-invert{-webkit-filter:invert(100%);filter:invert(100%)}.filter-gray{-webkit-filter:grayscale(100%);filter:grayscale(100%)}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-x-visible{overflow-x:visible}.overflow-x-scroll{overflow-x:scroll}.overflow-y-auto{overflow-y:auto}.overflow-y-hidden{overflow-y:hidden}.overflow-y-visible{overflow-y:visible}.overflow-y-scroll{overflow-y:scroll}.position-static{position:static}.position-absolute{position:absolute}.position-fixed{position:fixed}.position-relative{position:relative}.position-sticky{position:-webkit-sticky;position:sticky}.position-initial{position:static}.position-inherit{position:inherit}.z--1{z-index:-1!important}.z-0{z-index:0!important}.z-1{z-index:1!important}.z-10{z-index:10!important}.z-20{z-index:20!important}.z-30{z-index:30!important}.z-40{z-index:40!important}.z-50{z-index:50!important}.z-100{z-index:100!important}.z-999{z-index:999!important}.z-9999{z-index:9999!important}.flex-direction-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.flex-direction-row-reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.flex-direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.flex-direction-column-reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-direction-initial{-webkit-box-orient:initial;-webkit-box-direction:initial;-ms-flex-direction:initial;flex-direction:row}.flex-direction-inherit{-webkit-box-orient:inherit;-webkit-box-direction:inherit;-ms-flex-direction:inherit;flex-direction:inherit}.user-select-none{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.user-select-auto{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.user-select-text{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.user-select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.top-0{top:0}.top-auto{top:auto}.bottom-0{bottom:0}.bottom-auto{bottom:auto}.left-0{left:0}.left-auto{left:auto}.right-0{right:0}.right-auto{right:auto}.line-height-0{line-height:0!important}.line-height-1{line-height:1!important}.line-height-2{line-height:2!important}.line-height-3{line-height:3!important}.line-height-4{line-height:4!important}.line-height-5{line-height:5!important}.radius-4{border-radius:4px!important}.radius-8{border-radius:8px!important}.radius-10{border-radius:10px!important}.radius-12{border-radius:12px!important}.radius-14{border-radius:14px!important}.radius-16{border-radius:16px!important}.radius-500{border-radius:500px!important}.backdrop-4{-webkit-backdrop-filter:4px;backdrop-filter:4px}.backdrop-7{-webkit-backdrop-filter:7px;backdrop-filter:7px}.backdrop-10{-webkit-backdrop-filter:10px;backdrop-filter:10px}.backdrop-12{-webkit-backdrop-filter:12px;backdrop-filter:12px}.backdrop-16{-webkit-backdrop-filter:16px;backdrop-filter:16px}.backdrop-20{-webkit-backdrop-filter:20px;backdrop-filter:20px}.centered{margin:0 auto}.align.right{text-align:right!important}.align.left{text-align:left!important}.align.center{text-align:center!important}.align.justify{text-align:justify!important}.float.right{float:right}.float.left{float:left}.full.width{width:100%;max-width:100%;min-width:100%}.full.height{height:100%;min-height:100%;max-height:100%}.fade{opacity:0}.hide{display:none}.spacer{-webkit-box-flex:1!important;-ms-flex-positive:1!important;flex-grow:1!important;outline:none}.avatar{display:inline-block;border-radius:50%}.reset{padding:0!important;margin:0!important}.reverse{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);-ms-transform:rotateY(180deg);unicode-bidi:bidi-override;direction:rtl}.truncate{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transparent{background:transparent!important}.pure,.pure>div{background:transparent;border:none;-webkit-box-shadow:none;box-shadow:none}.bordered{border:1px solid #c6c6c6}.borderless{border:none!important}.rounded{border-radius:4px}.radiusless{border-radius:0!important}.shadowed{-webkit-box-shadow:0 1px 5px rgba(0,0,0,.15);box-shadow:0 1px 5px rgba(0,0,0,.15)}.shadowless{-webkit-box-shadow:none!important;box-shadow:none!important}.inset-0{top:0;right:0;bottom:0;left:0}.inset-auto{top:auto;right:auto;bottom:auto;left:auto} \ No newline at end of file diff --git a/docs/base/colors.html b/docs/base/colors.html deleted file mode 100644 index 5cb1c7db..00000000 --- a/docs/base/colors.html +++ /dev/null @@ -1,296 +0,0 @@ - - - - - - Introduction - Base : Punica CSS - - - - - - - -

-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Base
-
- - mic Introduction - -
-
- - format_paint Color Palette - -
-
- - border_clear Grid - -
-
- - emoji_people Helpers - -
-
-
- -
-
-
- -
- -
-
- Punica - Base - Color Palette -
-
- - -
-
-
- format_paint Color Palette -
-
-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
InfoColor Name# HEXHelper Class
Body Background - - Whiteffffff.bg-white
Main Font Color - - Onyx3f4143-
Main Border Color - - Silver Sandc6c6c6-
Main Dark Color - - Charcoal414552.bg-dark
Main Grey Background - - Light Slate Gray77878b.bg-grey
Main Striped Background - - Culturedf0f0f0
Main Hover Background - - Culturedf0f0f0
Main Secondary Background - - Platinume6e6e6.bg-secondary
Primary Color - - Dodger Blue0a8fff.bg-primary
Success Color - - Tiffany Blue2ec4b6.bg-success
Warning Color - - Marigoldde9e36.bg-warning
Error Color - - Maximum Redd62828.bg-error
-
-
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/base/grid.html b/docs/base/grid.html deleted file mode 100644 index aa06b638..00000000 --- a/docs/base/grid.html +++ /dev/null @@ -1,447 +0,0 @@ - - - - - - Grid - Base : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Base
-
- - mic Introduction - -
-
- - format_paint Color Palette - -
-
- - border_clear Grid - -
-
- - emoji_people Helpers - -
-
-
- -
-
-
- -
- -
-
- Punica - Base - Grid -
-
- -
-
-
- border_clear Grid -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Punica CSS Grid system offers a powerful and customizable grid-based layout system. -

-
-

CSS Grid Layout is the most powerful layout system available in CSS. It is a 2-dimensional system, meaning it can - handle both columns and rows, unlike flexbox which is largely a 1-dimensional system.

- CSS-Tricks -
- -
-
- - - - - - - - - - - - - - - - - -
InfoDefault Value
Grid Size16
Grid Gap6px
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.container
Row.row
Column.col-
Offset.offset-
Equal Height.equal
-
-
- -
-
- -
-
-
-
-
16
-
-
-
1
-
15
-
-
-
2
-
14
-
-
-
3
-
13
-
-
-
4
-
12
-
-
-
5
-
11
-
-
-
6
-
10
-
-
-
7
-
9
-
-
-
8
-
8
-
-
-
9
-
7
-
-
-
10
-
6
-
-
-
11
-
5
-
-
-
12
-
4
-
-
-
13
-
3
-
-
-
14
-
2
-
-
-
15
-
1
-
-
-
16
-
-
- -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
BreakpointsDefault ClassDefault Value
Extra Smallxs-
Smallsm500px
Mediummd768px
Largelg992px
Extra Largexl1260px
-
-
-
-
-
- - -
-
-
Standard Columns
-
-
-
-
- Lorem ipsum dolor sit amet, ex timeam dissentiet definitionem ius, no vix nihil iriure. -
-
col-4
-
- Lorem ipsum dolor sit amet, ex timeam dissentiet definitionem ius, no vix nihil iriure. Mel ad quodsi nonumes - vulputate, sed cibo incorrupte ad, no nam atqui accusam. -
-
col-4
-
-
-
- - -
-
-
Equal Height Columns
-
-
-
-
- Lorem ipsum dolor sit amet, ex timeam dissentiet definitionem ius, no vix nihil iriure. -
-
col-4
-
- Lorem ipsum dolor sit amet, ex timeam dissentiet definitionem ius, no vix nihil iriure. Mel ad quodsi - nonumes - vulputate, sed cibo incorrupte ad, no nam atqui accusam. -
-
col-4
-
-
-
- - -
-
-
- Offset -
-
-
-
-
- col-lg-4 offset-lg-2 -
-
- col-lg-4 offset-lg-12 -
-
-
-
- col-md-4 offset-md-6 -
-
-
-
- col-lg-4 offset-lg-2 -
-
- col-sm-4 offset-sm-12 -
-
-
-
- col-lg-2 offset-lg-2 -
-
- col-lg-2 offset-lg-6 -
-
- col-lg-2 offset-lg-10 -
-
- col-lg-2 offset-lg-14 -
-
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/base/helpers.html b/docs/base/helpers.html deleted file mode 100644 index cc6d45e7..00000000 --- a/docs/base/helpers.html +++ /dev/null @@ -1,1865 +0,0 @@ - - - - - - Helpers : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Base
-
- - mic Introduction - -
-
- - format_paint Color Palette - -
-
- - border_clear Grid - -
-
- - emoji_people Helpers - -
-
-
- -
-
-
- -
- -
-
- Punica - Base - Helpers -
-
- -
-
-
- - emoji_people Helpers - - - error_outline not yet completed. - -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- There are many set of CSS helper classes available in Punica. Each helper class is responsible for doing one job. -

-
-
- - -
- adjust Font sizes -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault value(s)
font-size.mini-text60%
font-size.tiny-text73%
font-size.small-text85%
font-size.large-text120%
font-size.big-text175%
font-size.huge-text200%
font-size.giant-text350%
- - -
- adjust Text colors -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault variable#Hex
color.color-grey$main-grey-color#77878b
color.color-whitewhite#ffffff
color.color-blackblack#000000
color.color-primary$primary-color#0a8fff
color.color-success$success-color#2ec4b6
color.color-warning$warning-color#de9e36
color.color-error$error-color#d62828
- - -
- adjust Background colors -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault variable#Hex
background-color.bg-grey$main-grey-color#77878b
background-color.bg-secondary$main-secondary-bg#e6e6e6
background-color.bg-whitewhite#ffffff
background-color.bg-black$main-font-color#3f4143
background-color.bg-dark$main-dark-color#414552
background-color.bg-primary$primary-color#0a8fff
background-color.bg-success$success-color#2ec4b6
background-color.bg-warning$warning-color#de9e36
background-color.bg-error$error-color#d62828
- - -
- adjust Font weights -
- - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault value(s)Example usage
font-weight.fw-100,200,300,400,500,600,700,800,900 -
- - - - - - -
-
 class="fw-600"
-
-
-
- - -
- adjust Text Transform -
- - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault variable
text-transform.text-uppercaseuppercase
text-transform.text-lowercaselowercase
text-transform.text-capitalizecapitalize
- - -
- adjust Line Height -
- - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault Value(s)Example usage
line-height.line-height-0,1,2,3,4,5 -
- - - - - - -
-
 class="line-height-2"
-
-
-
- - -
- adjust Margin -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault value(s)Example usage
margin.m-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="m-auto"
-
-
-
margin-top.mt-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="mt-15"
-
-
-
margin-right.mr-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="mr-15"
-
-
-
margin-bottom.mb-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="mb-15"
-
-
-
margin-left.ml-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="ml-15"
-
-
-
- - -
- adjust Padding -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault class/prefixDefault value(s)Example usage
padding.p-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="p-10"
-
-
-
padding-top.pt-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="pt-20"
-
-
-
padding-right.pr-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="pr-30"
-
-
-
padding-bottom.pb-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="pb-40"
-
-
-
padding-left.pl-auto,0,5,10,15,20,30,40,50 -
- - - - - - -
-
 class="pl-50"
-
-
-
- - -
- adjust Display -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault ValueDefault class
displayinline.display-inline
displayflex.display-flex
displayinline-flex.display-inline-flex
displaygrid.display-grid
displayinline-grid.display-inline-grid
displayblock.display-block
displayinline-block.display-inline-block
displaytable.display-table
displayinline-table.display-inline-table
displaytable-row.display-table-row
displaytable-column.display-table-column
displaytable-cell.display-table-cell
- - -
- adjust Position -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault ValueDefault class
positionstatic.position-static
positionabsolute.position-absolute
positionfixed.position-fixed
positionrelative.position-relative
positionsticky.position-sticky
positioninitial.position-initial
positioninherit.position-inherit
- - -
- adjust Positioned Elements -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyDefault Value(s)Default classExample usage
top0,auto.top- -
- - - - - - -
-
 class="top-0"
-
-
-
bottom0,auto.bottom- -
- - - - - - -
-
 class="bottom-auto"
-
-
-
left0,auto.left- -
- - - - - - -
-
 class="left-0"
-
-
-
right0,auto.right- -
- - - - - - -
-
 class="right-0"
-
-
-
top,bottom,left,right0,auto.inset- -
- - - - - - -
-
 class="inset-0"
-
-
-
- - -
- adjust Align Items -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyValueDefault class
align-itemsbaseline.align-items-baseline
align-itemsflex-start.align-items-flex-start
align-itemsflex-end.align-items-flex-end
align-itemscenter.align-items-center
align-itemsstretch.align-items-stretch
align-itemsinitial.align-items-initial
align-itemsinherit.align-items-inherit
- - -
- adjust Align Self -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyValueDefault class
align-selfauto.align-self-auto
align-selfbaseline.align-self-baseline
align-selfflex-start.align-self-flex-start
align-selfflex-end.align-self-flex-end
align-selfcenter.align-self-center
align-selfstretch.align-self-stretch
align-selfinitial.align-self-initial
align-selfinherit.align-self-inherit
- - -
- adjust Justify Content -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyValueDefault class
justify-contentbaseline.justify-content-baseline
justify-contentflex-start.justify-content-flex-start
justify-contentflex-end.justify-content-flex-end
justify-contentcenter.justify-content-center
justify-contentspace-between.justify-content-space-between
justify-contentspace-around.justify-content-space-around
justify-contentinitial.justify-content-initial
justify-contentinherit.justify-content-inherit
- - -
- adjust Direction of The Flexible Items -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyValueDefault class
flex-directionrow.flex-direction-row
flex-directionrow-reverse.flex-direction-row-reverse
flex-directioncolumn.flex-direction-column
flex-directioncolumn-reverse.flex-direction-column-reverse
flex-directioninitial.flex-direction-initial
flex-directioninherit.flex-direction-inherit
- - -
- adjust Overflow Properties -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyValueDefault class
overflowauto.overflow-auto
overflowhidden.overflow-hidden
overflowvisible.overflow-visible
overflow-xauto.overflow-x-auto
overflow-xhidden.overflow-x-hidden
overflow-xvisible.overflow-x-visible
overflow-xscroll.overflow-x-scroll
overflow-yauto.overflow-y-auto
overflow-yhidden.overflow-y-hidden
overflow-yvisible.overflow-y-visible
overflow-yscroll.overflow-y-scroll
- - -
- adjust Cursors -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyValueDefault class
cursoralias.cursor-alias
cursordefault.cursor-default
cursorgrab.cursor-grab
cursorhelp.cursor-help
cursormove.cursor-move
cursorpointer.cursor-pointer
cursorwait.cursor-wait
cursorzoom-in.cursor-zoom-in
cursorzoom-out.cursor-zoom-out
- - -
- adjust User Select -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropertyValueDefault class
user-selectnone.user-select-none
user-selectauto.user-select-auto
user-selecttext.user-select-text
user-selectall.user-select-all
- - -
- adjust Border Radius -
- - - - - - - - - - - - - - - - - -
PropertyDefault prefixDefault VariablesExample usage
border-radius.radius-4,8,10,12,14 -
- - - - - - -
-
 class="radius-8"
-
-
-
- - -
- adjust Stack Order -
- - - - - - - - - - - - - - - - - -
PropertyDefault prefixDefault VariablesExample usage
z-index.z--1,0,1,10,20,30,40,50,100,999,9999 -
- - - - - - -
-
 class="z-999"
-
-
-
- - -
- adjust Filter -
- - - - - - - - - - - - - - - - - - - - -
PropertyDefault classDefault Value
filter.filter-invertinvert(100%)
filter.filter-graygrayscale(100%)
- - -
- adjust Other Helpers -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Default classPropertyExample usage
.centeredmargin -
- - - - - - -
-
 class="centered"
-
-
-
.align.righttext-align -
- - - - - - -
-
 class="align right"
-
-
-
.align.lefttext-align -
- - - - - - -
-
 class="align left"
-
-
-
.align.centertext-align -
- - - - - - -
-
 class="align center"
-
-
-
.align.justifytext-align -
- - - - - - -
-
 class="align justify"
-
-
-
.float.rightfloat -
- - - - - - -
-
 class="float right"
-
-
-
.float.leftfloat -
- - - - - - -
-
 class="float left"
-
-
-
.full.widthfloat -
- - - - - - -
-
 class="full width"
-
-
-
.full.heightwidth -
- - - - - - -
-
 class="full height"
-
-
-
.fadeopacity -
- - - - - - -
-
 class="fade"
-
-
-
.hidedisplay -
- - - - - - -
-
 class="hide"
-
-
-
.spacerflex-grow -
- - - - - - -
-
 class="spacer"
-
-
-
.avatardisplay
border-radius		 -
- - - - - - -
-
 class="avatar"
-
-
-
.resetpadding
margin		 -
- - - - - - -
-
 class="reset"
-
-
-
.reversetransform -
- - - - - - -
-
 class="reverse"
-
-
-
.truncatedisplay
white-space
overflow
text-overflow		 -
- - - - - - -
-
 class="truncate"
-
-
-
.transparentbackground -
- - - - - - -
-
 class="transparent"
-
-
-
.purebackground
border
box-shadow		 -
- - - - - - -
-
 class="pure"
-
-
-
.borderedborder -
- - - - - - -
-
 class="bordered"
-
-
-
.borderlessborder -
- - - - - - -
-
 class="borderless"
-
-
-
.roundedborder-radius -
- - - - - - -
-
 class="rounded"
-
-
-
.radiuslessborder-radius -
- - - - - - -
-
 class="radiusless"
-
-
-
.shadowedbox-shadow -
- - - - - - -
-
 class="shadowed"
-
-
-
.shadowlessbox-shadow -
- - - - - - -
-
 class="shadowless"
-
-
-
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/base/introduction.html b/docs/base/introduction.html deleted file mode 100644 index 1f93e2a4..00000000 --- a/docs/base/introduction.html +++ /dev/null @@ -1,311 +0,0 @@ - - - - - - Introduction - Base : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Base
-
- - mic Introduction - -
-
- - format_paint Color Palette - -
-
- - border_clear Grid - -
-
- - emoji_people Helpers - -
-
-
- -
-
-
- -
- -
-
- Punica - Base - Introduction -
-
- - -
-
-
- mic Introduction -
-
-
-

- Punica CSS is a lightweight, responsive, modern and fully customizable pure CSS Framework based on SASS/SCSS. -

-
-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - -
InfoDefault
Font Family - Nunito -
Main Font Size13px
Main Font Weight400
Main Line Height1.7
-
-
-
-
- - -
-
-
Install From CDN
-
-
-

- Alternatively, if you want to quickly add Punica to your project, you can use the JsDelivr CDN. -

-
- - - - - - -
-
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/codeforms/Punica-CSS-Framework@1.8.0/dist/punica.min.css" crossorigin="anonymous">
-
-
-
-
-
-
HTML Markup
-
-
-

- For your default setup, add the Punica CSS file to the <head> element of your HTML5 document. Also - include the Material Icons library. That's it! -

-
- - - - - - -
-
-
<!DOCTYPE html> -
-
<html>
-
    <head>
-
        <title>Title</title>
-
        <meta charset="utf-8">
-
        <meta name="viewport" content="width=device-width, initial-scale=1">
-
        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-
        <link rel="stylesheet" href="css/punica.min.css" /> -
-
    </head>
-
    <body>
-
    </body>
-
</html>
-
-
-
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/alert.html b/docs/components/alert.html deleted file mode 100644 index 3e2eaee1..00000000 --- a/docs/components/alert.html +++ /dev/null @@ -1,395 +0,0 @@ - - - - - - Alert - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Alert -
-
- -
-
-
- error_outline Alert -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- Just add the .alert class to a span or div - element to create an alert. -

-
-
- -
-
-
Default
-
Primary
-
Success
-
Warning
-
Error
-
Dark
-
-
- -
- - - - - - -
-
-
<span class="alert">Default</span>
-
<div class="alert primary">Primary</div>
-
<div class="alert success">Success</div>
-
<div class="alert warning">Warning</div>
-
<div class="alert error">Error</div>
-
-
-
- -
- -
-
- Alert Sizes -
-
-
-

Add the .small and .large class to an alert to make it smaller or larger.

-
-
-
Small
-
Default
-
Large
-
- -
- - - - - - - - - - - - - -
PropsDefault Class Name
Container.alert
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesDefault Class Name
Default-
Primary.primary
Success.success
Warning.warning
Error.error
Dark.dark
- - - - - - - - - - - - - - - - - -
SizesDefault Class Name
Small.small
Large.large
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/badge.html b/docs/components/badge.html deleted file mode 100644 index 0e0f2ff2..00000000 --- a/docs/components/badge.html +++ /dev/null @@ -1,346 +0,0 @@ - - - - - - Badge - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Badge -
-
- -
-
-
- bookmark_border Badge -
-
-
-
-
Info
- - code Source - - - settings Variables - - - settings Mixins - -
-
-
-

- Just add the .badge class to a span or div - element to create a badge. -

-
-
- -
-
-
12
-
75
-
336
-
89567
-
59
-
549
-
-
- - -
-
-
- Badge Sizes -
-
-
-

Add the .tiny, .small or .large class to a badge to make it smaller or larger.

-
-
-
Tiny
-
Small
-
Default
-
Large
-
- -
- - - - - - - - - - - - - -
PropsDefault Class Name
Container.badge
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesDefault Class Name
Default-
Primary.primary
Success.success
Warning.warning
Error.error
Dark.dark
- - - - - - - - - - - - - - - - - - - - - - -
SizesDefault Class Name
Tiny.tiny
Small.small
Large.large
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/billboard.html b/docs/components/billboard.html deleted file mode 100644 index a0cd4267..00000000 --- a/docs/components/billboard.html +++ /dev/null @@ -1,550 +0,0 @@ - - - - - - Billboard - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Billboard -
-
- -
-
-
- panorama_wide_angle Billboard -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- Just add the .billboard class to a div element to create a billboard. -

-
-
- -
-
-
-
-

Billboard

-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo laboramus. Est cu nisl regione assueverit. Pri in sale volumus, saepe phaedrum qui ad. Iisque hendrerit at duo, ludus utinam nonumes sit an, ne mandamus inimicus rationibus usu. Te mea tempor alterum. At quis magna tamquam mea, soleat comprehensam definitionem mel at, ex vis zril mnesarchum. -

-
Button
-
-
-
-
-
- - - - - - -
-
-
<div class="billboard">
-
    <div class="body">
-
        <h2>Billboard</h2>
-
        <p>
-
            Lorem ipsum dolor sit amet..
-
        </p>
-
        <div class="button huge primary">Button</div>
-
    </div>
-
</div>
-
-
-
-
-
- - -
-
- - Billboard Sizes - -
-
-

- Add the .small or .large class to a billboard to make it smaller or larger. -

-
- - -
-
-
- -
-
-
Small Billboard with Media
-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo laboramus. Est cu nisl regione assueverit. Pri in sale volumus, saepe phaedrum qui ad. -

-
-
-
-
-
- - - - - - -
-
-
<div class="billboard small">
-
    <div class="media">
-
        <img src="" width="220">
-
    </div>
-
    <div class="body">
-
        <h5>Small Billboard with Media</h5>
-
        <p>
-
            Lorem ipsum dolor sit amet...
-
        </p>
-
    </div>
-
</div>
-
-
-
-
- - -
- - Billboard Styles - -
-
-
-
-
-
-
Default Billboard
-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo - laboramus. -

-
-
-
-
-
-
-
Primary Billboard
-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo - laboramus. -

-
-
-
-
-
-
-
Success Billboard
-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo - laboramus. -

-
-
-
-
-
-
-
Warning Billboard
-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo - laboramus. -

-
-
-
-
-
-
-
Error Billboard
-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo - laboramus. -

-
-
-
-
-
-
-
Dark Billboard
-

- Lorem ipsum dolor sit amet, vel no mentitum delicatissimi, adhuc rebum sadipscing in ius, mea ad cibo - laboramus. -

-
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.billboard
Media.media
Body.body
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesClass
Primary.primary
Success.success
Warning.warning
Error.error
Dark.dark
- - - - - - - - - - - - - - - - - - - - - -
SizesClass
Small.small
Large.large
Cover (full page).cover
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/breadcrumb.html b/docs/components/breadcrumb.html deleted file mode 100644 index df94738c..00000000 --- a/docs/components/breadcrumb.html +++ /dev/null @@ -1,373 +0,0 @@ - - - - - - Breadcrumb - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Breadcrumb -
-
- -
-
-
- multiple_stop Breadcrumb -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Breadcrumbs are used to show navigational hierarchies between contents. To apply this component, add a container - element with the .breadcrumb class and add child elements with the .item class. -

-
-
- -
-
-
- Home - Services - Web Development - SPA -
- -
- - - - - - -
-
-
<div class="breadcrumb">
-
    <a href="" class="item">Punica</a>
-
    <a href="" class="item">Components</a>
-
    <a href="" class="item active">Breadcrumb</a>
-
</div>
-
-
-
-
-
- -
-
- Breadcrumb Sizes -
-
-

- Add the .small and .large class to a breadcrumb to make it smaller or larger. -

-
-
-
- Home - Services - Web Development - SPA -
-
-
-
- Home - Services - Web Development - SPA -
-
-
-
- Home - Services - Web Development - SPA -
-
- -
- - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.breadcrumb
Breadcrumb Item.item
Active Item.active
- - - - - - - - - - - - - - - - - - -
SizesDefault Class Name
Small.small
Large.large
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/card.html b/docs/components/card.html deleted file mode 100644 index f6a5694d..00000000 --- a/docs/components/card.html +++ /dev/null @@ -1,839 +0,0 @@ - - - - - - Card - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Card -
-
- -
-
-
- wallpaper Card -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
- -
-
-
-
-
-
- -
-
-
Card Title
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo velit - debitis eos. -
-
-
-
-
- - - - - - -
-
-
<div class="card">
-
    <div class="media">
-
        <img src="">
-
    </div>
-
    <div class="title">
-
        <div class="h4">Card Title</div>
-
        <div class="subtitle">Card Subtitle</div>
-
    </div>
-
    <div class="description">
-
        Lorem ipsum dolor sit amet...
-
    </div>
-
</div>
-
-
-
-
-
-
-
-
-
-
-
-
-
Card
-
Card with Action Buttons
-
-
- -
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix. -
-
-
- - - -
-
-
-
-
-
Card
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo velit - debitis eos. Lorem ipsum dolor sit amet, eam ut singulis vituperata. -
-
- -
-
-
-
-
Card
-
Card with Form
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo velit - debitis eos. -
-
-
- - -
-
-
-
-
- - -
-
-
-
-
-
-
- - -
-
- Card Groups & Equal Height Cards -
-
-
-

- You can choose an arbitrary card count per row. Default system allows maximum 16 cards each row. The example below - shows three cards (.cards .three) will fit in the first row and the fourth card dynamically moves to the - second row. Also card groups automatically uses flex styles to match height between cards in the same row. -

-
-
-
-
-
-
Card Title
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo - velit debitis eos.Te vidisse cotidieque est, in adhuc honestatis his. Vel et clita oporteat, nam in - quaeque ocurreret. -
-
- -
-
-
-
-
Card Title
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo - velit debitis eos. -
-
- -
-
-
-
-
Card Title
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo - velit debitis eos.Te vidisse cotidieque est, in adhuc honestatis his. -
-
- -
-
-
-
-
Card Title
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo - velit debitis eos.Te vidisse cotidieque est. -
-
- -
-
-
-
-
Photo Group
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat temporibus vix, ei probo - velit debitis eos.Te vidisse cotidieque est, in adhuc honestatis his. Vel et clita oporteat, nam in - quaeque ocurreret. -
-
-
- -
- - - - - - - - - -
-
-
-
- - -
-
- Horizontal Cards -
-
-
-

- Just add the .horizontal class to .card container class. -

-
- .title, .subtitle and .description classes should be used in - .body container class for horizontal cards. -
-
- -
-
-
- -
-
-
-
Card Title
-
Card Subtitle
-
-
-

- Lorem ipsum dolor sit amet, his harum mediocrem euripidis at, in mutat legere vim, et vel aeque vitae abhorreant. Id simul omnesque efficiantur pro. -

- -
- - - -
-
-
-
-
- -
-
-
-
- -
- - - - - - - - - -
-
-
-
Photo Group
-
Card Subtitle
-
-
-

- Lorem ipsum dolor sit amet, his harum mediocrem euripidis at, in mutat legere vim, et vel aeque vitae - abhorreant. Id simul omnesque efficiantur pro. -

- -
- - - -
-
-
-
-
- -
-
-
-
- -
-
-
-
Card Title
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat. -
-
-
-
-
-
-
Card Title
-
Card Subtitle
-
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata, ut aliquid consequat. -
-
-
- -
-
-
-
-
-
-
-
- - - - - - -
-
-
<div class="card horizontal">
-
    <div class="media">
-
        <img src="">
-
    </div>
-
    <div class="body">
-
        <div class="title">
-
            <div class="h5">Card Title</div>
-
            <div class="subtitle">Card Subtitle</div>
-
        </div>
-
        <div class="description">
-
            Lorem ipsum dolor sit amet..
-
        </div>
-
    </div>
-
</div>
-
-
-
-
-
-
- - - - - - -
-
-
<div class="card horizontal">
-
    <div class="body">
-
        <div class="title">
-
            <div class="h5">Card Title</div>
-
            <div class="subtitle">Card Subtitle</div>
-
        </div>
-
        <div class="description">
-
            Lorem ipsum dolor sit amet..
-
        </div>
-
    </div>
-
    <div class="media">
-
        <img src="">
-
    </div>
-
</div>
-
-
-
-
-
- -
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Single Card.card
Card Groups.cards
Body.body
Title.title
Subtitle.subtitle
Description.description
Media.media
Actions.actions
- - - - - - - - - - - - - - - - - -
PositionsDefault Class Name
Default-
Horizontal.horizontal
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/list.html b/docs/components/list.html deleted file mode 100644 index d6218cae..00000000 --- a/docs/components/list.html +++ /dev/null @@ -1,674 +0,0 @@ - - - - - - List - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - List -
-
- -
-
-
- list_alt List -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- To apply this component, add the .list class to an unordered/ordered list or even div - element. And also, use the .item class for each list items. -

-
-
- -
-
-
-
-
- List Title -
-
    -
  • - Lorem ipsum dolor sit amet -
    • -
  • - Lorem ipsum dolor sit amet (active) -
    • -
  • - Lorem ipsum dolor sit amet -
    • -
-
-
-
-
- List Title -
-
- Lorem ipsum dolor sit amet -
-
- Lorem ipsum dolor sit amet -
-
- Lorem ipsum dolor sit amet (active) -
-
-
-
-
- -
-
Striped & Hovered List
-
-
-

- You can add the zebra-striping to a list by adding the .striped class and add the .hovered class to display a hover state on list items. -

-
-
-
-
- Striped List -
-
- reorder -
- Lorem ipsum dolor sit amet -
-
-
- reorder -
- Lorem ipsum dolor sit amet -
-
-
- reorder -
- Lorem ipsum dolor sit amet -
-
-
- reorder -
- Lorem ipsum dolor sit amet -
-
-
-
-
-
-
- Hovered List -
-
- reorder -
- Lorem ipsum dolor sit amet -
-
-
- - edit - - - delete - -
-
-
-
- reorder -
- Lorem ipsum dolor sit amet -
-
-
- - edit - - - delete - -
-
-
-
- reorder -
- Lorem ipsum dolor sit amet -
-
-
- - edit - - - delete - -
-
-
-
-
-
-
- -
-
List with inputs
-
-
-

- Lists can contain variety of form inputs. -

-
-
-
-
- reorder -
-
-
-
- - - - clear - -
-
-
-
-
-
- reorder -
-
-
-
- - - - clear - -
-
-
-
-
-
- reorder -
-
-
-
- - - - clear - -
-
-
-
-
-
-
-
-
-
- reorder -
-
-
-
- - -
-
-
-
-
-
- - edit - - - delete - -
-
-
-
- reorder -
-
-
-
- - -
-
-
-
-
-
- - edit - - - delete - -
-
-
-
- reorder -
-
-
-
- - -
-
-
-
-
-
- - edit - - - delete - -
-
-
-
-
-
-
- -
-
Media List
-
-
-

- Also, Lists can contain variety of media elements and actions buttons. -

-
-
-
-
- -
- Title - Subtitle - Lorem ipsum dolor sit amet, consectetur adipiscing elit. -
-
-
- -
- Title - Subtitle - Lorem ipsum dolor sit amet, consectetur adipiscing elit. -
-
-
- -
- Title - Subtitle - Lorem ipsum dolor sit amet, consectetur adipiscing elit. -
-
-
-
-
-
-
- -
- Title - Subtitle - Lorem ipsum dolor sit amet consectetur. -
-
-
-
- - keyboard_arrow_down - - -
-
-
-
-
- -
- Title - Subtitle - Lorem ipsum dolor sit amet consectetur. -
-
-
-
- - keyboard_arrow_down - - -
-
-
-
-
- -
- Title - Subtitle - Lorem ipsum dolor sit amet consectetur. -
-
-
-
- - keyboard_arrow_down - - -
-
-
-
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.list
List Items.item
Avtive Item.active
List Item Body.body
List Item Title.title
List Item Subtitle.subtitle
List Item Actions.actions
Divided List.divided
Hovered List.hovered
Striped List.striped
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/menu.html b/docs/components/menu.html deleted file mode 100644 index 09a8086f..00000000 --- a/docs/components/menu.html +++ /dev/null @@ -1,454 +0,0 @@ - - - - - - Menu - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Menu -
-
- -
-
-
- view_list Menu -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Menus are vertical list of links for navigation. To apply this component, add a container element with the - .menu class and add .item class for child elements. -

-
-
- -
-
-
-
-
-
Menu
-
- - My profile - -
-
- - Mail - -
- 63 -
-
-
- - Notifications - -
- 85 -
-
-
-
-
-
-
Divided Menu
-
- - person My profile - -
-
- - email Mail - -
- 63 -
-
-
- - notifications_active Notifications - -
- 85 -
-
-
-
-
-
-
Pure Menu
-
- - My profile - -
-
- - Mail - -
- 63 -
-
-
- - Notifications - -
- 85 -
-
-
-
-
- -
-
-
- - - - - - -
-
-
<div class="menu">
-
    <div class="title">Menu</div>
-
    <div class="item">
-
        <a href="" class="active">
-
            Item
-
        </a>
-
    </div>
-
    <div class="item">
-
        <a href="">
-
            Item
-
        </a>
-
    </div>
-
    <div class="item">
-
        <a href="">
-
            Item
-
        </a>
-
    </div>
-
</div>
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.menu
Divided Menu.divided
Menu Item.item
Menu Title.title
Active Item.active
Menu Badge.badge
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/navbar.html b/docs/components/navbar.html deleted file mode 100644 index e1bb3a49..00000000 --- a/docs/components/navbar.html +++ /dev/null @@ -1,448 +0,0 @@ - - - - - - Navbar - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Navbar -
-
- -
-
-
- explore Navbar -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- A navigation bar (or navigation system) is a section of a graphical user interface intended to aid visitors in - accessing site/app contents. The navbar component can include logo brand, nav links or buttons, search box or any - combination of those elements. Each section with the .section class will be evenly distributed in the - container. And the last .section item in the navbar will always to the right side. -

-
- To see the responsive hamburger menu, please check the main menu of the page. -
-
-
- -
-
-
-
-
- - - -
-
-
-
-
- - Menu 1 keyboard_arrow_down - - -
-
-
-
-
- - person - -
-
-
- - -
-
-
-
-
-
-
-
-

- If you want a light or dark navbar, just add the .light or .dark class to .navbar. -

-
-
-
-
-
- - - -
-
-
-
-
- - Menu 1 keyboard_arrow_down - - -
-
-
-
-
- - person - -
-
-
- - -
-
-
-
-
-
-
-
-
-
-
- - - -
-
-
-
-
- - Menu 1 keyboard_arrow_down - - -
-
-
-
-
- - person - -
-
-
- - -
-
-
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.navbar
Navbar Sections.section
Navbar Links.links
Navbar Link Items.buttons or .button
Navbar Brand.brand
Navbar Dropdown Item.dropdown
Navbar Burger Menu.burger
Navbar Spacer (if navbar is fixed).navbar-spacer
- - - - - - - - - - - - - - - - - - - - - - - - - -
Styles & StatesDefault Class Name
Light Navbar.light
Dark Navbar.dark
Fixed Navbar.fixed
Navbar with Shadow.shadowed
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/pagination.html b/docs/components/pagination.html deleted file mode 100644 index c0a75ff0..00000000 --- a/docs/components/pagination.html +++ /dev/null @@ -1,525 +0,0 @@ - - - - - - Pagination - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Pagination -
-
- -
-
-
- settings_ethernet Pagination -
-
-
-
-
Info
- - - -
-
-
-

- Punica's paging component consists of button element completely. Pagination - links can be made easily by creating a button group. -

-
-
- -
-
-
- - keyboard_arrow_left - - 1 - 2 - 3 -
- - keyboard_arrow_up - - -
- 56 - 57 - 58 - - keyboard_arrow_right - -
-
-
-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-
-
-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-
-
-
- - - - - - -
-
-
<div class="buttons">
-
    <a class="button" href="">
-
        <span class="material-icons">keyboard_arrow_left</span>
-
    </a>
-
    <a class="button" href="">1</a>
-
    <a class="button active" href="">2</a>
-
    <a class="button" href="">3</a>
-
    <button class="button inactive">...</button>
-
    <a class="button" href="">56</a>
-
    <a class="button" href="">57</a>
-
    <a class="button" href="">58</a>
-
    <a class="button" href="">
-
        <span class="material-icons">keyboard_arrow_right</span>
-
    </a>
-
</div>
-
-
-
-
-
- -
-
-
Pagination Sizes
-
-
-

- Also, add the .tiny, .mini, .small, .large or .huge class to .buttons to make it smaller or larger pagination. -

-
-
-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-

-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-

-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-

-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-

-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-

-
- - keyboard_arrow_left - - 1 - 2 - 3 - - 56 - 57 - 58 - - keyboard_arrow_right - -
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/panel.html b/docs/components/panel.html deleted file mode 100644 index d591b0fb..00000000 --- a/docs/components/panel.html +++ /dev/null @@ -1,636 +0,0 @@ - - - - - - Panel - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Panel -
-
- -
-
-
- check_box_outline_blank Panel -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Panels can be used to separate the content of a page. To apply this component, just add the .panel - class to a container element. -

-
-
- -
-
- -
-
-
-
-
Panel Title
-
-
- - launch - - - person - -
-
-
-
-
- Lorem ipsum dolor sit amet, eu duo inermis vocibus. -
-

- Eam insolens elaboraret in, sumo habeo nec ne. Dicta animal integre est cu, sea tacimates percipitur. -

-
-
-
Bottom Button
-
-
-
-
-
- - - - - - -
-
-
<div class="panel">
-
    <div class="header">
-
        <div class="title">Panel Title</div>
-
        <div class="actions">
-
            <div class="buttons mini">
-
                <a href="" class="button">
-
                    <span class="material-icons">launch</span>
-
                </a>
-
                <a href="" class="button">
-
                    <span class="material-icons">person</span>
-
                </a>
-
            </div>
-
        </div>
-
    </div>
-
    <div class="content">
-
        <div class="headline">
-
            Lorem ipsum dolor sit amet...
-
        </div>
-
        <p>
-
            Eam insolens elaboraret...
-
        </p>
-
    </div>
-
    <div class="bottom borderless">
-
        <div class="button block primary">Bottom Button</div>
-
    </div>
-
</div>
-
-
-
-
-
-
-
- - -
-
-
Pure Panel (No border and shadow)
-
-
-

- To remove border and shadow from the panel, just add the .pure helper class to .panel container element. -

-
-
-
-
-
Panel Title
-
-
- - launch - - - person - -
-
-
-
-
- Lorem ipsum dolor sit amet, eu duo inermis vocibus similique, vix ei facer mediocrem. -
-

- Eam insolens elaboraret in, sumo habeo nec ne. Dicta animal integre est cu, sea tacimates - percipitur. -

-
-
-
Bottom Button
-
-
- - launch - -
- - keyboard_arrow_up - - -
-
-
-
-
-
-
-
-
-
Panel Title
-
-
-
- Lorem ipsum dolor sit amet, eu duo inermis vocibus similique, vix ei facer mediocrem voluptaria -
-

- Eam insolens elaboraret in, sumo habeo nec ne. Dicta animal integre est cu, sea tacimates - percipitur. -

-
-
-
-
-
-
- - -
-
-
Panel with Media Elements
-
-
-

- Also, you can add the media elements to Panel component with the .media class. -

-
- .media class should be used in .content container class. -
-
-
-
-
-
Pure Panel with Media
-
-
-
- Lorem ipsum dolor sit amet, augue dolore facilisis ex usu, has agam erant an. Ad vel possim eruditi petentium, mei eu - tibique omittam voluptatibus. -
-
- -
-

- Eam insolens elaboraret in, sumo habeo nec ne. Dicta animal integre est cu, sea tacimates - percipitur adversarium ei, - justo volumus assentior cu nec. Ut facilisi consequat duo, te ius eleifend sadipscing scriptorem. -

-

- Lorem ipsum dolor sit amet, ea sit tation nostrum. Amet error utamur mel ad, congue meliore nam at, lorem dolorum at - qui. Mea an libris corpora delicatissimi. Eos velit fabellas sapientem an, rebum movet ex nec. Mea cu veniam corpora, - sint vide assum duo ne. -

-

- In illud nominati mel. Delectus singulis ex quo. At quem possit assentior pro, cu vix soleat postea luptatum. Minim - harum sententiae mea ex, vocibus vivendum eam ne, vis malis paulo efficiendi eu. Posse tempor commune eu his, has te - quis libris. Est simul recusabo in, et noster consectetuer per, sea no vitae lobortis incorrupte. Tritani legendos - disputationi eum id, suas dolorem inciderint et pri. -

-
-
-
-
-
-
- - -
-
-
Panel with Photo Group
-
-
-

- You can add the items of photo in the .media container and choose an arbitrary photo count per row. -

-
- All photos should be used in <div> or <a> element inside the .media container. -
-
-
-
-
-
Pure Panel with Photos
-
-
-
-
- -
-
- -
- - - - - - - - - -
-

- Eam insolens elaboraret in, sumo habeo nec ne. Dicta animal integre est cu, sea tacimates - percipitur adversarium ei, - justo volumus assentior cu nec. Ut facilisi consequat duo, te ius eleifend sadipscing scriptorem. -

-
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.panel
Panel Header.header
Header Border Style.dashed, .dotted
Panel Title.title
Panel Content.content
Panel Media.media
Panel Headline.headline
Panel Bottom.bottom
Panel Title & Bottom Actions.actions
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/process.html b/docs/components/process.html deleted file mode 100644 index 466900fe..00000000 --- a/docs/components/process.html +++ /dev/null @@ -1,717 +0,0 @@ - - - - - - Process - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Process -
-
- -
-
-
- low_priority Process -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- Add a container element with the .process class and add child elements with the .item - class. Also through the .active class will be highlighted items and indicate the current state of - process. -

-
-
- -
-
-
-
- Planning -
-
- Design -
-
- Content -
-
- Coding -
-
- Testing -
-
- Maintenance -
-
-
-
-
-
- Prewriting -
-
- Research -
-
- Drafting -
-
- Revising -
-
- Editing -
-
- Publishing -
-
-
-
-
-
- Prewriting -
-
- Research -
-
- Drafting -
-
- Revising -
-
- Editing -
-
- Publishing -
-
-
-
-
-
- Step 1 -
-
- Step 2 -
-
- Step 3 -
-
- Step 4 -
-
-
-
-
-
-
- - - - - - -
-
-
<div class="process">
-
    <div class="item">
-
        <a href="">Step 1</a>
-
    </div>
-
    <div class="item active"> -
-
        <a href="">Step 2</a>
-
    </div>
-
    ... -
-
    ... -
-
</div>
-
-
-
-
-
-
- - - - - - -
-
-
<div class="process error">
-
    <div class="item">
-
        <a href="">Step 1</a>
-
    </div>
-
    <div class="item active"> -
-
        <a href="">Step 2</a>
-
    </div>
-
    ... -
-
    ... -
-
</div>
-
-
-
-
-
-
- -
-
- Vertical Process -
-
-
-

- Also, just add the .vertical class to .process to make it vertical style. It's that easy! -

-
- Vertical style is also used for mobile devices. -
-
-
-
-
- Planning -
-
- Design -
-
- Content -
-
- Coding -
-
- Testing -
-
- Maintenance -
-
-
-
-
- - - - - - -
-
-
<div class="process vertical">
-
    <div class="item">
-
        <a href="">Step 1</a>
-
    </div>
-
    <div class="item active">
-
        <a href="">Step 2</a>
-
    </div>
-
    ... -
-
    ... -
-
</div>
-
-
-
-
-
-
- -
-
- Reversed Vertical Process -
-
-
-

- And also, you can reverse the items of process using by .reversed class. -

-
-
-
-
- Planning -
-
- Design -
-
- Content -
-
- Coding -
-
- Testing -
-
- Maintenance -
-
-
-
-
- - - - - - -
-
-
<div class="reversed vertical success process">
-
    <div class="item">
-
        <a href="">Step 1</a>
-
    </div>
-
    <div class="item active"> -
-
        <a href="">Step 2</a>
-
    </div>
-
    ... -
-
    ... -
-
</div>
-
-
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.process
Process Item.item
Active Item.active
Vertical Style.vertical
- - - - - - - - - - - - - - - - - - - - - -
PositionsDefault Class Name
Horizontal (default)-
Vertical.vertical
Reversed Vertical.reversed
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesDefault Class Name
Primary (default)-
Success.success
Warning.warning
Error.error
Dark.dark
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/progress.html b/docs/components/progress.html deleted file mode 100644 index 0b8a7b98..00000000 --- a/docs/components/progress.html +++ /dev/null @@ -1,352 +0,0 @@ - - - - - - Progress - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Progress -
-
- -
-
-
- hourglass_top Progress -
-
-
-
-
Info
- - - -
-
-
-

- Progress component is custom style for HTML5 progress element. Just add a .progress class - to any HTML5 progress element. -

-
-
- -
-
- - - - - -
-
-
- - - - - - -
-
-
<progress class="progress" value="40" max="100"></progress>
-
<progress class="progress success" value="55" max="100"></progress>
-
<progress class="progress warning" value="65" max="100"></progress>
-
<progress class="progress error" value="75" max="100"></progress>
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.process
Process Item.item
Active Item.active
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesDefault Class Name
Primary (default)-
Success.success
Warning.warning
Error.error
Dark.dark
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/tabnav.html b/docs/components/tabnav.html deleted file mode 100644 index 604992a5..00000000 --- a/docs/components/tabnav.html +++ /dev/null @@ -1,410 +0,0 @@ - - - - - - Tabnav - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Tabnav -
-
- -
-
-
- tab Tabnav -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Punica's Tabnav component consists of button element completely like Pagination - and - Navbar. Just add the .tab class to a container element to create a - tabbed - navigation consists of buttons. It's simple enough! -

-
- -
-
-
Item
-
Active 45
-
Disabled
-
-
- add Add -
-
-
- - Options keyboard_arrow_down - - -
-
-
-
-
-
-
Item
-
Active 45
-
Disabled
-
-
- add Add -
-
-
- - Options keyboard_arrow_down - - -
-
-
-
-
-
-
Item
-
Active
-
Disabled
-
-
- add Add -
-
-
- - Options keyboard_arrow_down - - -
-
-
-
-
-
-
Item
-
Active
-
Disabled
-
-
- add Add -
-
-
- - Options keyboard_arrow_down - - -
-
-
-
-
-
-
Item
-
Active
-
Disabled
-
-
- add Add -
-
-
- - Options keyboard_arrow_down - - -
-
-
-
- -
- - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.tab
Active Tab.active
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesDefault Class Name
Primary (default)-
Success.success
Warning.warning
Error.error
Dark.dark
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/timeline.html b/docs/components/timeline.html deleted file mode 100644 index a30a6547..00000000 --- a/docs/components/timeline.html +++ /dev/null @@ -1,600 +0,0 @@ - - - - - - Timeline - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Timeline -
-
- -
-
-
- timeline Timeline -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- To apply this component, add a container element with the .timeline class and add - .activity class for child elements. -

-
-
- -
-
-
-
-
-
-
- lock -
-
12.12.2020
-
John Doe,
-
- Te vidisse cotidieque est, in adhuc honestatis his. -
-
-
-
- lock -
-
12.12.2020
-
Jane Doe,
-
- Te vidisse cotidieque est, in adhuc honestatis his. -
-
-
-
- wifi_protected_setup -
-
- Jane Doe aliquid consequat - debitis eos. -
-
-
-
- extension -
-
John Doe,
-
- Oeehhh, that's awesome.. Me too! -
-
12.12.2020
-
-
-
- build -
-
Jane Doe,
-
- Lorem ipsum dolor sit amet, eam ut singulis vituperata! -
-
12.12.2020
-
-
-
- build -
-
John Doe,
-
- Random words in front of other random words create a random sentence. -
-
12.12.2020
-
-
-
-
-
- - - - - - -
-
-
<div class="timeline">
-
    <div class="activity">
-
        <div class="type">
-
            <span class="material-icons">lock</span>
-
        </div>
-
        <div class="date">12.12.2020</div>
-
        <div class="author">John Doe,</div>
-
        <div class="body">
-
            Te vidisse cotidieque est, in adhuc honestatis his. -
-
        </div>
-
    </div>
-
    ... -
-
    ... -
-
</div>
-
-
-
-
-
- -
-
- -
-
-
- Media & Actions -
-
-
-

- Also, you can add the media elements or actions to Timeline component with the .media and .actions classes. -

-
-
-
-
-
- photo -
-
Single Photo
-
- Et equidem ponderum posidonium ius, eu eum modo dictas impetus. Omnes voluptaria ea nam, vis ut ullum hendrerit. -
-
2 weeks ago
-
- -
-
-
- - - - - - -
-
-
-
-
- photo -
-
Three Photo Columns
-
- Et equidem ponderum posidonium ius, eu eum modo dictas impetus. Omnes voluptaria ea nam, vis ut ullum hendrerit. -
-
2 weeks ago
-
-
- -
-
- -
- - - - - - - - - -
-
-
-
-
-
-
-
- play_arrow -
- Youtube Video -
- Et equidem ponderum posidonium ius, eu eum modo dictas impetus. Omnes voluptaria ea nam, vis ut ullum hendrerit. -
-
2 hours ago
-
- -
-
-
- - - - - - -
-
-
-
-
- photo -
-
Two Photo Columns
-
- Et equidem ponderum posidonium ius, eu eum modo dictas impetus. Omnes voluptaria ea nam, vis ut ullum hendrerit. -
-
2 weeks ago
-
-
- -
- - - - - - - - - -
-
-
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.timeline
Timeline Item.activity
Activity by.author
Activity Detail.body
Activity Type.type
Activity Date.date
Activity Media.media
Activity Actions.actions
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesDefault Class Name
Default-
Primary.primary
Success.success
Warning.warning
Error.error
Dark.dark
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/components/tooltip.html b/docs/components/tooltip.html deleted file mode 100644 index 8573083f..00000000 --- a/docs/components/tooltip.html +++ /dev/null @@ -1,324 +0,0 @@ - - - - - - Tooltip - Components : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Components
-
- - error_outline Alert - -
-
- - bookmark_border Badge - -
-
- - panorama_wide_angle Billboard - -
-
- - multiple_stop Breadcrumb - -
-
- - wallpaper Card - -
-
- - list_alt List - -
-
- - view_list Menu - -
-
- - explore Navbar - -
-
- - settings_ethernet Pagination - -
-
- - check_box_outline_blank Panel - -
-
- - low_priority Process - -
-
- - hourglass_top Progress - -
-
- - tab Tabnav - -
-
- - timeline Timeline - -
-
- - chat_bubble_outline Tooltip - -
-
-
- -
-
-
-
- -
-
- Punica - Components - Tooltip -
-
- -
-
-
- chat_bubble_outline Tooltip -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Just add the .tooltip class to a span, button or div element to - create a tooltip. -

-
-
- -
-
-
-
Button
- Hello World! -
-
- Text - Hello World! -
-
-
-
- - - - - - -
-
-
<div class="tooltip">
-
    <div class="button">Button</div>
-
    <span class="text">Hello World!</span>
-
</div>
-
 
-
<div class="tooltip">
-
    Text -
-
    <span class="text">Hello World!</span>
-
</div>
-
-
-
-
- -
- - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.tooltip
Text.text
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/css/syntaxhighlighter.css b/docs/css/syntaxhighlighter.css deleted file mode 100644 index 1a77a393..00000000 --- a/docs/css/syntaxhighlighter.css +++ /dev/null @@ -1,328 +0,0 @@ -.syntaxhighlighter a, -.syntaxhighlighter div, -.syntaxhighlighter code, -.syntaxhighlighter table, -.syntaxhighlighter table td, -.syntaxhighlighter table tr, -.syntaxhighlighter table tbody, -.syntaxhighlighter table thead, -.syntaxhighlighter table caption, -.syntaxhighlighter textarea { - -moz-border-radius: 0 0 0 0 !important; - -webkit-border-radius: 0 0 0 0 !important; - /*background: 0 0 !important;*/ - border: 0 !important; - bottom: auto !important; - float: none !important; - height: auto !important; - left: auto !important; - line-height: 1.1em !important; - margin: 0 !important; - outline: 0 !important; - overflow: visible !important; - padding: 0 !important; - position: static !important; - right: auto !important; - text-align: left !important; - top: auto !important; - vertical-align: baseline !important; - width: auto !important; - box-sizing: content-box !important; - font-family: consolas, bitstream vera sans mono, courier new, Courier, monospace !important; - font-weight: 400 !important; - font-style: normal !important; - font-size: 1.017em !important; - min-height: inherit !important; - min-height: auto !important; -} -.syntaxhighlighter { - width: 100% !important; - margin: 1em 0 !important; - position: relative !important; - overflow: auto !important; - font-size: 1em !important; -} -.syntaxhighlighter.source { - overflow: hidden !important; -} -.syntaxhighlighter .bold { - font-weight: 700 !important; -} -.syntaxhighlighter .italic { - font-style: italic !important; -} -.syntaxhighlighter .line { - /*white-space: pre !important;*/ -} -.syntaxhighlighter table { - width: 100% !important; -} -.syntaxhighlighter table caption { - text-align: left !important; - padding: 0.5em 0 0.5em 1em !important; -} -.syntaxhighlighter table td.code { - width: 100% !important; -} -.syntaxhighlighter table td.code .container { - padding: 18px !important; - margin: 15px 0 !important; -} -.syntaxhighlighter table td.code .container { - position: relative !important; -} -.syntaxhighlighter table td.code .container textarea { - box-sizing: border-box !important; - position: absolute !important; - left: 0 !important; - top: 0 !important; - width: 100% !important; - height: 100% !important; - border: none !important; - background: #fff !important; - padding-left: 1em !important; - overflow: hidden !important; - white-space: pre !important; -} -.syntaxhighlighter table td.gutter .line { - text-align: right !important; - padding: 0 0.5em 0 1em !important; -} -.syntaxhighlighter table td.code .line { - padding: 0 1em !important; -} -.syntaxhighlighter.nogutter td.code .container textarea, -.syntaxhighlighter.nogutter td.code .line { - padding-left: 0 !important; -} -.syntaxhighlighter.show { - display: block !important; -} -.syntaxhighlighter.collapsed table { - display: none !important; -} -.syntaxhighlighter.collapsed .toolbar { - padding: 0.1em 0.8em 0 !important; - font-size: 1em !important; - position: static !important; - width: auto !important; - height: auto !important; -} -.syntaxhighlighter.collapsed .toolbar span { - display: inline !important; - margin-right: 1em !important; -} -.syntaxhighlighter.collapsed .toolbar span a { - padding: 0 !important; - display: none !important; -} -.syntaxhighlighter.collapsed .toolbar span a.expandSource { - display: inline !important; -} -.syntaxhighlighter .toolbar { - position: absolute !important; - right: 1px !important; - top: 1px !important; - width: 11px !important; - height: 11px !important; - font-size: 10px !important; - z-index: 10 !important; -} -.syntaxhighlighter .toolbar span.title { - display: inline !important; -} -.syntaxhighlighter .toolbar a { - display: block !important; - text-align: center !important; - text-decoration: none !important; - padding-top: 1px !important; -} -.syntaxhighlighter .toolbar a.expandSource { - display: none !important; -} -.syntaxhighlighter.ie { - font-size: 0.9em !important; - padding: 1px 0 !important; -} -.syntaxhighlighter.ie .toolbar { - line-height: 8px !important; -} -.syntaxhighlighter.ie .toolbar a { - padding-top: 0 !important; -} -.syntaxhighlighter.printing .line.alt1 .content, -.syntaxhighlighter.printing .line.alt2 .content, -.syntaxhighlighter.printing .line.highlighted .number, -.syntaxhighlighter.printing .line.highlighted.alt1 .content, -.syntaxhighlighter.printing .line.highlighted.alt2 .content { - background: 0 0 !important; -} -.syntaxhighlighter.printing .line .number { - color: #bbb !important; -} -.syntaxhighlighter.printing .line .content { - color: #000 !important; -} -.syntaxhighlighter.printing .toolbar { - display: none !important; -} -.syntaxhighlighter.printing a { - text-decoration: none !important; -} -.syntaxhighlighter.printing .plain, -.syntaxhighlighter.printing .plain a { - color: #000 !important; -} -.syntaxhighlighter.printing .comments, -.syntaxhighlighter.printing .comments a { - color: #008200 !important; -} -.syntaxhighlighter.printing .string, -.syntaxhighlighter.printing .string a { - color: blue !important; -} -.syntaxhighlighter.printing .keyword { - color: #3f73a3 !important; - font-weight: 400 !important; -} -.syntaxhighlighter.printing .preprocessor { - color: #5f5f5f !important; -} -.syntaxhighlighter.printing .variable { - color: #a70 !important; -} -.syntaxhighlighter.printing .value { - color: #090 !important; -} -.syntaxhighlighter.printing .functions { - color: #ff1493 !important; -} -.syntaxhighlighter.printing .constants { - color: #06c !important; -} -.syntaxhighlighter.printing .script { - font-weight: 700 !important; -} -.syntaxhighlighter.printing .color1, -.syntaxhighlighter.printing .color1 a { - color: #5f5f5f !important; -} -.syntaxhighlighter.printing .color2, -.syntaxhighlighter.printing .color2 a { - color: #ff1493 !important; -} -.syntaxhighlighter.printing .color3, -.syntaxhighlighter.printing .color3 a { - color: red !important; -} -.syntaxhighlighter.printing .break, -.syntaxhighlighter.printing .break a { - color: #000 !important; -} -.syntaxhighlighter { - background-color: transparent !important; -} -.syntaxhighlighter .line.alt1 { - background-color: transparent !important; -} -.syntaxhighlighter .line.alt2 { - background-color: transparent !important; -} -.syntaxhighlighter .line.highlighted.alt1, -.syntaxhighlighter .line.highlighted.alt2 { - background-color: #e0e0e0 !important; -} -.syntaxhighlighter .line.highlighted.number { - color: #000 !important; -} -.syntaxhighlighter table caption { - color: #000 !important; -} -.syntaxhighlighter .gutter { - color: #afafaf !important; -} -.syntaxhighlighter .gutter .line { - border-right: 3px solid #6ce26c !important; -} -.syntaxhighlighter .gutter .line.highlighted { - background-color: #6ce26c !important; - color: #fff !important; -} -.syntaxhighlighter.printing .line .content { - border: none !important; -} -.syntaxhighlighter.collapsed { - overflow: visible !important; -} -.syntaxhighlighter.collapsed .toolbar { - color: blue !important; - background: #fff !important; - border: 1px solid #6ce26c !important; -} -.syntaxhighlighter.collapsed .toolbar a { - color: blue !important; -} -.syntaxhighlighter.collapsed .toolbar a:hover { - color: red !important; -} -.syntaxhighlighter .toolbar { - color: #fff !important; - background: #6ce26c !important; - border: none !important; -} -.syntaxhighlighter .toolbar a { - color: #fff !important; -} -.syntaxhighlighter .toolbar a:hover { - color: #000 !important; -} -.syntaxhighlighter .plain, -.syntaxhighlighter .plain a { - color: #424242 !important; -} -.syntaxhighlighter .comments, -.syntaxhighlighter .comments a { - color: #008200 !important; -} -.syntaxhighlighter .string, -.syntaxhighlighter .string a { - color: #126dc1 !important; -} -.syntaxhighlighter .keyword { - color: #60802e !important; -} -.syntaxhighlighter .preprocessor { - color: #5f5f5f !important; -} -.syntaxhighlighter .variable { - color: #a70 !important; -} -.syntaxhighlighter .value { - color: #090 !important; -} -.syntaxhighlighter .functions { - color: #ff1493 !important; -} -.syntaxhighlighter .constants { - color: #06c !important; -} -.syntaxhighlighter .script { - font-weight: 700 !important; - color: #069 !important; - background-color: none !important; -} -.syntaxhighlighter .color1, -.syntaxhighlighter .color1 a { - color: #8c773e !important; -} -.syntaxhighlighter .color2, -.syntaxhighlighter .color2 a { - color: #ff1493 !important; -} -.syntaxhighlighter .color3, -.syntaxhighlighter .color3 a { - color: red !important; -} -.syntaxhighlighter .keyword { - font-weight: 400 !important; -} diff --git a/docs/elements/button.html b/docs/elements/button.html deleted file mode 100644 index 2d9817c9..00000000 --- a/docs/elements/button.html +++ /dev/null @@ -1,710 +0,0 @@ - - - - - Button & Dropdown - Elements : Punica CSS - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Elements
-
- - crop_landscape Button & Dropdown - -
-
- - line_style Form - -
-
- - insert_emoticon Icon - -
-
- - book Label - -
-
- - table_chart Table - -
-
- - text_fields Typography - -
-
-
- -
-
-
-
-
-
- Punica - Elements - Button -
-
- -
-
-
- crop_landscape Button & Dropdown -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- There are several style modifiers available. -

-
-
-
Default
-
Active
-
Disabled
-
Link
-
Secondary
-
-
- - Success -
Warning
-
Error
-
Dark
-
- - -
- - Button Sizes - -
-
-

- Add the .tiny, .mini, .small, .large or .huge class to a button to make it smaller or larger. - Also, you can add the .block class for a full-width button. -

-
-
- Tiny - Mini - Small - Default - Large - Huge -

- Block Button -
- - -
- - Button Groups - -
-
-

- To create a button group, add the .buttons class to a div element around the buttons. -

- -
-
-
- - - Button - - -
-
- - - Secondary - - -
-

-
- - person - -
254
-
-
- - launch - -
458
-
-
- - thumb_up - -
276
-
-
- - lock - -
63
-
-
- - input - -
395
-
-
-
-
-
- shopping_cart -
-
- $175 -
-
- Checkout Now ! -
-
-
-
- -

- Also, add the .tiny, .mini, .small, .large or .huge class to .buttons to make it - smaller or larger group buttons. -

- -
-
-
- - launch - - - person - - - directions_run - -
-
- - launch - - - person - - - directions_run - -
-
- - launch - - - person - - - directions_run - -
-
-
- -

- And you can add the .block class to .buttons for a full-width button group. -

- -
-
-
- - Button - - - Button - - - Button - -
-
-
-
- - -
- - Secondary Button - -
-
-

- You can add the .secondary class to a .button or .buttons to change the - style as secondary. -

-
-
- -
- - launch - - - person - - - directions_run - -
-
- - launch - - - person - - - directions_run - -
-
- - -
- - Button with Dropdown - -
-
-

- A button can be used to trigger a dropdown menu. -

-
-
-
-
- - Default Dropdown keyboard_arrow_down - - -
-
-
-
- - Clickable Dropdown keyboard_arrow_down - - -
-
-
-
Small Dropdown
-
- - keyboard_arrow_down - - -
-
-
-
-
-
- drafts Mini -
-
254
-
- - keyboard_arrow_up - - -
-
-
-
- - keyboard_arrow_up - - -
-
254
-
- drafts -
-
-
-
- - keyboard_arrow_down - - -
-
254
-
- drafts -
-
-
-
-

- You can change the direction of the dropdown by adding any .right .left .top .top.left .top.right .bottom.left .bottom.right classes to .dropdown container. -

-
-
-
- - north_west - - -
-
-
-
- - north_east - - -
-
-
-
-
-
- - west - - -
-
-
-
- - east - - -
-
-
-
-
-
- - south_west - - -
-
-
-
- - south_east - - -
-
-
-
- - -
-
- Vertical Button Groups -
-
-
-

- Also, just add the .vertical class to .buttons to make it vertical button group. -

-
-
-
- - - -
-
- - - -
-
- - - -
-
- -
- - keyboard_arrow_left verified_user - - -
-
- - settings keyboard_arrow_right - - -
-
-
- - - -
-
-
-
-
-
- - -
- - keyboard_arrow_left Scheduled Reminders - - -
-
-
-
-
- - -
- - Scheduled Reminders keyboard_arrow_right - - -
-
-
-
-
-
-
-
-
-
-
-
- - -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - \ No newline at end of file diff --git a/docs/elements/form.html b/docs/elements/form.html deleted file mode 100644 index e726c7a1..00000000 --- a/docs/elements/form.html +++ /dev/null @@ -1,806 +0,0 @@ - - - - - - Form - Elements : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Elements
-
- - crop_landscape Button & Dropdown - -
-
- - line_style Form - -
-
- - insert_emoticon Icon - -
-
- - book Label - -
-
- - table_chart Table - -
-
- - text_fields Typography - -
-
-
- -
-
-
-
- -
-
- Punica - Elements - Form -
-
- -
-
-
- line_style Form -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- Forms provide the most common control styles used in forms, including input, textarea, select, checkbox and - radio. -

-
- - -
-
-
- - -
-
- - -
-
-
- - -
-
- - -
-
-
-
- - -
-
- - -
-
- - -
-
-
-
- - -
-
- - -
-
- - -
-
- - -
-
-
-
- - -
-
- - -
-
-
-
- - -
-
-
- - -
-
-
-
- - -
-
- - -
-
-
-
-
- - -
- -
-
-
- - -
- Form Items -
-
-

- Form inputs are designed to be flexible to your form elements. You can choose an arbitrary column count per - row. Default - system allows maximum 16 items. The example below shows three items .three .items will fit in the - first row - and the fourth item dynamically moves to the second row. -

-
- info All .items group classes should be used in - .form container class. -
-
-
-
- - -
-
- - -
-
- - - -
-
-
-
- - - - - - -
-
-
<form class="form">
-
    <div class="three items"> -
-
        <div class="item">
-
            <label>First Name</label>
-
            <input type="text>
-
        </div>
-
        <div class="item">
-
            <label>Last Name</label>
-
            <input type="text">
-
        </div>
-
        <div class="item">
-
            <label for="colors">Choose a color:</label>
-
            <select name="colors" id="colors">
-
                <option value="black">Black</option>
-
                <option value="white">White</option>
-
                <option value="blue">Blue</option>
-
                <option value="orange">Orange</option>
-
            </select>
-
        </div>
-
    </div>
-
</form>
-
-
-
-
- - -
- Form Groups -
-
-

You can attach select, input or button along with an input. Just add the .group class to a container - class in the .item container.

-
- info All .group classes should be used in - .form or .form > .item container class. -
-
-
-
- - -
-
-
-
- - - - clear - -
-
-
-
-
- call -
- -
-
-
- -
- - - - -
-
-
-
- - - - - - -
-
-
<div class="form">
-
    <div class="item">
-
        <label>Your Full Name</label>
-
        <div class="group">
-
            <select name="title">
-
                <option value="mr">Mr.</option>
-
                <option value="mrs">Mrs.</option>
-
            </select>
-
            <input type="text" name="name">
-
            <input type="text" name="middle">
-
            <input type="text" name="surname">
-
        </div>
-
    </div>
-
</div>
-
-
-
-
- - -
- Form Input Sizes -
-
-

- Add the .small or .large class to .form class to make it smaller or - larger - inputs or buttons. -

-
-
- -
- - - - - -
-
-
-
-
- -
- - - - - -
-
-
-
-
- -
- - - - - -
-
-
-
- - -
- Validation Feedbacks -
-
-

- You can indicate invalid or valid form fields with .error or .success classes for input validation states. Just add the .error or .success class to <input>, <textarea> and <select> element. -

-
-
-
- - -
-
- - -
-
-
-
- - -
- Horizontal Forms -
-
-

- If you want to have a horizontal form, you can use the Punica's Grid system. -

-
-
-
- -
-
-
- - - - -
-
-
-
-
- -
-
- -
-
-
-
- -
-
-
- - -
-
- - -
-
-
-
-
- -
-
- -
-
-
-
- -
-
-
- - -
-
-
-
-
- -
-
-
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropsDefault Class Name
Container.form
Form Items.items
Form Item.item
Form Group.group
Punica's Checkbox.checkbox
Punica's Radio.radio
- - - - - - - - - - - - - - - - - - - - - -
SizesDefault Class Name
Default-
Small.small
Large.large
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/elements/icon.html b/docs/elements/icon.html deleted file mode 100644 index 489eb08e..00000000 --- a/docs/elements/icon.html +++ /dev/null @@ -1,258 +0,0 @@ - - - - - - Icon - Elements : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Elements
-
- - crop_landscape Button & Dropdown - -
-
- - line_style Form - -
-
- - insert_emoticon Icon - -
-
- - book Label - -
-
- - table_chart Table - -
-
- - text_fields Typography - -
-
-
- -
-
-
- -
-
-
- Punica - Elements - Icon -
-
- -
-
-
- insert_emoticon Icon -
-
-
-

- Punica CSS uses Material Icons designed by - Google design team. Material icons are delightful, beautifully crafted symbols for common actions and items. -

- -

- The easiest way to set up icon fonts for use in any web page is through Google Web Fonts. All you need to do is - include - a single line of HTML: -

- -
- - - - - - -
-
-
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-
-
-
- -
- Learn how to set up and use icon fonts in developer guide. -
- -

- It’s easy to incorporate icons into your web page. Here’s a small example: -

-
-
- -
-
- - 3d_rotation - - - accessibility - - - accessibility_new - - - accessible - - - accessible_forward - -
-
- -
- - - - - - -
-
-
<span class="material-icons">3d_rotation</span>
-
<i class="material-icons">accessibility</i>
-
-
-
-
-
-
-
- -
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/elements/label.html b/docs/elements/label.html deleted file mode 100644 index 31483361..00000000 --- a/docs/elements/label.html +++ /dev/null @@ -1,328 +0,0 @@ - - - - - Label - Elements : Punica CSS - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Elements
-
- - crop_landscape Button & Dropdown - -
-
- - line_style Form - -
-
- - insert_emoticon Icon - -
-
- - book Label - -
-
- - table_chart Table - -
-
- - text_fields Typography - -
-
-
- -
-
-
- -
- -
-
- Punica - Elements - Label -
-
- -
-
-
- book Label -
-
-
-
-
Info
- - code Source - - - settings Variables - - - toys Mixins - -
-
-
-

- Just add the .label class to a span or div element to create a label. -

-
-
- -
-
- Default -
Primary
-
Success
-
Warning
-
Error
-
Dark
-
-
-
- - - - - - -
-
-
<span class="label">Default</span>
-
<div class="label primary">Primary</div>
-
<div class="label success">Success</div>
-
<div class="label warning">Warning</div>
-
<div class="label error">Error</div>
-
-
-
-
-
- -
-
-
- Label Sizes -
-
-
-

Add the .small or .large class to a label to make it smaller or larger.

-
-
-
Small
-
Default
-
Large
-
- -
- - - - - - - - - - - - - -
PropsDefault Class Name
Container.label
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
StylesDefault Class Name
Default-
Primary.primary
Success.success
Warning.warning
Error.error
Dark.dark
- - - - - - - - - - - - - - - - - -
SizesDefault Class Name
Small.small
Large.large
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - \ No newline at end of file diff --git a/docs/elements/table.html b/docs/elements/table.html deleted file mode 100644 index bf7e57bd..00000000 --- a/docs/elements/table.html +++ /dev/null @@ -1,599 +0,0 @@ - - - - - Table - Elements : Punica CSS - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Elements
-
- - crop_landscape Button & Dropdown - -
-
- - line_style Form - -
-
- - insert_emoticon Icon - -
-
- - book Label - -
-
- - table_chart Table - -
-
- - text_fields Typography - -
-
-
- -
-
-
-
- -
-
- Punica - Elements - Table -
-
- -
-
-
- table_chart Table -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Just add the .table class to any table element. The class will add padding, border and - emphasized table header. -

- - - - - - - - - - - - - - - - - - - - - - - - - -
Table HeadingTable HeadingTable Heading
Table DataTable DataTable Data
Table DataTable DataTable Data
Table DataTable DataTable Data
-
- - -
-
- Hovered Tables -
-
-
-

- Add the .hovered class to display a hover state on table rows. -

-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - star_half - - - photo - Year / Title / Director -
-
-
- - - -
-
-
-
9,3 - - - 1994
- The Shawshank Redemption
- Frank Darabont - 		- Two imprisoned men bond over a number of years, finding solace and eventual redemption through acts of - common decency. -
9,2 - - - 1972
- The Godfather
- Francis Ford Coppola - 		- The aging patriarch of an organized crime dynasty transfers control of his clandestine empire to his - reluctant son. -
9,0 - - - 1974
- The Godfather: Part II
- Francis Ford Coppola - 		- The early life and career of Vito Corleone in 1920s New York City is portrayed, while his son, Michael, - expands and - tightens his grip on the family crime syndicate. -
9,0 - - - 2008
- The Dark Knight
- Christopher Nolan - 		- When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, Batman must accept - one of the - greatest psychological and physical tests of his ability to fight injustice. -
8,9 - - - 1957
- 12 Angry Men
- Sidney Lumet - 		- A jury holdout attempts to prevent a miscarriage of justice by forcing his colleagues to reconsider the - evidence. -
-
-
-
- - -
-
- Striped Tables -
-
-
-

- Add zebra-striping to a table by adding the .striped class. -

-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - star_half - - - photo - Year / Title / Director -
-
-
- - - -
-
-
-
9,3 - - - 1994
- The Shawshank Redemption
- Frank Darabont - 		- Two imprisoned men bond over a number of years, finding solace and eventual redemption through acts of common decency. -
9,2 - - - 1972
- The Godfather
- Francis Ford Coppola - 		- The aging patriarch of an organized crime dynasty transfers control of his clandestine empire to his reluctant son. -
9,0 - - - 1974
- The Godfather: Part II
- Francis Ford Coppola - 		- The early life and career of Vito Corleone in 1920s New York City is portrayed, while his son, Michael, expands and - tightens his grip on the family crime syndicate. -
9,0 - - - 2008
- The Dark Knight
- Christopher Nolan - 		- When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, Batman must accept one of the - greatest psychological and physical tests of his ability to fight injustice. -
8,9 - - - 1957
- 12 Angry Men
- Sidney Lumet - 		- A jury holdout attempts to prevent a miscarriage of justice by forcing his colleagues to reconsider the evidence. -
-
-
-
- - -
-
- Active Table Row -
-
-
-

- Just add the .active class to any tr element in table. -

-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Table HeadingTable HeadingTable Heading
Table DataTable DataTable Data -
- - edit - - - delete - -
-
Table DataTable DataTable Data -
- - edit - - - delete - -
-
Table DataTable DataTable Data -
- - edit - - - delete - -
-
Active Table RowTable DataTable Data -
- - edit - - - delete - -
-
Table DataTable DataTable Data -
- - edit - - - delete - -
-
Table DataTable DataTable Data -
- - edit - - - delete - -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - \ No newline at end of file diff --git a/docs/elements/typography.html b/docs/elements/typography.html deleted file mode 100644 index 9e05a79b..00000000 --- a/docs/elements/typography.html +++ /dev/null @@ -1,385 +0,0 @@ - - - - - - Typography - Elements : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Elements
-
- - crop_landscape Button & Dropdown - -
-
- - line_style Form - -
-
- - insert_emoticon Icon - -
-
- - book Label - -
-
- - table_chart Table - -
-
- - text_fields Typography - -
-
-
- -
-
-
-
- -
-
- Punica - Elements - Typography -
-
- -
-
-
- text_fields Typography -
-
-
-
-
Info
- - code Source - - - settings Variables - - -
-
-
-

- Typography sets default styles for headings, paragraphs, blockquote and lists elements. -

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Class / TagsText
.h1/<h1></h1> -

h1 Heading

-
.h2/<h2></h2> -

h2 Heading

-
.h3/<h3></h3> -

h3 Heading

-
.h4/<h4></h4> -

h4 Heading

-
.h5/<h5></h5> -
h5 Heading
-
.h6/<h6></h6> -
h6 Heading
-
-
-
- -
-
-
Paragraphs
-
-
-

- Lorem ipsum dolor sit amet, quo in nibh mediocritatem concludaturque. Aeque consectetuer nam ut, ad appetere ocurreret mea. Nec an facilis torquatos. Pro te ferri democritum inciderint. Quis inani virtute vim cu, ad debet tincidunt mea. Audire mentitum deleniti has ex, sea veri omnis ut. Pri eu enim prodesset abhorreant. -

-
-
?
- - - - - - -
-
-
<p>Lorem ipsum dolor sit amet, ...</p>
-
-
-
-
-
- -
-
-
Links
-
-
- -
-
?
- - - - - - -
-
-
<a href="#">List 1</a>
-
-
-
-
-
- -
-
-
Blockquote
-
-
-
-

Learning never exhausts the mind.

- - Leonardo da Vinci -
-
-
?
- - - - - - -
-
-
<blockquote>
-
    <p>Learning never exhausts the mind.</p>
-
    <cite>- Leonardo da Vinci</cite>
-
</blockquote>
-
-
-
-
-
- -
-
-
Lists
-
-
-
-
-

Unordered list

-
    -
  • list item 1
    • -
  • list item 2 -
      -
    • list item 2.1
      • -
    • list item 2.2
      • -
    • list item 2.3
      • -
    -
    • -
  • list item 3
    • -
-
-
-

Ordered list

-
    -
  1. list item 1
    2. -
  2. list item 2 -
      -
    1. list item 2.1
      2. -
    2. list item 2.2
      3. -
    3. list item 2.3
      4. -
    -
    3. -
  3. list item 3
    4. -
-
-
-

Description List

-
-
description list term 1
-
description list description 1
-
description list term 2
-
description list description 2
-
description list term 3
-
description list description 3
-
-
-
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. - Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/examples/alpinejs.html b/docs/examples/alpinejs.html deleted file mode 100644 index fcd737a2..00000000 --- a/docs/examples/alpinejs.html +++ /dev/null @@ -1,234 +0,0 @@ - - - - - - Alpine.js - Examples : Punica CSS - - - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Examples
-
- - build_circle Alpine.js - -
-
- - article Pages - -
-
-
- -
-
-
-
- -
-
- Punica - Examples - Alpine.js -
-
- -
-
-
- - build_circle Alpine.js - - - error_outline Optional - -
-
-
-

- Punica is a pure CSS framework but you can easily integrate the Punica with the Alpine.js (or any other framework/library you like) for JS interactivities. -

-

- Alpine.js is a rugged, minimal frontend development framework for adding JavaScript behavior to HTML markups. -

-

- If you want to add Alpine.js to your project, add the following script tag to the section of your layout file. -

-
- - -
-
- HTML Markup -
-
-
-
<!DOCTYPE html>
<html>
    <head>
        <title>Title</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/codeforms/Punica-CSS-Framework@1.8.0/dist/punica.min.css" crossorigin="anonymous">
        <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js" defer></script>
    </head>
    <body>
    </body>
</html>
-
-
- -
-
-
- Tab -
-
-
-

- Here's an example of using AlpineJS for "tab" functionality inside a Punica component's view. -

-

- See the Pen - Punica CSS + Alpine.js Tab by Fatih Kececi (@underlinewords) - on CodePen. -

-
-
-
- Accordion -
-
-
-

- See the Pen - Punica CSS + Alpine.js Accordion by Fatih Kececi (@underlinewords) - on CodePen. -

-
-
-
- Modal -
-
-
-

- See the Pen - Punica CSS + Alpine.js Modal by Fatih Kececi (@underlinewords) - on CodePen. -

-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/examples/pages.html b/docs/examples/pages.html deleted file mode 100644 index 29b0532c..00000000 --- a/docs/examples/pages.html +++ /dev/null @@ -1,188 +0,0 @@ - - - - - - Pages - Examples : Punica CSS - - - - - - - -
-
- -
- - - -
-
-
-
-
- - Base keyboard_arrow_down - - -
-
- - Elements keyboard_arrow_down - - -
-
- - Components keyboard_arrow_down - - -
-
-
-
-
-
- - toys Examples keyboard_arrow_down - - -
- - Changelog - - - Github - -
-
-
- -
-
- -
-
- -
-
-
Examples
-
- - build_circle Alpine.js - -
-
- - article Pages - -
-
-
- -
-
-
-
- -
-
- Punica - Examples - Pages -
-
- -
-
-
-
- article Pages -
-
-
-
- -
-
-
-
-
-
- lens - Login Page 1 (with card) -
-
- lens - Login Page 2 (with panel) -
-
- lens - Login Page 3 (with horizontal card) -
-
- lens - Blank Dashboard Starter -
-
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
- -
-
- Designed and developed by CodeForms. Punica CSS is - licensed under the MIT License. -
-
- - - \ No newline at end of file diff --git a/docs/images/bg.jpg b/docs/images/bg.jpg deleted file mode 100644 index f660ba1c..00000000 Binary files a/docs/images/bg.jpg and /dev/null differ diff --git a/docs/images/logo.png b/docs/images/logo.png deleted file mode 100755 index 72f48187..00000000 Binary files a/docs/images/logo.png and /dev/null differ diff --git a/docs/images/punica.png b/docs/images/punica.png deleted file mode 100755 index 50cd6a38..00000000 Binary files a/docs/images/punica.png and /dev/null differ diff --git a/docs/index.html b/docs/index.html deleted file mode 100644 index 1525b1b2..00000000 --- a/docs/index.html +++ /dev/null @@ -1,30 +0,0 @@ - - - - - Punica CSS - - - - -
-
-
-
- -
-

- Punica CSS is a Lightweight, Responsive, Modern and Fully Customizable Pure CSS Framework based on SASS/SCSS. -

-
-
- Get Started - Changelog - Github -
-
-
-
-
- - \ No newline at end of file diff --git a/src/Components/Alert/Alert.scss b/src/Components/Alert/Alert.scss index 4031b2da..19695bb9 100644 --- a/src/Components/Alert/Alert.scss +++ b/src/Components/Alert/Alert.scss @@ -1,60 +1,56 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : ALERT **********************/ -// -// if alert is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : ALERT +///////////////////////////////////////////////////////// +/// +/// if alert is enable +/// @if $components-alert { .#{$alert-name} { - display: block; - @include set-style($main-bg, $main-font-color) { - border-color: $main-bg; + @include set-style(theme('main-bg'), theme('text-color')) { + display: block; + @include border(); + border-radius: theme('border-radius'); + padding: .6rem; + margin: 0 0 8px; + width: 100%; + font-weight: 700; a { - color: $main-font-color; + color: theme('text-color'); + text-decoration: underline; + &:focus, + &:hover, + &:active, + &.#{$alert-active} { + opacity: .75; + } } - }; - border: $main-border-width $main-border-style $main-border-color; - border-radius: $alert-border-radius; - padding: $alert-padding; - margin: $alert-margin; - width: 100%; - font-weight: $alert-font-weight; - // - // STYLES - // + p { + &:last-child { + margin-bottom: 0; + } + } + >i, + >.#{$icon-font-class-name} { + vertical-align: text-top; + } + } + /// + /// STYLES + /// @if($components-alert-styles) { @each $style-name, $bg-color in $alert-styles { - @include set-style($bg-color, $main-invert-color, $style-name) { + @include set-style($bg-color, theme('color-negative'), $style-name) { border-color: darken($bg-color, 5%); }; } } - // - // SIZES - // + /// + /// SIZES + /// @if ($components-alert-sizes) { - // badge sizes @each $size-name, $font-size, $padding in $alert-sizes { @include set-size($font-size, $padding, $size-name); } } - a { - color: $primary-color; - text-decoration: underline; - &:focus, - &:hover, - &:active, - &.#{$alert-active} { - opacity: .75; - } - } - p { - &:last-child { - margin-bottom: 0; - } - } - >i, - >.#{$icon-font-class-name} { - vertical-align: text-top; - } } } \ No newline at end of file diff --git a/src/Components/Alert/variables.scss b/src/Components/Alert/variables.scss index 86793b94..b3516ba1 100644 --- a/src/Components/Alert/variables.scss +++ b/src/Components/Alert/variables.scss @@ -1,32 +1,24 @@ -/***************************************************** -PUNICA CSS > COMPONENT : ALERT > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENT : ALERT > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$alert-name : 'alert'; -$alert-active : 'active'; +/// CLASS NAMING ======================================== +$alert-name : 'alert'; +$alert-active : 'active'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $alert-styles: ( - "primary": $primary-color, - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color, + // style name, theme variable + "primary" : theme('primary-color'), + "success" : theme('success-color'), + "warning" : theme('warning-color'), + "error" : theme('error-color'), + "dark" : theme('color-dark'), ); -/***************************************************** -SIZES ************************************************/ -// size name, font-size, padding +/// SIZES =============================================== $alert-sizes: ( + // size name, font-size, padding ("small", .749rem, .4rem), ("large", 1.1rem, .8rem) -); - -/***************************************************** -PREFERENCES ******************************************/ -$alert-padding : .6rem; -$alert-margin : 0 0 8px; -$alert-border-radius : $main-border-radius; -$alert-font-weight : 700; \ No newline at end of file +); \ No newline at end of file diff --git a/src/Components/Badge/Badge.scss b/src/Components/Badge/Badge.scss index 0c9b43e1..39e2d6c8 100644 --- a/src/Components/Badge/Badge.scss +++ b/src/Components/Badge/Badge.scss @@ -1,32 +1,33 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : BADGE **********************/ -// -// if badge is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : BADGE +///////////////////////////////////////////////////////// +/// +/// if badge is enable +/// @if $components-badge { .#{$badge-name} { - position: relative; - white-space: nowrap; - display: inline-flex; - justify-content: center; - align-items: center; - font-weight: $badge-font-weight; - border-radius: $badge-border-radius; - @include set-size($badge-font-size, $badge-padding); - @include set-style($main-bg, $main-font-color); - // - // STYLES - // + @include set-style(theme('background-color'), theme('text-color')) { + position: relative; + white-space: nowrap; + display: inline-flex; + justify-content: center; + align-items: center; + font-weight: 700; + border-radius: 500px; + }; + @include set-size(.854rem, 1px 6px); + /// + /// STYLES + /// @if $components-badge-styles { @each $name, $bg-color in $badge-styles { - @include set-style($bg-color, $main-invert-color, $name); + @include set-style($bg-color, theme('color-negative'), $name); } } - // - // SIZES - // + /// + /// SIZES + /// @if ($components-badge-sizes) { - // badge sizes @each $size-name, $font-size, $padding in $badge-sizes { @include set-size($font-size, $padding, $size-name); } diff --git a/src/Components/Badge/variables.scss b/src/Components/Badge/variables.scss index 1eca3cb9..7f140a06 100644 --- a/src/Components/Badge/variables.scss +++ b/src/Components/Badge/variables.scss @@ -1,32 +1,23 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : BADGE > VARIABLES **********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : BADGE > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$badge-name : 'badge'; +/// CLASS NAMING ======================================== +$badge-name : 'badge'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $badge-styles: ( - "primary": $primary-color, - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color, + "primary" : theme('primary-color'), + "success" : theme('success-color'), + "warning" : theme('warning-color'), + "error" : theme('error-color'), + "dark" : theme('color-dark'), ); -/***************************************************** -SIZES ************************************************/ -// size name, font-size, padding +/// SIZES =============================================== $badge-sizes: ( + // size name, font-size, padding ("tiny", .659rem, 0 4px), ("small", .749rem, 1px 4px), ("large", 1.1rem, 2px 8px) -); - -/***************************************************** -PREFERENCES ******************************************/ -$badge-font-size : .854rem; -$badge-font-weight : 700; -$badge-border-radius : 500px; -$badge-padding : 1px 6px; \ No newline at end of file +); \ No newline at end of file diff --git a/src/Components/Billboard/Billboard.scss b/src/Components/Billboard/Billboard.scss index d1806dab..fbc11860 100644 --- a/src/Components/Billboard/Billboard.scss +++ b/src/Components/Billboard/Billboard.scss @@ -1,30 +1,33 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : BILLBOARD ******************/ -// -// if billboard is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : BILLBOARD +///////////////////////////////////////////////////////// +/// +/// if billboard is enable +/// @if $components-billboard { .#{$billboard-name} { - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - padding: $billboard-default-padding; - @include set-style($main-bg, $main-font-color) { - border-color: darken($main-bg, 4.5%); + @include set-style(theme('background-color'), theme('text-color')) { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + padding: 4.5rem 2.5rem; + border-color: darken(theme('background-color'), 4.5%); + @include border(); }; - border: $main-border-width $main-border-style $main-border-color; - // - // STYLES - // + /// + /// STYLES + /// @if $components-billboard-styles { @each $style-name, $bg-color in $billboard-styles { - @include set-style($bg-color, $main-invert-color, $style-name); + @include set-style($bg-color, theme('color-negative'), $style-name) { + border-color: darken($bg-color, 4.5%); + }; } } - // - // SIZES - // + /// + /// SIZES + /// @if $components-billboard-sizes { @each $size-name, $padding, $font-size in $billboard-sizes { @include set-size($font-size, $padding, $size-name) { @@ -41,16 +44,16 @@ PUNICA CSS > COMPONENTS : BILLBOARD ******************/ flex: 0 0 auto; } .#{$billboard-body} { - padding: $billboard-default-padding; + padding: 4.5rem 2.5rem; flex: 1 1 auto; display: flex; justify-content: center; flex-direction: column; } } - // - // COVER - // + /// + /// COVER + /// @if $components-billboard-cover { &.#{$billboard-cover} { min-height: 100vh; @@ -62,10 +65,12 @@ PUNICA CSS > COMPONENTS : BILLBOARD ******************/ background-repeat: no-repeat; } } - + /// + /// + /// @include breakpoints($breakpoints-medium, 'max-width') { .#{$billboard-name} { - padding: $billboard-responsive-padding; + padding: 2.5rem 1rem; flex-direction: column; .#{$billboard-media} { img { @@ -73,11 +78,11 @@ PUNICA CSS > COMPONENTS : BILLBOARD ******************/ } } .#{$billboard-body} { - padding: $billboard-responsive-padding; + padding: 2.5rem 1rem; } - // - // SIZES - // + /// + /// SIZES + /// @if $components-billboard-sizes { @each $size, $padding, $font-size in $billboard-responsive-sizes { &.#{$size} { diff --git a/src/Components/Billboard/variables.scss b/src/Components/Billboard/variables.scss index 58edceaa..ce47e2ea 100644 --- a/src/Components/Billboard/variables.scss +++ b/src/Components/Billboard/variables.scss @@ -1,36 +1,30 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : BILLBOARD > VARIABLES ********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : BILLBOARD > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ +/// CLASS NAMING ======================================== $billboard-name : 'billboard'; $billboard-media : 'media'; $billboard-body : 'body'; $billboard-cover : 'cover'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $billboard-styles : ( - "primary": $primary-color, - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color, + "primary" : theme('primary-color'), + "success" : theme('success-color'), + "warning" : theme('warning-color'), + "error" : theme('error-color'), + "dark" : theme('color-dark'), ); -/***************************************************** -SIZES ************************************************/ -// size name, padding, font-size +/// SIZES =============================================== $billboard-sizes : ( + // size name, padding, font-size ("small", 2.5rem 1.5rem, 1em), ("large", 7.5rem 4rem, 1.6em) ); $billboard-responsive-sizes : ( + // size name, padding, font-size ("small", 1rem, 1em), ("large", 1rem, 1.358em) -); - -/***************************************************** -PREFERENCES ******************************************/ -$billboard-default-padding : 4.5rem 2.5rem; -$billboard-responsive-padding : 2.5rem 1rem; \ No newline at end of file +); \ No newline at end of file diff --git a/src/Components/Breadcrumb/Breadcrumb.scss b/src/Components/Breadcrumb/Breadcrumb.scss index 9cc86c7a..677b27a2 100644 --- a/src/Components/Breadcrumb/Breadcrumb.scss +++ b/src/Components/Breadcrumb/Breadcrumb.scss @@ -1,8 +1,9 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : BREADCRUMB *****************/ -// -// if breadcrumb is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : BREADCRUMB +///////////////////////////////////////////////////////// +/// +/// if breadcrumb is enable +/// @if $components-breadcrumb { .#{$breadcrumb-name} { display: inline-block; @@ -11,35 +12,36 @@ PUNICA CSS > COMPONENTS : BREADCRUMB *****************/ .#{$breadcrumb-item} { text-decoration: none; font-size: inherit; + font-weight: 600; &:focus, &:hover, &:active, &.active { - color: $breadcrumb-active-color; + color: theme('primary-color'); } &::after { font-family: '#{$icon-font-name}'; - content: $breadcrumb-seperator; - color: $breadcrumb-seperator-color; - padding: $breadcrumb-seperator-padding; - vertical-align: $breadcrumb-seperator-vertical; - font-size: $breadcrumb-seperator-size; + content: $icon-breadcrumb-seperator; // [*] + color: theme('primary-color'); + padding: 0 .25em; + vertical-align: middle; + font-size: 1.4rem; cursor: auto; } &:first-child { margin-left: 0; } &.#{$breadcrumb-active} { - color: $breadcrumb-active-color; + color: theme('primary-color'); font-weight: bold; &::after { content: none; } } } - // - // SIZES - // + /// + /// SIZES + /// @if $components-breadcrumb-sizes { // size, font-size, seperator-padding, seperator-size @each $size, $font-size, $seperator-padding, $seperator-size in $breadcrumb-sizes { @@ -55,6 +57,9 @@ PUNICA CSS > COMPONENTS : BREADCRUMB *****************/ } } } + /// + /// + /// @include breakpoints($breakpoints-medium, 'max-width') { .#{$breadcrumb-name} { .#{$breadcrumb-item} { @@ -66,3 +71,8 @@ PUNICA CSS > COMPONENTS : BREADCRUMB *****************/ } } } +/* +REFERENCES ****************************************** +[*] Defined at Elements -> Icon -> variables.scss +https://material.io/resources/icons/ +*****************************************************/ diff --git a/src/Components/Breadcrumb/variables.scss b/src/Components/Breadcrumb/variables.scss index 902092b9..5ac0aaec 100644 --- a/src/Components/Breadcrumb/variables.scss +++ b/src/Components/Breadcrumb/variables.scss @@ -1,32 +1,16 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : BREADCRUMB > VARIABLES *****/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : BREADCRUMB > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$breadcrumb-name : 'breadcrumb'; -$breadcrumb-item : 'item'; -$breadcrumb-active : 'active'; +/// CLASS NAMING ======================================== +$breadcrumb-name : 'breadcrumb'; +$breadcrumb-item : 'item'; +$breadcrumb-active : 'active'; -/***************************************************** -SIZES ************************************************/ -// size name, font-size, seperator-padding, seperator-size -$breadcrumb-sizes : ( +/// SIZES =============================================== +$breadcrumb-sizes: ( + // size name, font-size, seperator-padding, seperator-size ('small', .9589em, .15em, 1.25rem), ('large', 1.18em, .18em, 1.7rem) ); -/***************************************************** -PREFERENCES ******************************************/ -$breadcrumb-active-color : darken($primary-color, 8%); -/* Seperator */ -$breadcrumb-seperator : $icon-breadcrumb-seperator; // [*] -$breadcrumb-seperator-color : $breadcrumb-active-color; -$breadcrumb-seperator-padding : 0 .25em; // default padding -$breadcrumb-seperator-vertical : middle; -$breadcrumb-seperator-size : 1.4rem; // default size -/* -REFERENCES ****************************************** -[*] Defined at Elements -> Icon -> variables.scss -https://material.io/resources/icons/ -*****************************************************/ - diff --git a/src/Components/Card/Card.scss b/src/Components/Card/Card.scss index ff2fd4d1..c28d0c91 100644 --- a/src/Components/Card/Card.scss +++ b/src/Components/Card/Card.scss @@ -1,34 +1,35 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : CARD ***********************/ -// -// if card is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : CARD +///////////////////////////////////////////////////////// +/// +/// if card is enable +/// @if $components-card { .#{$cards-name} { display: flex; flex-wrap: wrap; } - // - // CARD GROUPS - // + /// + /// CARD GROUPS + /// @if $components-card-groups { @each $name, $number in $grids { .#{$cards-name}.#{$name} { &>.#{$card-name} { - flex: 0 0 calc(100% * (1 / #{$number}) - (2 * #{$card-margin})); + flex: 0 0 calc(100% * (1 / #{$number}) - (2 * 10px)); height: auto; - margin: $card-margin; + margin: 10px; } } } } .#{$card-name} { - background: $card-bg; + background-color: theme('background-color'); // has card border? @if $has-card-border { - border: $main-border-width $main-border-style $main-border-color; - border-radius: $main-border-radius; + @include border(); + border-radius: theme('border-radius'); } // has card shadow? @@ -38,57 +39,58 @@ PUNICA CSS > COMPONENTS : CARD ***********************/ display: flex; flex-direction: column; - width: $card-default-width; // for only a single card + width: 240px; // for only a single card height: 100%; overflow: hidden; >.#{$card-body} .#{$card-title}, .#{$card-title} { - color: darken($main-font-color, 15%); + color: theme('text-color'); line-height: initial; &>.#{$card-subtitle} { - color: grey; + color: theme('color-grey'); flex: 1 1 auto; } } .#{$card-title}, .#{$card-description}, .#{$card-action} { - padding: $card-padding; + padding: 16px; } .#{$card-description} { flex: 1 1 auto; - color: $main-font-color; + color: theme('text-color'); } - // - // MEDIA - // + /// + /// MEDIA + /// @if $components-card-media { &>.#{$card-media} { - flex-wrap: wrap; display: flex; + flex-wrap: wrap; img { display: block; + width: 100%; } } - // - // MEDIA GROUP - // + /// + /// MEDIA GROUP + /// @if $components-card-media-group { @include media-group-specs($card-media, 0); } } - // - // HORIZONTAL CARDS - // + /// + /// HORIZONTAL CARDS + /// @if $components-card-horizontal { &.#{$card-horizontal} { flex-direction: row; width: 100%; align-items: center; margin-bottom: 15px; - // - // MEDIA - // + /// + /// MEDIA + /// @if $components-card-media { >.#{$card-media} { align-self: normal; @@ -103,7 +105,7 @@ PUNICA CSS > COMPONENTS : CARD ***********************/ flex: inherit; .#{$card-title}, .#{$card-description} { - padding: calc(#{$card-padding} / 2) $card-padding; + padding: calc(16px / 2) 16px; } .#{$card-description} { flex: 1; @@ -119,9 +121,9 @@ PUNICA CSS > COMPONENTS : CARD ***********************/ width: 100%; // for only a single card height: fit-content !important; } - // - // HORIZONTAL CARDS - // + /// + /// HORIZONTAL CARDS + /// @if $components-card-horizontal { .#{$card-name}.#{$card-horizontal} { flex-direction: column; diff --git a/src/Components/Card/variables.scss b/src/Components/Card/variables.scss index 5982bae8..5755bd9f 100644 --- a/src/Components/Card/variables.scss +++ b/src/Components/Card/variables.scss @@ -1,13 +1,12 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : CARD > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : CARD > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -STYLE OPTIONS ****************************************/ +/// STYLE OPTIONS ======================================= $has-card-shadow : true; $has-card-border : true; -/***************************************************** -CLASS NAMING *****************************************/ +/// CLASS NAMING ======================================== $card-name : 'card'; $cards-name : 'cards'; $card-body : 'body'; @@ -17,10 +16,3 @@ $card-description : 'description'; $card-media : 'media'; $card-horizontal : 'horizontal'; $card-action : 'actions'; - -/***************************************************** -PREFERENCES ******************************************/ -$card-bg : #fff; -$card-padding : 16px; -$card-margin : 10px; -$card-default-width : 240px; // for only a single card diff --git a/src/Components/List/List.scss b/src/Components/List/List.scss index 52e6744b..46ffee72 100644 --- a/src/Components/List/List.scss +++ b/src/Components/List/List.scss @@ -1,85 +1,86 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : LIST ***********************/ -// -// if list is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : LIST +///////////////////////////////////////////////////////// +/// +/// if list is enable +/// @if $components-list { .#{$list-name} { list-style: none; - margin: $list-margin-spacer 0; + margin: 1rem 0; >.#{$list-item} { display: flex; align-items: center; - padding: $list-item-padding; + padding: .55em; margin: 0; transition: .15s; >img, >.#{$icon-font-class-name}, >i { - margin-right: $list-margin-spacer; + margin-right: 1rem; } >.#{$list-body} { flex: 1; - line-height: $list-body-line-height; + line-height: 1.4; text-align: left; >.#{$list-title}, >.#{$list-subtitle} { display: block; } >.#{$list-title} { - font-size: $list-title-size; + font-size: 1.28rem; font-weight: $main-title-weight; line-height: 1; } >.#{$list-subtitle} { - font-size: $list-subtitle-size; + font-size: .889em; font-weight: 400; - color: $main-grey-color; + color: theme('primary-color'); margin-bottom: 7px; } } >.#{$list-actions} { margin-left: auto; width: auto; - margin-left: $list-margin-spacer; + margin-left: 1rem; } &.#{$list-active} { - background: $menu-item-hover-bg; + background: darken(theme('background-color'), 11%); } } - // - // DIVIDED - // + /// + /// DIVIDED + /// @if $components-list-divided { &.#{$list-bordered} { >.#{$list-item} { - border-bottom: $main-border-width $main-border-style $main-border-color; + border-bottom: theme('border-width') theme('border-style') theme('border-color'); &:last-child { border-bottom: none; } } } } - // - // STRIPED - // + /// + /// STRIPED + /// @if $components-list-striped { &.#{$list-striped} { >.#{$list-item} { &:nth-of-type(odd) { - background: $main-striped-bg; + background: theme('color-secondary'); } } } } - // - // HOVERED - // + /// + /// HOVERED + /// @if $components-list-hovered { &.#{$list-hovered} { >.#{$list-item} { &:hover { - background: $main-hovered-bg; + background: theme('color-secondary'); transition: .15s; } } diff --git a/src/Components/List/variables.scss b/src/Components/List/variables.scss index a6d4618f..acdd81fd 100644 --- a/src/Components/List/variables.scss +++ b/src/Components/List/variables.scss @@ -1,23 +1,15 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : LIST > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : LIST > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$list-name : 'list'; -$list-item : 'item'; -$list-body : 'body'; -$list-title : 'title'; -$list-active : 'active'; -$list-subtitle : 'subtitle'; -$list-actions : 'actions'; -$list-bordered : 'divided'; -$list-hovered : 'hovered'; -$list-striped : 'striped'; - -/***************************************************** -PREFERENCES ******************************************/ -$list-margin-spacer : 1rem; -$list-body-line-height : 1.4; -$list-title-size : 1.28rem; -$list-subtitle-size : .889em; -$list-item-padding : .55em; +/// CLASS NAMING ======================================== +$list-name : 'list'; +$list-item : 'item'; +$list-body : 'body'; +$list-title : 'title'; +$list-active : 'active'; +$list-subtitle : 'subtitle'; +$list-actions : 'actions'; +$list-bordered : 'divided'; +$list-hovered : 'hovered'; +$list-striped : 'striped'; diff --git a/src/Components/Menu/Menu.scss b/src/Components/Menu/Menu.scss index be59fc74..7602bc0e 100644 --- a/src/Components/Menu/Menu.scss +++ b/src/Components/Menu/Menu.scss @@ -1,67 +1,68 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : MENU ***********************/ -// -// if menu is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : MENU +///////////////////////////////////////////////////////// +/// +/// if menu is enable +/// @if $components-menu { .#{$menu-name} { - background: $menu-bg; - border-radius: $menu-border-radius; + background-color: theme('background-color'); + border-radius: 0; list-style: none; margin: 0; width: 100%; - min-width: $menu-min-width; - padding: $menu-padding; + min-width: max-content; + padding: .9rem; @include shadow(0, 7px, 10px, rgba(0, 0, 0, 0.15)); - z-index: $menu-z-index; + z-index: 300; + // menu title .#{$menu-title} { - font-size: $menu-title-font-size; - min-height: $menu-title-min-height; - color: $menu-title-color; - padding: $menu-title-padding; - font-weight: $menu-title-font-weight; - letter-spacing: $menu-title-spacing; + font-size: 1.25em; + min-height: 2rem; + color: theme('text-color'); + padding: .6rem 0; + font-weight: 700; + letter-spacing: -.015rem; } + // menu item .#{$menu-item} { padding: 0; position: relative; text-decoration: none; text-align: left; & > a { - color: $menu-item-color; + color: theme('text-color'); display: block; width: 100%; - padding: $menu-item-padding; + padding: .28rem .9rem; text-decoration: none; - font-size: $menu-font-size; + font-size: 1em; + font-weight: 600; transition: background .15s, color .15s; &:hover { - background: $menu-item-hover-bg; - color: darken($menu-item-color, 22%); + background: darken(theme('background-color'), 11%); + color: theme('text-color'); transition: background .15s, color .15s; } &:active, &:focus, &.#{$menu-item-active} { - background: $menu-item-hover-bg; - color: $menu-item-color; - font-weight: 700; + background: darken(theme('background-color'), 11%); + color: theme('text-color'); transition: background .15s, color .15s; } - &:focus { - font-weight: inherit; - } } i, span.#{$icon-font-class-name} { - color: $menu-item-icon-color; - font-size: $menu-item-icon-size; - margin-right: $menu-item-icon-mr; - vertical-align: $menu-item-icon-va; + color: theme('color-grey'); + font-size: 1.2rem; + margin-right: 10px; + vertical-align: text-bottom; } .#{$menu-name} { - padding: $menu-padding-nested; + padding: .4rem; } } + // menu badge .#{$menu-badge} { position: absolute; right: 0; @@ -69,12 +70,14 @@ PUNICA CSS > COMPONENTS : MENU ***********************/ padding: 0 4px; font-size: .93em; } + // small menu &.#{$menu-small} > .#{$menu-item} a { - font-size: $menu-small-font-size; + font-size: .879em; } + // divided menu &.#{$menu-divided} { .#{$menu-item} { - border-bottom: $main-border-width $main-border-style $menu-divided-color; + border-bottom: theme('border-width') theme('border-style') theme('color-active'); &:last-child { border-bottom: none; } diff --git a/src/Components/Menu/variables.scss b/src/Components/Menu/variables.scss index ac4da260..e2f8df7f 100644 --- a/src/Components/Menu/variables.scss +++ b/src/Components/Menu/variables.scss @@ -1,8 +1,8 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : MENU > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : MENU > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ +/// CLASS NAMING ======================================== $menu-name : 'menu'; $menu-small : 'small'; $menu-title : 'title'; @@ -11,31 +11,3 @@ $menu-item-active : 'active'; $menu-badge : 'badge'; $menu-secondary : 'secondary'; $menu-divided : 'divided'; - -/***************************************************** -PREFERENCES ******************************************/ -$menu-bg : #fff; -$menu-font-size : 1em; -$menu-small-font-size : .879em; -$menu-border-radius : 0; -$menu-min-width : max-content; -$menu-padding : .9rem; -$menu-padding-nested : .4rem; -$menu-z-index : 300; -$menu-divided-color : $main-secondary-bg; -/* Title */ -$menu-title-font-size : 1.25em; -$menu-title-min-height : 2rem; -$menu-title-color : #999; -$menu-title-font-weight : 300; -$menu-title-padding : .6rem 0; -$menu-title-spacing : -.015rem; -/* Menu Item */ -$menu-item-padding : .28rem $menu-padding; -$menu-item-color : #606265; -$menu-item-hover-bg : darken($menu-bg, 6%); -/* Menu Item Icon */ -$menu-item-icon-color : $main-grey-color; -$menu-item-icon-size : 1.2rem; -$menu-item-icon-mr : 10px; // margin-right -$menu-item-icon-va : text-bottom; // vertical-align diff --git a/src/Components/Navbar/Navbar.scss b/src/Components/Navbar/Navbar.scss index 795c1a04..23120ebc 100644 --- a/src/Components/Navbar/Navbar.scss +++ b/src/Components/Navbar/Navbar.scss @@ -1,9 +1,10 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : NAVBAR *********************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : NAVBAR +///////////////////////////////////////////////////////// @import "mixins"; -// -// if navbar is enable -// +/// +/// if navbar is enable +/// @if $components-navbar { .#{$navbar-name} { display: flex; @@ -11,13 +12,13 @@ PUNICA CSS > COMPONENTS : NAVBAR *********************/ align-items: stretch; justify-content: space-between; min-height: $navbar-min-height; - background: $navbar-bg; - color: $navbar-color; + background: darken(theme('primary-color'), 7%); + color: theme('color-negative'); width: 100%; // grid container .#{$container} { display: flex; - width: $navbar-container-width; + width: $container-width; // layout->grid } // navbar brand .#{$navbar-brand} { @@ -35,7 +36,7 @@ PUNICA CSS > COMPONENTS : NAVBAR *********************/ a:visited { font-size: $navbar-font-size; text-decoration: none; - color: $navbar-color; + color: theme('color-negative'); display: flex; font-weight: bold; } @@ -74,7 +75,15 @@ PUNICA CSS > COMPONENTS : NAVBAR *********************/ justify-content: flex-end; } input[type='text'] { - background-color: $navbar-color; + background-color: darken(theme('primary-color'), 7%); + color: theme('color-negative'); + border-color: lighten(theme('primary-color'), 8%); + &::placeholder { + color: theme('color-negative'); + } + &:focus { + outline: theme('input-outline-width') solid lighten(theme('primary-color'), 26%); + } } } } @@ -95,10 +104,10 @@ PUNICA CSS > COMPONENTS : NAVBAR *********************/ background: transparent; border-color: transparent; border: none; - color: $navbar-color; + color: theme('color-negative'); min-height: 100%; i, span.#{$icon-font-class-name} { - color: $navbar-color; + color: theme('color-negative'); } } } @@ -108,9 +117,9 @@ PUNICA CSS > COMPONENTS : NAVBAR *********************/ padding: .935rem 1.4rem; font-weight: 700; } - // - // THEMES - // + /// + /// NAVBAR THEMES + /// @if $components-navbar-themes { @each $theme-name, $bg-color, $text-color, $input-bg, $input-color, $input-border-color in $navbar-themes { &.#{$theme-name} { @@ -143,7 +152,7 @@ PUNICA CSS > COMPONENTS : NAVBAR *********************/ left: 0; overflow-x: auto; overflow-y: hidden; - background: $main-secondary-bg; + background: theme('color-secondary'); z-index: 1; margin: 0 !important; padding: 0 !important; @@ -162,7 +171,7 @@ PUNICA CSS > COMPONENTS : NAVBAR *********************/ } .#{$navbar-section} .#{$button-class-group} .#{$dropdown-name} .#{$button-class}, .#{$navbar-section} .#{$button-class-group} .#{$button-class} { - color: $main-font-color; + color: theme('text-color'); i, span.#{$icon-font-class-name} { display: none; } diff --git a/src/Components/Navbar/mixins.scss b/src/Components/Navbar/mixins.scss index 6e56bc4a..edd85797 100644 --- a/src/Components/Navbar/mixins.scss +++ b/src/Components/Navbar/mixins.scss @@ -1,6 +1,15 @@ -/***************************************************** -PUNICA CSS > COMPONENT : NAVBAR > MIXINS *************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENT : NAVBAR > MIXINS +///////////////////////////////////////////////////////// +/// +/// Navbar Themes +/// @param {Color} $bg-color +/// @param {Color} $text-color +/// @param {Color} $input-bg +/// @param {Color} $input-color +/// @param {Color} $input-border-color +/// @mixin navbar-themes( $bg-color: $navbar-bg, $text-color: $navbar-color, @@ -32,6 +41,12 @@ PUNICA CSS > COMPONENT : NAVBAR > MIXINS *************/ background-color: $input-bg; border-color: $input-border-color; color: $input-color; + &::placeholder { + color: $text-color; + } + &:focus { + outline: theme('input-outline-width') solid lighten($input-border-color, 13%); + } } } } diff --git a/src/Components/Navbar/variables.scss b/src/Components/Navbar/variables.scss index 0de28ac7..1c2d3897 100644 --- a/src/Components/Navbar/variables.scss +++ b/src/Components/Navbar/variables.scss @@ -1,8 +1,8 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : MENU > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : MENU > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ +/// CLASS NAMING ======================================== $navbar-name : 'navbar'; $navbar-section : 'section'; $navbar-fixed : 'fixed'; @@ -11,22 +11,16 @@ $navbar-links : 'links'; $navbar-burger : 'burger'; $navbar-spacer : 'navbar-spacer'; -/***************************************************** -STYLES ***********************************************/ -/* Default Theme */ -$navbar-bg : $primary-color; -$navbar-color : $main-invert-color; +/// STYLES ============================================== // you can add your own custom styles. -// theme name, bg color, text color, input bg, input color, input border color $navbar-themes: ( - ("light", $main-bg, $main-font-color, $main-bg, $main-font-color), - ("dark", darken($main-dark-color, 5%), $main-invert-color, lighten($main-dark-color, 7%), $main-invert-color, lighten($main-dark-color, 7%)) + // theme name, bg color, text color, input bg, input color, input border color + ("light", white, black, white, black, theme('color-dark')), + ("dark", darken(theme('color-dark'), 5%), theme('color-negative'), lighten(theme('color-dark'), 7%), theme('color-negative'), lighten(theme('color-dark'), 17%)) ); -/***************************************************** -PREFERENCES ******************************************/ +/// PREFERENCES ========================================= $navbar-min-height : 80px; $navbar-brand-padding : 0; $navbar-font-size : 1.1em; -$navbar-container-width : $container-width; $navbar-spacer-top : $navbar-min-height + 20px; diff --git a/src/Components/Panel/Panel.scss b/src/Components/Panel/Panel.scss index d7792d3f..8f95b217 100644 --- a/src/Components/Panel/Panel.scss +++ b/src/Components/Panel/Panel.scss @@ -1,8 +1,9 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : PANEL **********************/ -// -// if panel is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : PANEL +///////////////////////////////////////////////////////// +/// +/// if panel is enable +/// @if $components-panel { .#{$panel-name} { display: flex; @@ -10,8 +11,8 @@ PUNICA CSS > COMPONENTS : PANEL **********************/ // has panel border? @if $has-panel-border { - border: $panel-border-width $panel-border-style $panel-border-color; - border-radius: $panel-border-radius; + @include border(); + border-radius: theme('border-radius'); } // has panel shadow? @@ -19,7 +20,7 @@ PUNICA CSS > COMPONENTS : PANEL **********************/ @include shadow(); } - background: $main-bg; + background-color: theme('background-color'); margin: $panel-margin; &>.#{$panel-header}, &>.#{$panel-bottom} { @@ -34,7 +35,7 @@ PUNICA CSS > COMPONENTS : PANEL **********************/ } } &>.#{$panel-header} { - border-bottom: $panel-title-bottom-border; + border-bottom: theme('border-width') theme('border-style') theme('border-color'); padding: $panel-title-padding; &.dashed { border-bottom-style: dashed; @@ -43,17 +44,17 @@ PUNICA CSS > COMPONENTS : PANEL **********************/ border-bottom-style: dotted; } .#{$panel-title} { - font-size: $panel-title-font-size; - font-weight: $panel-title-font-weight; + font-size: 1.185rem; + font-weight: 900; } } &>.#{$panel-content} { flex: 1 1 auto; padding: $panel-padding; height: auto; - // - // MEDIA - // + /// + /// MEDIA + /// @if $components-panel-media { &>.#{$panel-media} { min-width: 0; @@ -68,26 +69,26 @@ PUNICA CSS > COMPONENTS : PANEL **********************/ display: block; } } - // - // MEDIA GROUP - // + /// + /// MEDIA GROUP + /// @if $components-panel-media-group { @include media-group-specs($panel-media); } } .#{$panel-headline}, p.#{$panel-headline} { - font-size: $panel-headline-font-size; - line-height: $panel-headline-line-height; - margin-bottom: $panel-headline-margin-bottom; - color: $panel-headline-color; - letter-spacing: $panel-headline-letter-spacing; + font-size: 1.39em; + line-height: 1.5; + margin-bottom: 26px; + color: darken(theme('text-color'), 16%); + letter-spacing: -.0158em; } } &>.#{$panel-bottom} { - min-height: $panel-bottom-min-height; - border-top: $panel-bottom-border; - padding: $panel-bottom-padding; + min-height: 50px; + border-top: theme('border-width') theme('border-style') theme('border-color'); + padding: 6px; } } } diff --git a/src/Components/Panel/variables.scss b/src/Components/Panel/variables.scss index de2ba200..6478fc1b 100644 --- a/src/Components/Panel/variables.scss +++ b/src/Components/Panel/variables.scss @@ -1,43 +1,22 @@ -/***************************************************** -PUNICA CSS > COMPONENT : PANEL > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENT : PANEL > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -STYLE OPTIONS ****************************************/ -$has-panel-shadow : true; -$has-panel-border : true; +/// STYLE OPTIONS ======================================= +$has-panel-shadow : true; +$has-panel-border : true; -/***************************************************** -CLASS NAMING *****************************************/ -$panel-name : 'panel'; -$panel-header : 'header'; -$panel-title : 'title'; -$panel-headline : 'headline'; -$panel-bottom : 'bottom'; -$panel-content : 'content'; -$panel-media : 'media'; -$panel-title-actions : 'actions'; +/// CLASS NAMING ======================================== +$panel-name : 'panel'; +$panel-header : 'header'; +$panel-title : 'title'; +$panel-headline : 'headline'; +$panel-bottom : 'bottom'; +$panel-content : 'content'; +$panel-media : 'media'; +$panel-title-actions : 'actions'; -/***************************************************** -PREFERENCES ******************************************/ -$panel-padding : 16px; -$panel-border-width : 1px; -$panel-margin : $panel-padding 0; -/* Border */ -$panel-border-radius : $main-border-radius; -$panel-border-color : $main-border-color; -$panel-border-style : $main-border-style; -/* Header & Title */ -$panel-title-font-size : 1.185rem; -$panel-title-font-weight : 900; -$panel-title-bottom-border : $panel-border-width $panel-border-style $panel-border-color; -$panel-title-padding : 12px $panel-padding; -/* Headline */ -$panel-headline-font-size : 1.39em; -$panel-headline-line-height : 1.5; -$panel-headline-margin-bottom : 26px; -$panel-headline-color : darken($main-font-color, 16%); -$panel-headline-letter-spacing : -.0158em; -/* Bottom */ -$panel-bottom-min-height : 50px; -$panel-bottom-border : $panel-border-width $panel-border-style $panel-border-color; -$panel-bottom-padding : 6px; +/// PREFERENCES ========================================= +$panel-padding : 16px; +$panel-margin : $panel-padding 0; +$panel-title-padding : 12px $panel-padding; diff --git a/src/Components/Process/Process.scss b/src/Components/Process/Process.scss index 3c6e3e8b..4b53e57c 100644 --- a/src/Components/Process/Process.scss +++ b/src/Components/Process/Process.scss @@ -1,9 +1,10 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : PROCESS ********************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : PROCESS +///////////////////////////////////////////////////////// @import "mixins"; -// -// if process is enable -// +/// +/// if process is enable +/// @if $components-process { .#{$process-name} { display: flex; @@ -22,7 +23,7 @@ PUNICA CSS > COMPONENTS : PROCESS ********************/ line-height: 1.3; text-align: center; &:not(:first-child)::before { - background: $primary-color; + background: theme('primary-color'); content: ""; height: $process-stick-height; left: -50%; @@ -31,7 +32,7 @@ PUNICA CSS > COMPONENTS : PROCESS ********************/ width: 100%; } a { - color: $main-font-color; + color: theme('text-color'); display: inline-block; padding: 10px 10px 0; text-decoration: none; @@ -39,7 +40,7 @@ PUNICA CSS > COMPONENTS : PROCESS ********************/ &::before { position: absolute; content: ""; - background: $primary-color; + background: theme('primary-color'); top: 0; left: 50%; height: $process-stage-stick-height; @@ -52,7 +53,7 @@ PUNICA CSS > COMPONENTS : PROCESS ********************/ } &.#{$process-active} { a { - color: $primary-color; + color: theme('primary-color'); font-weight: 700; &::after { content: "#{$icon-process-current}"; // [*] @@ -60,29 +61,29 @@ PUNICA CSS > COMPONENTS : PROCESS ********************/ position: absolute; top: calc(-15px - #{$process-current-icon-size}); left: calc(50% - ((#{$process-stage-stick-width} * 10) / 2)); - color: $primary-color; + color: theme('primary-color'); font-size: $process-current-icon-size; } } &~.#{$process-item} { &::before { - background: $main-border-color; + background: theme('border-color'); } a { - color: $main-grey-color; + color: theme('text-color'); &:hover { - color: darken($main-grey-color, 45%); + color: theme('primary-color'); } &::before { - background: $main-border-color; + background: theme('border-color'); } } } } } - // - // STYLES - // + /// + /// STYLES + /// @if $components-process-styles { @each $type, $bg-color in $process-styles { &.#{$type} { @@ -90,9 +91,9 @@ PUNICA CSS > COMPONENTS : PROCESS ********************/ } } } - // - // VERTICAL PROCESS - // + /// + /// VERTICAL PROCESS + /// @if $components-process-vertical { &.#{$process-vertical} { @include process-vertical(); diff --git a/src/Components/Process/mixins.scss b/src/Components/Process/mixins.scss index b6e2fbd2..c9106773 100644 --- a/src/Components/Process/mixins.scss +++ b/src/Components/Process/mixins.scss @@ -1,5 +1,11 @@ -/******************************************************** -PUNICA CSS > COMPONENTS : PROCESS > MIXINS **************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : PROCESS > MIXINS +///////////////////////////////////////////////////////// + +/// +/// Process Styles +/// @param {Color} $color +/// @mixin process-styles($color: $primary-color) { .#{$process-item} { &:not(:first-child)::before { @@ -20,15 +26,19 @@ PUNICA CSS > COMPONENTS : PROCESS > MIXINS **************/ } &~.#{$process-item} { &::before { - background: $main-border-color; + background: theme('border-color'); } } } } } + +/// +/// Vertical Process +/// @mixin process-vertical() { display: flex; - padding: $timeline-padding; + padding: 1.25em 2em 2.85em; margin: $process-vertical-margin; flex-direction: column; align-items: flex-start; @@ -37,11 +47,11 @@ PUNICA CSS > COMPONENTS : PROCESS > MIXINS **************/ align-items: center; max-width: 100%; min-width: 100%; - border-bottom: $main-border-width $main-border-style $main-border-color; - border-right: $main-border-width $main-border-style $main-border-color; + border-bottom: theme('border-width') theme('border-style') theme('border-color'); + border-right: theme('border-width') theme('border-style') theme('border-color'); padding-left: 20px; &:first-child { - border-top: $main-border-width $main-border-style $main-border-color; + border-top: theme('border-width') theme('border-style') theme('border-color'); } &:not(:first-child)::before { width: $process-stage-stick-width; @@ -71,7 +81,7 @@ PUNICA CSS > COMPONENTS : PROCESS > MIXINS **************/ flex-direction: column-reverse; .#{$process-item} { &:last-child { - border-top: $main-border-width $main-border-style $main-border-color; + border-top: theme('border-width') theme('border-style') theme('border-color'); } &:first-child { border-top: none; diff --git a/src/Components/Process/variables.scss b/src/Components/Process/variables.scss index 9aad9ddd..87b0f67c 100644 --- a/src/Components/Process/variables.scss +++ b/src/Components/Process/variables.scss @@ -1,26 +1,24 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : PROCESS > VARIABLES ********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : PROCESS > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$process-name : 'process'; -$process-item : 'item'; -$process-active : 'active'; +/// CLASS NAMING ======================================== +$process-name : 'process'; +$process-item : 'item'; +$process-active : 'active'; /* Vertical */ -$process-vertical : 'vertical'; -$process-vertical-reversed : 'reversed'; +$process-vertical : 'vertical'; +$process-vertical-reversed : 'reversed'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $process-styles : ( - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color, + "success" : theme('success-color'), + "warning" : theme('warning-color'), + "error" : theme('error-color'), + "dark" : theme('color-dark'), ); -/***************************************************** -PREFERENCES ******************************************/ +/// PREFERENCES ========================================= $process-margin : 1em 0 5em; $process-item-min-height : 4rem; $process-stick-height : 6px; diff --git a/src/Components/Progress/Progress.scss b/src/Components/Progress/Progress.scss index 778d5bfe..9b215fcd 100644 --- a/src/Components/Progress/Progress.scss +++ b/src/Components/Progress/Progress.scss @@ -1,31 +1,32 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : PROGRESS *******************/ -// -// if progress is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : PROGRESS +///////////////////////////////////////////////////////// +/// +/// if progress is enable +/// @if $components-progress { .#{$progress-name} { - width: $progress-width; - height: $progress-height; - background: $progress-background; - box-shadow: $progress-inner-shadow; - border-radius: $progress-border-radius; + width: 100%; + height: 12px; + background: theme('color-secondary'); + @include shadow(0, 1px, 2px, rgba(0, 0, 0, 0.15), inset); + border-radius: 16px; appearance: none; &::-webkit-progress-bar { background: transparent; - border-radius: $progress-border-radius; + border-radius: 16px; } &::-webkit-progress-value { - background: $primary-color; - border-radius: $progress-border-radius; + background: theme('primary-color'); + border-radius: 16px; } &::-moz-progress-bar { - background: $primary-color; - border-radius: $progress-border-radius; + background: theme('primary-color'); + border-radius: 16px; } - // - // STYLES - // + /// + /// STYLES + /// @if $components-progress-styles { @each $type, $color in $progress-styles { &.#{$type}::-webkit-progress-value { diff --git a/src/Components/Progress/variables.scss b/src/Components/Progress/variables.scss index 926487eb..65f546e4 100644 --- a/src/Components/Progress/variables.scss +++ b/src/Components/Progress/variables.scss @@ -1,23 +1,14 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : PROGRESS > VARIABLES *******/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : PROGRESS > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$progress-name : 'progress'; +/// CLASS NAMING ======================================== +$progress-name: 'progress'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $progress-styles : ( - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color + "success" : theme('success-color'), + "warning" : theme('warning-color'), + "error" : theme('error-color'), + "dark" : theme('color-dark'), ); - -/***************************************************** -PREFERENCES ******************************************/ -$progress-height : 12px; -$progress-width : 100%; -$progress-background : $main-secondary-bg; -$progress-border-radius : 16px; -$progress-inner-shadow : 0 1px 2px rgba(0, 0, 0, 0.15) inset; diff --git a/src/Components/Tabnav/Tabnav.scss b/src/Components/Tabnav/Tabnav.scss index 0f48dee4..b78cc542 100644 --- a/src/Components/Tabnav/Tabnav.scss +++ b/src/Components/Tabnav/Tabnav.scss @@ -1,15 +1,16 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : TABNAV *********************/ -// -// if tabnav is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : TABNAV +///////////////////////////////////////////////////////// +/// +/// if tabnav is enable +/// @if $components-tabnav { .#{$tabnav-name} { position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; - border-bottom: $tabnav-border-bottom-width $main-border-style $main-secondary-bg; + border-bottom: $tabnav-border-bottom-width theme('border-style') theme('color-secondary'); padding: 0; &>.#{$button-class-group} { box-shadow: none; @@ -29,40 +30,40 @@ PUNICA CSS > COMPONENTS : TABNAV *********************/ border-radius: 0 !important; margin-bottom: -$tabnav-border-bottom-width; line-height: initial; - font-size: $tabnav-item-button-size; - font-weight: initial; + font-size: 1.025em; transition: border-bottom-color, color .2s; - color: darken($main-grey-color, 5%); + color: theme('text-color'); padding: .935rem 1.4rem; + box-shadow: none; &:hover { - color: darken($main-font-color, 8%); - border-bottom-color: darken($main-secondary-bg, 16%); + color: theme('text-color'); + border-bottom-color: theme('color-grey'); transition: border-bottom-color, color .2s; } &.#{$button-class-disabled} { opacity: .45; } &.#{$tabnav-active} { - color: $primary-color; - border-bottom-color: $primary-color; + color: theme('primary-color'); + border-bottom-color: theme('primary-color'); font-weight: 700; i, [class^="#{$icon-font-class-name}"] { - color: initial; + color: inherit; } } } - // - // STYLES - // + /// + /// STYLES + /// @if $components-tabnav-styles { - @each $type-name, $bg-color in $tabnav-styles { + @each $type-name, $bg-color, $color in $tabnav-styles { &.#{$type-name} { .#{$button-class}, a.#{$button-class}, .#{$dropdown-name} .#{$button-class}, .#{$dropdown-name} a.#{$button-class} { &.#{$tabnav-active} { - color: $bg-color; + color: $color; border-bottom-color: $bg-color; } } diff --git a/src/Components/Tabnav/variables.scss b/src/Components/Tabnav/variables.scss index 74cebfbd..d9b5916f 100644 --- a/src/Components/Tabnav/variables.scss +++ b/src/Components/Tabnav/variables.scss @@ -1,21 +1,19 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : MENU > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : MENU > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ +/// CLASS NAMING ======================================== $tabnav-name: 'tab'; $tabnav-active: 'active'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $tabnav-styles: ( - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color, + // name, bg color, text color + ('success', theme('success-color'), theme('success-color')), + ('warning', theme('warning-color'), theme('warning-color')), + ('error', theme('error-color'), theme('error-color')), + ('dark', theme('color-dark'), theme('text-color')) ); -/***************************************************** -PREFERENCES ******************************************/ -$tabnav-border-bottom-width: 2px; -$tabnav-item-button-size: 1.025em; \ No newline at end of file +/// PREFERENCES ========================================= +$tabnav-border-bottom-width: 2px; \ No newline at end of file diff --git a/src/Components/Timeline/Timeline.scss b/src/Components/Timeline/Timeline.scss index 489a7975..c999b420 100644 --- a/src/Components/Timeline/Timeline.scss +++ b/src/Components/Timeline/Timeline.scss @@ -1,13 +1,14 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : TIMELINE *******************/ -// -// if timeline is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : TIMELINE +///////////////////////////////////////////////////////// +/// +/// if timeline is enable +/// @if $components-timeline { .#{$timeline-container} { .#{$timeline-item} { display: flex; - padding: $timeline-padding; + padding: 1.25em 2em 2.85em; position: relative; flex-direction: column; justify-content: center; @@ -19,11 +20,11 @@ PUNICA CSS > COMPONENTS : TIMELINE *******************/ bottom: 0; left: 0; width: $timeline-border-width; - background-color: $main-border-color; + background-color: theme('border-color'); } &:target .#{$timeline-type} { - border-color: $primary-color; - box-shadow: 0 0 0.2em $primary-color; + border-color: theme('primary-color'); + box-shadow: 0 0 0.2em theme('primary-color'); } .#{$timeline-type} { position: absolute; @@ -34,20 +35,20 @@ PUNICA CSS > COMPONENTS : TIMELINE *******************/ top: 13px; left: -(($timeline-type-width / 2px) - $timeline-border-width); align-items: center; - background-color: $main-secondary-bg; - border: 2px $main-border-style $main-border-color; + background-color: theme('color-secondary'); + border: 2px theme('border-style') theme('border-color'); border-radius: 50%; justify-content: center; flex-shrink: 0; @include shadow(); - // - // STYLES - // + /// + /// STYLES + /// @if $components-timeline-styles { @each $type, $color in $timeline-styles { &.#{$type} { background-color: $color; - color: $main-invert-color; + color: theme('color-negative'); border-color: darken($color, 5%); } } @@ -60,7 +61,7 @@ PUNICA CSS > COMPONENTS : TIMELINE *******************/ .#{$timeline-media} { min-width: 0; max-width: 100%; - color: $main-font-color; + color: theme('text-color'); flex: auto; margin-left: 10px; width: 100%; @@ -68,15 +69,15 @@ PUNICA CSS > COMPONENTS : TIMELINE *******************/ .#{$timeline-author} { font-weight: bold; font-size: 1rem; - color: darken($main-font-color, 12%); + color: darken(theme('text-color'), 12%); } .#{$timeline-date} { font-size: .9em; opacity: .6; } - // - // MEDIA - // + /// + /// MEDIA + /// @if $components-timeline-media { .#{$timeline-media} { margin-top: 16px; @@ -87,9 +88,9 @@ PUNICA CSS > COMPONENTS : TIMELINE *******************/ display: block; } } - // - // MEDIA GROUP - // + /// + /// MEDIA GROUP + /// @if $components-timeline-media-group { @include media-group-specs($timeline-media); } @@ -98,10 +99,10 @@ PUNICA CSS > COMPONENTS : TIMELINE *******************/ margin-top: 16px; } &:last-child::before { - background: linear-gradient(180deg, $main-border-color 45%, rgba(255,255,255,0) 100%); + background: linear-gradient(180deg, theme('border-color') 45%, rgba(255,255,255,0) 100%); } &:first-child::before { - background: linear-gradient(0deg, $main-border-color 45%, rgba(255,255,255,0) 100%); + background: linear-gradient(0deg, theme('border-color') 45%, rgba(255,255,255,0) 100%); } } } diff --git a/src/Components/Timeline/variables.scss b/src/Components/Timeline/variables.scss index 08215c18..5cc306fb 100644 --- a/src/Components/Timeline/variables.scss +++ b/src/Components/Timeline/variables.scss @@ -1,30 +1,26 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : TIMELINE > VARIABLES *******/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : TIMELINE > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$timeline-container : 'timeline'; -$timeline-item : 'activity'; -$timeline-author : 'author'; -$timeline-body : 'body'; -$timeline-type : 'type'; -$timeline-date : 'date'; -$timeline-media : 'media'; -$timeline-actions : 'actions'; +/// CLASS NAMING ======================================== +$timeline-container : 'timeline'; +$timeline-item : 'activity'; +$timeline-author : 'author'; +$timeline-body : 'body'; +$timeline-type : 'type'; +$timeline-date : 'date'; +$timeline-media : 'media'; +$timeline-actions : 'actions'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $timeline-styles: ( - "primary": $primary-color, - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color, + "primary" : theme('primary-color'), + "success" : theme('success-color'), + "warning" : theme('warning-color'), + "error" : theme('error-color'), + "dark" : theme('color-dark'), ); -/***************************************************** -PREFERENCES ******************************************/ +/// PREFERENCES ========================================= $timeline-type-width : 32px; -$timeline-border-width : 1px; -$timeline-padding : 1.25em 2em 2.85em; -$timeline-type-bg : $main-secondary-bg; \ No newline at end of file +$timeline-border-width : 1px; \ No newline at end of file diff --git a/src/Components/Tooltip/Tooltip.scss b/src/Components/Tooltip/Tooltip.scss index 91a13519..13b417ac 100644 --- a/src/Components/Tooltip/Tooltip.scss +++ b/src/Components/Tooltip/Tooltip.scss @@ -1,8 +1,9 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : TOOLTIP ********************/ -// -// if tooltip is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : TOOLTIP +///////////////////////////////////////////////////////// +/// +/// if tooltip is enable +/// @if $components-tooltip { .#{$tooltip-name} { display: inline-flex; @@ -11,15 +12,16 @@ PUNICA CSS > COMPONENTS : TOOLTIP ********************/ cursor: default; .#{$tooltip-text} { position: absolute; - color: $tooltip-color; - font-size: $tooltip-font-size; + color: theme('color-negative'); + font-size: .9em; + font-weight: 600; text-align: center; visibility: hidden; - background-color: $tooltip-background; - border-radius: $main-border-radius; - min-width: $tooltip-min-width; - max-width: $tooltip-max-width; - padding: $tooltip-padding; + background-color: theme('color-dark'); + border-radius: theme('border-radius'); + min-width: 100px; + max-width: 180px; + padding: 5px; top: 120%; opacity: 0; transition: opacity 0.18s; @@ -33,7 +35,7 @@ PUNICA CSS > COMPONENTS : TOOLTIP ********************/ margin-left: -5px; border-width: 5px; border-style: solid; - border-color: transparent transparent $tooltip-background transparent; + border-color: transparent transparent theme('color-dark') transparent; } } &:hover .#{$tooltip-text} { diff --git a/src/Components/Tooltip/variables.scss b/src/Components/Tooltip/variables.scss index 0e27fde1..9ba03ea4 100644 --- a/src/Components/Tooltip/variables.scss +++ b/src/Components/Tooltip/variables.scss @@ -1,16 +1,7 @@ -/***************************************************** -PUNICA CSS > COMPONENTS : TOOLTIP > VARIABLES ********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : TOOLTIP > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$tooltip-name : 'tooltip'; -$tooltip-text : 'text'; - -/***************************************************** -PREFERENCES ******************************************/ -$tooltip-background : $main-dark-color; -$tooltip-font-size : .9em; -$tooltip-min-width : 100px; -$tooltip-max-width : 180px; -$tooltip-padding : 5px; -$tooltip-color : $main-invert-color; \ No newline at end of file +/// CLASS NAMING ======================================== +$tooltip-name: 'tooltip'; +$tooltip-text: 'text'; \ No newline at end of file diff --git a/src/Components/index.scss b/src/Components/index.scss index 0031beff..d1ead3e8 100644 --- a/src/Components/index.scss +++ b/src/Components/index.scss @@ -1,5 +1,6 @@ -/***************************************************** -PUNICA CSS > COMPONENTS ******************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS +///////////////////////////////////////////////////////// @import "Alert/Alert"; @import "Badge/Badge"; @import "Billboard/Billboard"; diff --git a/src/Components/variables.scss b/src/Components/variables.scss index ef66783c..275fd73e 100644 --- a/src/Components/variables.scss +++ b/src/Components/variables.scss @@ -1,5 +1,6 @@ -/****************************************************************** -PUNICA CSS > COMPONENTS : VARIABLES *******************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > COMPONENTS : VARIABLES +///////////////////////////////////////////////////////// @import "Alert/variables"; @import "Badge/variables"; @import "Billboard/variables"; diff --git a/src/Elements/Button/Button.scss b/src/Elements/Button/Button.scss index 25440c28..62e19bc9 100644 --- a/src/Elements/Button/Button.scss +++ b/src/Elements/Button/Button.scss @@ -1,69 +1,68 @@ /***************************************************** PUNICA CSS > ELEMENTS : BUTTON ***********************/ @import "mixins"; -// -// if button is enable -// +/// +/// if button is enable +/// @if $elements-button { a.#{$button-class}, .#{$button-class} { display: inline-flex; - font-family: $button-font-family; - font-size: $button-font-size; - font-weight: $button-font-weight; + font-family: $main-font-family; + font-size: 1em; + font-weight: 700; text-decoration: none; white-space: nowrap; outline: none; width: min-content; - text-shadow: $button-text-shadow; - background: $button-bg-color; - background-image: $button-bg-image; - border: $button-border-width solid $button-border-color; + background: theme('background-color'); + background-image: none; + border: theme('border-width') theme('border-style') theme('border-color'); appearance: none; - color: $button-text-color; - border-radius: $button-border-radius; + color: theme('text-color'); + border-radius: theme('border-radius'); box-sizing: border-box; cursor: pointer; - line-height: $button-line-height; - padding: $button-padding; + line-height: 1; + padding: .935rem 1.6rem; transition: background .2s, color .2s; user-select: none; - box-shadow: $button-shadow; + box-shadow: none; align-items: center; justify-content: center; overflow: visible; text-align: center; &:focus, &:hover { - color: $button-hover-text-color; - background: $button-bg-hover; - background-image: $button-bg-hover-image; + color: theme('text-color'); + background: theme('color-secondary'); + background-image: none; transition: background .2s, color .2s; } &:active { - color: $button-text-color; - background: $button-bg-color; + color: theme('text-color'); + background: theme('background-color'); } &:focus { - background: $button-bg-color; + background: theme('background-color'); > i, > [class^="#{$icon-font-class-name}"] { - color: $primary-color; + color: theme('primary-color'); } } &.#{$button-class-active} { - color: $button-text-color; - background: $button-bg-active; - background-image: $button-bg-hover-image; + color: theme('text-color'); + background: theme('color-active'); + background-image: none; text-decoration: none; &:focus, &:hover { - color: $button-hover-text-color; - background: $button-bg-hover; + color: theme('text-color'); + background: theme('color-secondary'); } i, [class^="#{$icon-font-class-name}"] { - color: $button-text-color; - text-shadow: $button-icon-shadow; + color: theme('text-color'); + text-shadow: none; } } &[disabled], @@ -73,297 +72,56 @@ PUNICA CSS > ELEMENTS : BUTTON ***********************/ opacity: .59; pointer-events: none; } - // - // STYLES - // + // Button Block + &.#{$button-class-block} { + display: block; + width: 100%; + } + i, [class^="#{$icon-font-class-name}"] { + font-size: 1.35em; + color: theme('text-color'); + text-shadow: none; + } + /// + /// STYLES + /// @if $elements-button-styles { - @each $theme-name, $theme-color in $button-styles { + @each $theme-name, $theme-color, $border-color in $button-styles { &.#{$theme-name} { - @include button-styles($theme-color); + @include button-styles($theme-color, $border-color); } } } + // Button Link @include link-button(); - // - // SIZES - // + + /// + /// SIZES + /// @if $elements-button-sizes { @include button-sizes(); } - // Button Block - &.#{$button-class-block} { - display: block; - width: 100%; - } - i, [class^="#{$icon-font-class-name}"] { - font-size: 1.35em; - color: $button-icon-color; - text-shadow: $button-icon-shadow; - } - // - // SECONDARY BUTTON - // + + /// + /// SECONDARY BUTTON + /// @if $elements-button-secondary { &.#{$button-secondary} { @include secondary-button(); } } } - // - // BUTTON GROUPS - // + /// + /// BUTTON GROUPS + /// @if $elements-button-group { - .#{$button-class-group} { - display: inline-flex; - flex-wrap: wrap; - flex-shrink: 0; - border-radius: $button-group-border-radius; - @include shadow(0, .155em, 0, rgba(0, 0, 0, 0.095)); - .#{$button-class} { - &:first-child:not(:last-child) { - border-bottom-right-radius: 0; - border-top-right-radius: 0; - } - &:not(:first-child):not(:last-child) { - border-radius: 0; - margin-left: -$button-border-width; - } - &:last-child:not(:first-child) { - border-bottom-left-radius: 0; - border-top-left-radius: 0; - margin-left: -$button-border-width; - } - } - // - // SECONDARY BUTTON - // - @if $elements-button-secondary { - &.#{$button-secondary} > .#{$button-class} { - @include secondary-button(); - } - } - &.#{$button-class-block} { - display: flex; - .#{$button-class} { - flex: 1 0 0; - } - } - .#{$button-class-inactive} { - padding-left: $button-padding-inactive; - padding-right: $button-padding-inactive; - pointer-events: none; - cursor: default; - background-image: none !important; - } - // - // SIZES - // - @if $elements-button-sizes { - @include button-sizes(true); - } - // - // STYLES - // - @if $elements-button-styles { - @each $theme-name, $theme-color in $button-styles { - &.#{$theme-name} > .#{$button-class}, - &.#{$theme-name} > .#{$dropdown-name} > .#{$button-class} { - @include button-styles($theme-color); - border: $button-border-width solid darken($theme-color, 6%); - } - } - } - // Button Link - @include link-button(); - // - // DROPDOWN - // - @if $elements-button-dropdown { - .#{$dropdown-name}:last-child:not(:first-child), - .#{$dropdown-name}:last-child:not(:first-child) > .#{$button-class} { - border-bottom-left-radius: 0; - border-top-left-radius: 0; - margin-left: -1px; - } - .#{$dropdown-name}:last-child, - .#{$dropdown-name}:last-child > .#{$button-class}:first-child, - .#{$dropdown-name}:last-child > .#{$button-class}:last-child { - border-bottom-right-radius: $button-border-radius; - border-top-right-radius: $button-border-radius; - } - .#{$dropdown-name}:not(:first-child):not(:last-child) > .#{$button-class} { - border-radius: 0; - margin-left: -1px; - } - } - @include breakpoints($breakpoints-medium, 'max-width') { - //button-class-group - box-shadow: none; - } - // - // VERTICAL BUTTONS - // - @if $elements-button-group-vertical { - &.#{$button-class-group-vertical} { - flex-flow: column; - >.#{$button-class}, - &.#{$button-class-block}, - &.#{$button-class-block} > .#{$button-class}, - &>.#{$dropdown-name} >.#{$button-class} { - width: 100%; - } - >.#{$button-class} { - border-radius: 0; - &:last-child:not(:first-child), - &:not(:first-child):not(:last-child) { - margin: -$button-border-width 0 0; - } - } - &.#{$button-class-block} { - display: inline-flex; - } - // - // DROPDOWN FOR VERTICAL BUTTONS - // - @if $elements-button-dropdown { - &>.#{$dropdown-name}:last-child:not(:first-child), - &>.#{$dropdown-name}:last-child:not(:first-child) > .#{$button-class}, - &>.#{$dropdown-name}:not(:first-child):not(:last-child) > .#{$button-class} { - margin: -$button-border-width 0 0; - border-radius: 0; - } - } - // - // STYLES - // - @if $elements-button-styles { - @each $theme-name, $theme-color in $button-styles { - &>.#{$theme-name}.#{$button-class}, - &>.#{$dropdown-name} > .#{$theme-name}.#{$button-class} { - border: $button-border-width solid darken($theme-color, 6%); - } - } - } - } - } - } + @include button-group(); } - // - // DROPDOWN - // + /// + /// DROPDOWN + /// @if $elements-button-dropdown { - .#{$dropdown-name} { - display: inline-block; - position: relative; - &>.#{$menu-name} { - animation: slide-down .15s ease 1; - display: none; - left: 0; - max-height: 45vh; - overflow-y: auto; - position: absolute; - top: 100%; - z-index: $menu-z-index + 1; - width: auto; - &>.#{$menu-item} { - & > a { - padding: .1rem $menu-padding; - } - } - } - &.#{$dropdown-right}, - &.#{$dropdown-left} { - &>.#{$menu-name} { - top: 0; - } - } - &.#{$dropdown-right} { - &>.#{$menu-name} { - left: 100%; - right: auto; - } - } - &.#{$dropdown-left} { - &>.#{$menu-name} { - left: auto; - right: 100%; - } - } - &.#{$dropdown-top}.#{$dropdown-left} { - &>.#{$menu-name} { - right: auto !important; - left: 0 !important; - } - } - &.#{$dropdown-top}.#{$dropdown-right} { - &>.#{$menu-name} { - right: 0 !important; - left: auto !important; - } - } - &.#{$dropdown-top} { - &>.#{$menu-name} { - bottom: 100%; - top: auto; - right: 0; - left: auto; - @include shadow(0, -3px, 10px, rgba(0, 0, 0, 0.15)); - } - } - &.#{$dropdown-bottom}.#{$dropdown-left}, - &.#{$dropdown-bottom}.#{$dropdown-right} { - &>.#{$menu-name} { - top: 100%; - } - } - &.#{$dropdown-bottom}.#{$dropdown-left} { - &>.#{$menu-name} { - right: auto !important; - left: 0 !important; - } - } - &.#{$dropdown-bottom}.#{$dropdown-right} { - &>.#{$menu-name} { - right: 0 !important; - left: auto !important; - } - } - // dropdown hover (default) - &.#{$menu-item-active} > .#{$menu-name}, - &>.#{$dropdown-toggle}:focus + .#{$menu-name}, - &>.#{$dropdown-toggle}:hover + .#{$menu-name}, - &>.#{$menu-name}:focus, - &>.#{$menu-name}:hover { - display: block; - } - // clickable dropdown - &.#{$dropdown-click} { - &>.#{$dropdown-toggle}:hover + .#{$menu-name} { - display: none; - } - &>.#{$dropdown-toggle}:focus ~ .#{$menu-name}, - &>.#{$dropdown-toggle}:active ~ .#{$menu-name} { - display: block; - } - } - // - // BUTTON GROUPS - // - @if $elements-button-group { - &>.#{$button-class-group} { - &>.#{$dropdown-toggle}:nth-last-child(2) { - border-bottom-right-radius: $button-border-radius; - border-top-right-radius: $button-border-radius; - } - } - } - // - // SIZES - // - @if $elements-button-sizes { - @include button-sizes(true); - } - } + @include dropdown(); } } diff --git a/src/Elements/Button/mixins.scss b/src/Elements/Button/mixins.scss index 881507d9..d5ed2fdb 100644 --- a/src/Elements/Button/mixins.scss +++ b/src/Elements/Button/mixins.scss @@ -1,64 +1,298 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : BUTTON > MIXINS **************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : BUTTON > MIXINS +///////////////////////////////////////////////////////// + +/// +/// Dropdown +/// +@mixin dropdown() { + .#{$dropdown-name} { + display: inline-block; + position: relative; + &>.#{$menu-name} { + animation: slide-down .15s ease 1; + display: none; + left: 0; + max-height: 45vh; + overflow-y: auto; + position: absolute; + top: 100%; + z-index: 300 + 1; // menu z-index + 1 + width: auto; + &>.#{$menu-item} { + & > a { + padding: .1rem .9rem; + } + } + } + &.#{$dropdown-right}, + &.#{$dropdown-left} { + &>.#{$menu-name} { + top: 0; + } + } + &.#{$dropdown-right} { + &>.#{$menu-name} { + left: 100%; + right: auto; + } + } + &.#{$dropdown-left} { + &>.#{$menu-name} { + left: auto; + right: 100%; + } + } + &.#{$dropdown-top}.#{$dropdown-left} { + &>.#{$menu-name} { + right: auto !important; + left: 0 !important; + } + } + &.#{$dropdown-top}.#{$dropdown-right} { + &>.#{$menu-name} { + right: 0 !important; + left: auto !important; + } + } + &.#{$dropdown-top} { + &>.#{$menu-name} { + bottom: 100%; + top: auto; + right: 0; + left: auto; + @include shadow(0, -3px, 10px, rgba(0, 0, 0, 0.15)); + } + } + &.#{$dropdown-bottom}.#{$dropdown-left}, + &.#{$dropdown-bottom}.#{$dropdown-right} { + &>.#{$menu-name} { + top: 100%; + } + } + &.#{$dropdown-bottom}.#{$dropdown-left} { + &>.#{$menu-name} { + right: auto !important; + left: 0 !important; + } + } + &.#{$dropdown-bottom}.#{$dropdown-right} { + &>.#{$menu-name} { + right: 0 !important; + left: auto !important; + } + } + // dropdown hover (default) + &.#{$menu-item-active} > .#{$menu-name}, + &>.#{$dropdown-toggle}:focus + .#{$menu-name}, + &>.#{$dropdown-toggle}:hover + .#{$menu-name}, + &>.#{$menu-name}:focus, + &>.#{$menu-name}:hover { + display: block; + } + // clickable dropdown + &.#{$dropdown-click} { + &>.#{$dropdown-toggle}:hover + .#{$menu-name} { + display: none; + } + &>.#{$dropdown-toggle}:focus + .#{$menu-name}, + &>.#{$dropdown-toggle}:active + .#{$menu-name} { + display: block; + } + } + /// + /// BUTTON GROUPS + /// + @if $elements-button-group { + &>.#{$button-class-group} { + &>.#{$dropdown-toggle}:nth-last-child(2) { + border-bottom-right-radius: theme('border-radius'); + border-top-right-radius: theme('border-radius'); + } + } + } + /// + /// SIZES + /// + @if $elements-button-sizes { + @include button-sizes(true); + } + } +} + +/// +/// Button Group +/// +@mixin button-group() { + .#{$button-class-group} { + display: inline-flex; + flex-wrap: wrap; + flex-shrink: 0; + border-radius: theme('border-radius'); + @include shadow(); + .#{$button-class} { + box-shadow: none; + &:first-child:not(:last-child) { + border-bottom-right-radius: 0; + border-top-right-radius: 0; + } + &:not(:first-child):not(:last-child) { + border-radius: 0; + margin-left: -#{theme('border-width')}; + } + &:last-child:not(:first-child) { + border-bottom-left-radius: 0; + border-top-left-radius: 0; + margin-left: -#{theme('border-width')}; + } + } + /// + /// SECONDARY BUTTON + /// + @if $elements-button-secondary { + &.#{$button-secondary} > .#{$button-class} { + @include secondary-button(); + } + } + &.#{$button-class-block} { + display: flex; + .#{$button-class} { + flex: 1 0 0; + } + } + .#{$button-class-inactive} { + padding-left: .45rem !important; + padding-right: .45rem !important; + pointer-events: none; + cursor: default; + background-image: none !important; + } + /// + /// SIZES + /// + @if $elements-button-sizes { + @include button-sizes(true); + } + /// + /// STYLES + /// + @if $elements-button-styles { + @each $theme-name, $theme-color in $button-styles { + &.#{$theme-name} > .#{$button-class}, + &.#{$theme-name} > .#{$dropdown-name} > .#{$button-class} { + @include button-styles($theme-color, darken($theme-color, 7%)); + } + } + } + // Button Link + @include link-button(); + /// + /// DROPDOWN + /// + @if $elements-button-dropdown { + .#{$dropdown-name}:last-child:not(:first-child), + .#{$dropdown-name}:last-child:not(:first-child) > .#{$button-class} { + border-bottom-left-radius: 0; + border-top-left-radius: 0; + margin-left: -1px; + } + .#{$dropdown-name}:last-child, + .#{$dropdown-name}:last-child > .#{$button-class}:first-child, + .#{$dropdown-name}:last-child > .#{$button-class}:last-child { + border-bottom-right-radius: theme('border-radius'); + border-top-right-radius: theme('border-radius'); + } + .#{$dropdown-name}:not(:first-child):not(:last-child) > .#{$button-class} { + border-radius: 0; + margin-left: -1px; + } + } + @include breakpoints($breakpoints-medium, 'max-width') { + //button-class-group + box-shadow: none; + } + /// + /// VERTICAL BUTTONS + /// + @if $elements-button-group-vertical { + &.#{$button-class-group-vertical} { + flex-flow: column; + >.#{$button-class}, + &.#{$button-class-block}, + &.#{$button-class-block} > .#{$button-class}, + &>.#{$dropdown-name} >.#{$button-class} { + width: 100%; + } + >.#{$button-class} { + border-radius: 0; + &:last-child:not(:first-child), + &:not(:first-child):not(:last-child) { + margin: -#{theme('border-width')} 0 0; + } + } + &.#{$button-class-block} { + display: inline-flex; + } + /// + /// DROPDOWN FOR VERTICAL BUTTONS + /// + @if $elements-button-dropdown { + &>.#{$dropdown-name}:last-child:not(:first-child), + &>.#{$dropdown-name}:last-child:not(:first-child) > .#{$button-class}, + &>.#{$dropdown-name}:not(:first-child):not(:last-child) > .#{$button-class} { + margin: -#{theme('border-width')} 0 0; + border-radius: 0; + } + } + /// + /// STYLES + /// + @if $elements-button-styles { + @each $theme-name, $theme-color in $button-styles { + &>.#{$theme-name}.#{$button-class}, + &>.#{$dropdown-name} > .#{$theme-name}.#{$button-class} { + border: theme('border-width') solid darken($theme-color, 6%); + } + } + } + } + } + } +} + +/// +/// Button Styles +/// @param {Color} $bg-color +/// @param {Color} $border-color +/// @mixin button-styles( - $bg-color: $primary-color, - $text-color: $main-invert-color, - $bg-img: none, - $bg-img-hover: none + $bg-color: theme('primary-color'), + $border-color: null ) { background: $bg-color; - color: $text-color; + color: theme('color-negative'); text-shadow: 0 1px 1px darken($bg-color, 6%); - background-image: $bg-img; - border: none; + border: theme('border-width') theme('border-style') $border-color; &:hover { background: lighten($bg-color, 7.5%); - color: $text-color; - background-image: $bg-img-hover; + color: theme('color-negative'); } &:active, &.#{$button-class-active} { background: lighten($bg-color, 7.5%); - color: $text-color; - } - &.#{$button-class-inactive} { - background: darken($bg-color, 7.5%); + color: theme('color-negative'); } i, [class^="#{$icon-font-class-name}"] { - color: $text-color; - text-shadow: $button-icon-shadow; + color: theme('color-negative'); + text-shadow: none; } @content; } -// Secondary Button -@mixin secondary-button() { - color: $button-secondary-text-color; - background-image: $button-secondary-bg-img; - &:focus, - &:hover, - &:active, - &.#{$button-class-active} { - color: $button-secondary-text-color; - background-image: $button-secondary-bg-img-hover; - z-index: 1; - border-color: $main-border-color; - i, [class^="#{$icon-font-class-name}"] { - color: $button-secondary-text-color; - } - } -} -// Link Button -@mixin link-button() { - &.#{$button-class-link}.#{$button-class}, - &.#{$button-class-link} > .#{$button-class} { - @include button-styles(transparent, $main-font-color) { - &:hover { - background: $button-bg-active; - } - }; - } -} -// Button Sizes + +/// +/// Button Sizes +/// @param {Boolean} $class-name +/// @mixin button-sizes($class-name: false) { @each $name, $font-size, $padding, $font-weight in $button-sizes { @if $class-name { @@ -77,3 +311,41 @@ PUNICA CSS > ELEMENTS : BUTTON > MIXINS **************/ } } } + +/// +/// Secondary Button +/// +@mixin secondary-button() { + color: theme('text-color'); + background-image: theme('button-secondary-bg'); + &:focus, + &:hover, + &:active, + &.#{$button-class-active} { + color: theme('text-color'); + background-image: theme('button-secondary-bg-hover'); + z-index: 1; + border-color: theme('border-color'); + i, [class^="#{$icon-font-class-name}"] { + color: theme('text-color'); + } + } +} + +/// +/// Link Button +/// +@mixin link-button() { + &.#{$button-class-link}.#{$button-class}, + &.#{$button-class-link} > .#{$button-class} { + @include button-styles(transparent) { + box-shadow: none; + border: none; + color: theme('text-color'); + &:hover { + background: theme('color-active'); + color: theme('text-color'); + } + }; + } +} diff --git a/src/Elements/Button/variables.scss b/src/Elements/Button/variables.scss index 6c848319..bcf339cb 100644 --- a/src/Elements/Button/variables.scss +++ b/src/Elements/Button/variables.scss @@ -1,8 +1,8 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : BUTTON > VARIABLES ***********/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : BUTTON > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ +/// CLASS NAMING ======================================== $button-class : 'button'; /* Static Button Styles */ $button-class-link : 'link'; @@ -24,60 +24,22 @@ $dropdown-bottom : 'bottom'; $dropdown-toggle : 'toggle'; $dropdown-click : 'clickable'; -/***************************************************** -PREFERENCES ******************************************/ -/* Text & Font Size */ -$button-font-family : $main-font-family; -$button-font-size : 1em; -/* Color & Background */ -$button-bg-color : #fff; -$button-text-color : $main-font-color; -$button-bg-hover : $main-hovered-bg; -$button-hover-text-color : $button-text-color; -$button-bg-active : $main-secondary-bg; -/* Shadow */ -$button-text-shadow : 0 1px 1px #fff; -$button-shadow : none; -/* Bg Image */ -$button-bg-image : none; -$button-bg-hover-image : none; -/* Button Icon */ -$button-icon-color : $button-text-color; -$button-icon-shadow : none; -/* Line Height & Weight */ -$button-line-height : 1; -$button-font-weight : 700; // default button -/* Border */ -$button-border-width : 1px; -$button-border-color : #ccc; -$button-border-radius : 3px; -$button-group-border-radius : $button-border-radius; -/* Padding */ -$button-padding : .935rem 1.6rem; -$button-padding-inactive : .45rem !important; -/* Secondary Button */ -$button-secondary-text-color : $main-font-color; -$button-secondary-hover-color : $main-font-color; -$button-secondary-bg-img : linear-gradient(to bottom, #ffffff 0%,#ededed 60%,#e6e6e6 100%); -$button-secondary-bg-img-hover : linear-gradient(to bottom, #e1e1e1 0%,#e1e1e1 11%,#e8e8e8 22%,#eeeeee 43%,#fafafa 100%); - -/***************************************************** -SIZES ************************************************/ -// size name, font-size, padding, font-weight +// SIZES ================================================ $button-sizes: ( - ("tiny", .809em, .415rem .5rem, $button-font-weight), - ("mini", .909em, .445rem .9rem, $button-font-weight), - ("small", .979em, .645rem 1.4rem, $button-font-weight), - ("large", 1.25em, 1.15rem 2.1rem, $button-font-weight), - ("huge", 1.45em, 1.3rem 2.4rem, $button-font-weight) + // size name, font-size, padding, font-weight + ("tiny", .809em, .415rem .5rem, 700), + ("mini", .909em, .445rem .9rem, 700), + ("small", .979em, .645rem 1.4rem, 700), + ("large", 1.25em, 1.15rem 2.1rem, 700), + ("huge", 1.45em, 1.3rem 2.4rem, 700) ); -/***************************************************** -STYLES ***********************************************/ -// name, color + +/// STYLES ============================================== $button-styles: ( - ('primary', $primary-color), - ('success', $success-color), - ('warning', $warning-color), - ('error', $error-color), - ('dark', $main-dark-color) + // name, color, border color + ('primary', theme('primary-color'), lighten(theme('primary-color'), 7%)), + ('success', theme('success-color'), lighten(theme('success-color'), 7%)), + ('warning', theme('warning-color'), lighten(theme('warning-color'), 7%)), + ('error', theme('error-color'), lighten(theme('error-color'), 7%)), + ('dark', theme('color-dark'), lighten(theme('color-dark'), 7%)) ); diff --git a/src/Elements/Form/Form.scss b/src/Elements/Form/Form.scss index 33591303..f46f41ba 100644 --- a/src/Elements/Form/Form.scss +++ b/src/Elements/Form/Form.scss @@ -1,34 +1,35 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : FORM *************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : FORM +///////////////////////////////////////////////////////// @import "mixins"; -// -// if form is enable -// +/// +/// if form is enable +/// @if $elements-form { @include form-inputs() { -webkit-appearance: none; - background-color: $form-input-bg; - border: $main-border-width $main-border-style $main-border-color; + background-color: theme('input-bg'); + border: theme('border-width') theme('border-style') theme('input-border-color'); height: $form-input-height; border-radius: $form-input-radius; - outline: $form-outline-width solid transparent; + outline: theme('input-outline-width') solid transparent; box-shadow: none; box-sizing: inherit; - outline-offset: -$form-outline-width; + outline-offset: -#{theme('input-outline-width')}; padding: $form-input-padding; width: 100%; max-width: 100%; font-family: inherit; - color: $form-input-color; + color: theme('input-color'); font-size: $form-input-size; &:focus { - outline: $form-outline-width solid $form-outline-color; - outline-offset: -$form-outline-width; + outline: theme('input-outline-width') solid theme('input-outline-color'); + outline-offset: -#{theme('input-outline-width')}; transition: .35s; } - // - // VALIDATION STYLES - // + /// + /// VALIDATION STYLES + /// @if $elements-form-validation-styles { @each $style-name, $style-color in $form-input-styles { &.#{$style-name} { @@ -85,7 +86,7 @@ PUNICA CSS > ELEMENTS : FORM *************************/ @at-root .#{$form-name} label, &>label { margin: $form-label-margin; - color: $form-label-color; + color: theme('text-color'); font-size: $form-label-size; font-weight: $form-label-weight; text-transform: none; @@ -99,9 +100,9 @@ PUNICA CSS > ELEMENTS : FORM *************************/ height: 100%; cursor: default; } - // - // FORM GROUPS - // + /// + /// FORM GROUPS + /// @if $elements-form-group { @at-root .#{$form-name} .#{$form-group}, &>.#{$form-group} { @@ -122,9 +123,7 @@ PUNICA CSS > ELEMENTS : FORM *************************/ } >.#{$button-class} { height: $form-input-height; - font-size: $button-font-size; - padding: $button-padding; - font-weight: $button-font-weight; + box-shadow: none; &:first-child { border-bottom-right-radius: 0; border-top-right-radius: 0; @@ -159,9 +158,9 @@ PUNICA CSS > ELEMENTS : FORM *************************/ } } } - // - // INPUT SIZES - // + /// + /// INPUT SIZES + /// @if $elements-form-input-sizes { @each $size-name, $font-size, $input-height, $button-padding, $button-font-size in $form-input-sizes { &.#{$size-name} { @@ -183,9 +182,9 @@ PUNICA CSS > ELEMENTS : FORM *************************/ } } } - // - // CHECKBOX & RADIO - // + /// + /// CHECKBOX & RADIO + /// @if $elements-form-checkbox-radio { .#{$form-radio}, .#{$form-checkbox} { @@ -207,11 +206,10 @@ PUNICA CSS > ELEMENTS : FORM *************************/ input + label::after { position: absolute; transition: opacity 0.11s ease-in-out; - font-family: $form-icon-font-family; + font-family: '#{$icon-font-name}'; font-style: normal; font-weight: normal; text-transform: none; - color: $form-radio-checkbox-color; font-size: $form-radio-checkbox-size; top: $form-radio-checkbox-top; left: $form-radio-checkbox-left; @@ -228,18 +226,22 @@ PUNICA CSS > ELEMENTS : FORM *************************/ } .#{$form-checkbox} { input + label::before { - content: $form-checkbox-before-content; + content: $icon-checkbox-before; + color: theme('text-color'); } input + label::after { - content: $form-checkbox-after-content; + content: $icon-checkbox-after; + color: theme('primary-color'); } } .#{$form-radio} { input + label::before { - content: $form-radio-before-content; + content: $icon-radio-before; + color: theme('text-color'); } input + label::after { - content: $form-radio-after-content; + content: $icon-radio-after; + color: theme('primary-color'); } } } diff --git a/src/Elements/Form/mixins.scss b/src/Elements/Form/mixins.scss index 6ddb0981..cb2cea9c 100644 --- a/src/Elements/Form/mixins.scss +++ b/src/Elements/Form/mixins.scss @@ -1,6 +1,10 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : FORM > MIXINS ****************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : FORM > MIXINS +///////////////////////////////////////////////////////// +/// +/// Inputs +/// @mixin form-inputs() { input[type='color'], input[type='date'], diff --git a/src/Elements/Form/variables.scss b/src/Elements/Form/variables.scss index dc066e26..e5b35c2f 100644 --- a/src/Elements/Form/variables.scss +++ b/src/Elements/Form/variables.scss @@ -1,63 +1,47 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : FORM > VARIABLES *************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : FORM > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$form-name : 'form'; -$form-items : 'items'; -$form-item : 'item'; -$form-checkbox : 'checkbox'; -$form-radio : 'radio'; -$form-group : 'group'; +/// CLASS NAMING ======================================== +$form-name : 'form'; +$form-items : 'items'; +$form-item : 'item'; +$form-checkbox : 'checkbox'; +$form-radio : 'radio'; +$form-group : 'group'; -/***************************************************** -PREFERENCES ******************************************/ -$form-padding : 0 16px; -$form-input-bg : $main-bg; -$form-input-color : $main-dark-color; -$form-input-height : 2.5rem; -$form-input-radius : 0; -$form-input-padding : .4rem .5rem; -$form-input-size : 1.088em; -$form-outline-width : 2px; -$form-outline-color : $main-dark-color; -$form-items-spacer : 6px 0 .75em; -$form-item-spacer : 6px 6px .75em; -/* Label */ -$form-label-color : darken($main-dark-color, 13.85%); -$form-label-size : .8579rem; -$form-label-weight : 700; -$form-label-margin : 0; +/// PREFERENCES ========================================= +$form-padding : 0 16px; +$form-input-height : 2.5rem; +$form-input-radius : 0; +$form-input-padding : .4rem .5rem; +$form-input-size : 1.088em; +// item spacer +$form-items-spacer : 6px 0 .75em; +$form-item-spacer : 6px 6px .75em; +// label +$form-label-size : .8579rem; +$form-label-weight : 700; +$form-label-margin : 0; -/***************************************************** -SIZES ************************************************/ -// name, font-size, input height, button padding[*], button font size[*] -// [*] referenced from button variables +/// SIZES =============================================== $form-input-sizes: ( + // name, font-size, input height, button padding[*], button font size[*] + // [*] referenced from button variables ('small', 1em, 1.9rem, .645rem 1.4rem, .979em), ('large', 1.2em, 2.9rem, 1.15rem 2.1rem, 1.25em) ); -/***************************************************** -STYLES ***********************************************/ -// name, color (for input validations) +/// STYLES ============================================== $form-input-styles: ( - ('success', $success-color), - ('error', $error-color) + // name, color (for input validations) + ('success', theme('success-color')), + ('error', theme('error-color')) ); -/***************************************************** -PREFERENCES (Checkbox & Radio) ***********************/ +/// PREFERENCES (Checkbox & Radio) ====================== /* Checkbox & Radio */ -$form-icon-font-family : '#{$icon-font-name}'; -$form-radio-checkbox-color : $main-dark-color; -$form-radio-checkbox-size : 1.15rem; -$form-radio-checkbox-top : -5px; +$form-radio-checkbox-size : 1.35rem; +$form-radio-checkbox-top : -8px; $form-radio-checkbox-left : 0; -/* Checkbox (material icons) */ -$form-checkbox-before-content : $icon-checkbox-before; -$form-checkbox-after-content : $icon-checkbox-after; $form-checkbox-label-padding : 0 1.2rem 0 1.7rem; -/* Radio (material icons) */ -$form-radio-before-content : $icon-radio-before; -$form-radio-after-content : $icon-radio-after; diff --git a/src/Elements/Icon/Icon.scss b/src/Elements/Icon/Icon.scss index 3f5675d1..c037aeed 100644 --- a/src/Elements/Icon/Icon.scss +++ b/src/Elements/Icon/Icon.scss @@ -1,7 +1,9 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : ICON *************************/ - -// if icon is enable +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : ICON +///////////////////////////////////////////////////////// +/// +/// if icon is enable +/// @if $elements-icon { .#{$icon-font-class-name} { font-size: $icon-font-size; diff --git a/src/Elements/Icon/variables.scss b/src/Elements/Icon/variables.scss index 5e436ae2..a3d4925a 100644 --- a/src/Elements/Icon/variables.scss +++ b/src/Elements/Icon/variables.scss @@ -1,32 +1,36 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : ICON > VARIABLES ************* -====================================================== +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : ICON > VARIABLES +///////////////////////////////////////////////////////// +/*======================================================= All icons are defined from this file. Please take a look at https://material.io/resources/icons/ for more information. You can also define any other font library you want from here. -======================================================/ +=======================================================*/ -/***************************************************** -DEFINITIONS ******************************************/ +/// DEFINITIONS ========================================= $icon-font-name : 'Material Icons'; $icon-font-class-name : 'material-icons'; + // elements -> form -> checkbox $icon-checkbox-before : "check_box_outline_blank"; $icon-checkbox-after : "check_box"; + // elements-> form -> radio $icon-radio-before : "radio_button_unchecked"; $icon-radio-after : "radio_button_checked"; + // components -> breadcrumb $icon-breadcrumb-seperator : "keyboard_arrow_right"; + // components -> navbar $icon-navbar-open : "dehaze"; $icon-navbar-close : "close"; + // components -> process $icon-process-current : "beenhere"; -/***************************************************** -PREFERENCES ******************************************/ +/// PREFERENCES ========================================= $icon-font-size : 1.1rem; $icon-line-height : 1; $icon-vertical-align : middle; \ No newline at end of file diff --git a/src/Elements/Label/Label.scss b/src/Elements/Label/Label.scss index 9877e0f7..33781243 100644 --- a/src/Elements/Label/Label.scss +++ b/src/Elements/Label/Label.scss @@ -1,44 +1,45 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : LABEL ************************/ -// -// if label is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : LABEL +///////////////////////////////////////////////////////// +/// +/// if label is enable +/// @if $elements-label { a.#{$label-name}, .#{$label-name} { - display: inline-block; - font-weight: $label-font-weight; - line-height: $label-line-height; - margin: $label-margin; - border-radius: $label-border-radius; - text-decoration: none; - border: $main-border-width solid $main-border-color; - @include shadow(0, .155em, 0, rgba(0, 0, 0, 0.095)); - @include set-style($main-bg, $main-font-color) { - border-color: $main-border-color; + @include set-style(theme('background-color'), theme('text-color')) { + display: inline-block; + font-weight: $label-font-weight; + line-height: $label-line-height; + margin: $label-margin; + border-radius: theme('border-radius'); + text-decoration: none; + @include border(); + @include shadow(0, .155em, 0, rgba(0, 0, 0, 0.095)); + border-color: theme('border-color'); + @include set-size($label-font-size, $label-padding); + >i, + >.material-icons { + vertical-align: text-top; + } }; - @include set-size($label-font-size, $label-padding); - // - // STYLES - // + /// + /// STYLES + /// @if ($elements-label-styles) { @each $style-name, $bg-color in $label-styles { - @include set-style($bg-color, $main-invert-color, $style-name) { + @include set-style($bg-color, theme('color-negative'), $style-name) { border-color: darken($bg-color, 7%); }; } } - // - // SIZES - // + /// + /// SIZES + /// @if ($elements-label-sizes) { @each $size-name, $padding, $font-size in $label-sizes { @include set-size($font-size, $padding, $size-name); } } - >i, - >.material-icons { - vertical-align: text-top; - } } -} +} \ No newline at end of file diff --git a/src/Elements/Label/variables.scss b/src/Elements/Label/variables.scss index 2c7eadbf..c5ed55e4 100644 --- a/src/Elements/Label/variables.scss +++ b/src/Elements/Label/variables.scss @@ -1,33 +1,29 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : LABEL > VARIABLES ************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : LABEL > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$label-name : 'label'; +/// CLASS NAMING ======================================== +$label-name: 'label'; -/***************************************************** -STYLES ***********************************************/ +/// STYLES ============================================== $label-styles : ( - "primary": $primary-color, - "success": $success-color, - "warning": $warning-color, - "error": $error-color, - "dark": $main-dark-color, + "primary" : theme('primary-color'), + "success" : theme('success-color'), + "warning" : theme('warning-color'), + "error" : theme('error-color'), + "dark" : theme('color-dark'), ); -/***************************************************** -SIZES ************************************************/ -// size name, padding, font-size +/// SIZES =============================================== $label-sizes: ( + // size name, padding, font-size ("small", .18rem .85rem, .8195em), ("large", .415rem 1.159rem, 1em) ); -/***************************************************** -PREFERENCES ******************************************/ +/// PREFERENCES ========================================= $label-line-height : 1.2; $label-font-size : .9195em; $label-font-weight : 700; $label-padding : 0.28rem 0.9rem; -$label-margin : .1rem .05rem; -$label-border-radius : $main-border-radius; \ No newline at end of file +$label-margin : .1rem .05rem; \ No newline at end of file diff --git a/src/Elements/Table/Table.scss b/src/Elements/Table/Table.scss index a46fef3d..6ca1d47b 100644 --- a/src/Elements/Table/Table.scss +++ b/src/Elements/Table/Table.scss @@ -1,8 +1,9 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : TABLE ************************/ -// -// if table is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : TABLE +///////////////////////////////////////////////////////// +/// +/// if table is enable +/// @if $elements-table { .#{$table-class} { position: relative; @@ -12,39 +13,39 @@ PUNICA CSS > ELEMENTS : TABLE ************************/ max-width: 100%; text-align: left; margin-bottom: 1.5rem; - // - // STRIPED - // + /// + /// STRIPED + /// @if $elements-table-striped { &.#{$table-class-striped} { tr, tbody tr { &.#{$table-class-active} { - background: $main-striped-bg; + background: theme('color-secondary'); } &:nth-of-type(odd) { - background: $main-striped-bg; + background: theme('color-secondary'); } } thead tr { - background: $table-thead-bg !important; + background: transparent !important; } } } - // - // HOVERED - // + /// + /// HOVERED + /// @if $elements-table-hovered { &.#{$table-class-hovered} { tr, tbody tr { &:hover { - background: $main-hovered-bg; - color: $main-font-color; + background: theme('color-secondary'); + color: theme('text-color'); } } thead tr { - background: $table-thead-bg !important; + background: transparent !important; } } } @@ -53,22 +54,22 @@ PUNICA CSS > ELEMENTS : TABLE ************************/ transition: all 0.3s; &.#{$table-class-active}, &.#{$table-class-active}:hover { - background: $main-secondary-bg; + background: theme('color-secondary'); } } td, th { - border-bottom: $table-bottom-border-width solid $table-border-color; - padding: $table-padding-y $table-padding-x; + border-bottom: theme('border-width') theme('border-style') theme('color-secondary'); + padding: 5px 7px; text-align: inherit; } thead tr { - background: $table-thead-bg; + background: transparent; th { - border-bottom-width: $table-bottom-border-width; - border-bottom-color: $main-border-color; - font-weight: $table-th-weight; - color: $table-th-color; + border-bottom-width: theme('border-width'); + border-bottom-color: theme('border-color'); + font-weight: 400; + color: theme('color-grey'); } } } diff --git a/src/Elements/Table/variables.scss b/src/Elements/Table/variables.scss index 07915d07..d280c5b3 100644 --- a/src/Elements/Table/variables.scss +++ b/src/Elements/Table/variables.scss @@ -1,22 +1,9 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : TABLE > VARIABLES ************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : TABLE > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -CLASS NAMING *****************************************/ -$table-class : 'table'; -$table-class-striped : 'striped'; -$table-class-hovered : 'hovered'; -$table-class-active : 'active'; - -/***************************************************** -STYLES ***********************************************/ -$table-border-color : $main-secondary-bg; -$table-thead-bg : transparent; -$table-th-color : #9d9d9d; -$table-th-weight : 400; - -/***************************************************** -PREFERENCES ******************************************/ -$table-bottom-border-width : 1px; -$table-padding-y : 5px; -$table-padding-x : 7px; \ No newline at end of file +/// CLASS NAMING ======================================== +$table-class : 'table'; +$table-class-striped : 'striped'; +$table-class-hovered : 'hovered'; +$table-class-active : 'active'; \ No newline at end of file diff --git a/src/Elements/Typography/Typography.scss b/src/Elements/Typography/Typography.scss index 06aeaf79..5c81eee1 100644 --- a/src/Elements/Typography/Typography.scss +++ b/src/Elements/Typography/Typography.scss @@ -1,12 +1,14 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : TYPOGRAPHY *******************/ - -// headers +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : TYPOGRAPHY +///////////////////////////////////////////////////////// +/// +/// Headers +/// @each $header, $font-size, $responsive-size in $typography-headers { #{$header} { margin-top: 0; color: inherit; - line-height: $text-h-line-height; + line-height: 2; margin-bottom: 1em; } #{$header}, @@ -33,13 +35,13 @@ h6.bordered, .h4.bordered, .h5.bordered, .h6.bordered { - border-width: 0 0 $main-border-width 0 !important; + border-width: 0 0 theme('border-width') 0 !important; padding-bottom: 10px; margin-bottom: 20px; } p { margin: 0 0 1em; - font-size: $text-p-size; + font-size: 1.0495rem; } a, ins, u { text-decoration-skip: ink edges; @@ -50,11 +52,11 @@ abbr[title] { text-decoration: none; } blockquote { - border-left: .1rem dotted $main-grey-color; + border-left: .1rem dotted theme('color-dark'); margin-left: 0; padding: .4rem .8rem; font-style: italic; - color: $main-grey-color; + color: theme('text-color'); } small { font-size: 80%; diff --git a/src/Elements/Typography/variables.scss b/src/Elements/Typography/variables.scss index 64ca7ecb..47686907 100644 --- a/src/Elements/Typography/variables.scss +++ b/src/Elements/Typography/variables.scss @@ -1,13 +1,10 @@ -/***************************************************** -PUNICA CSS > ELEMENTS : TYPOGRAPHY > VARIABLES *******/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : TYPOGRAPHY > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -PREFERENCES ******************************************/ -$text-h-line-height : 2; -$text-p-size : 1.0495rem; // paragraph -/* Headers */ -// name, font-size, responsive font-size +/// PREFERENCES ========================================= $typography-headers : ( + // name, font-size, responsive font-size ("h1", 2rem, 1.7rem), ("h2", 1.8rem, 1.5rem), ("h3", 1.6rem, 1.3rem), diff --git a/src/Elements/index.scss b/src/Elements/index.scss index 0998e8e7..7463d501 100644 --- a/src/Elements/index.scss +++ b/src/Elements/index.scss @@ -1,5 +1,6 @@ -/***************************************************** -PUNICA CSS > ELEMENTS ********************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS +///////////////////////////////////////////////////////// @import "Button/Button"; @import "Form/Form"; @import "Typography/Typography"; diff --git a/src/Elements/variables.scss b/src/Elements/variables.scss index ec5613f1..062ae392 100644 --- a/src/Elements/variables.scss +++ b/src/Elements/variables.scss @@ -1,5 +1,6 @@ -/****************************************************************** -PUNICA CSS > ELEMENTS : VARIABLES *********************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > ELEMENTS : VARIABLES +///////////////////////////////////////////////////////// @import "Icon/variables"; @import "Button/variables"; @import "Form/variables"; diff --git a/src/Layout/Base/Base.scss b/src/Layout/Base/Base.scss index d7665680..3daba561 100644 --- a/src/Layout/Base/Base.scss +++ b/src/Layout/Base/Base.scss @@ -1,5 +1,6 @@ -/****************************************************************** -PUNICA CSS > LAYOUT : BASE ****************************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > LAYOUT : BASE +///////////////////////////////////////////////////////// *, *:after, *:before { @@ -23,7 +24,8 @@ body { font-size: $main-font-size; font-weight: $main-font-weight; line-height: $main-line-height; - color: $main-font-color; + color: theme('text-color'); + background-color: theme('background-color'); } html, body { min-height: 100%; @@ -32,38 +34,32 @@ html, body { margin: 0; border: none; } -::-webkit-scrollbar { - width: $scrollbar-width; -} -::-webkit-scrollbar-track { - background: $scrollbar-bg; -} -::-webkit-scrollbar-thumb { - background: $scrollbar-color; -} ::selection { - background-color: $primary-color; - color: $main-invert-color; + background-color: theme('primary-color'); + color: theme('color-negative'); +} +::placeholder { + color: theme('text-color'); + opacity: .5; } a { - color: $main-font-color; + color: theme('text-color'); outline: none; text-decoration: none; &:focus, &:hover, &:active, &.active { - color: darken($primary-color, 8%); + color: darken(theme('primary-color'), 8%); text-decoration: underline; } &:visited { - color: $main-font-color; + color: theme('text-color'); } } hr { margin: 15px 0; - box-shadow: 0 0.05rem 0.2rem rgba(48,55,66,.3); - background-color: #ccc; + background-color: theme('border-color'); border: none; height: 1px; } @@ -108,7 +104,7 @@ iframe { :not(pre)>code, :not(pre)>kbd, :not(pre)>samp { - color: $error-color; + color: theme('error-color'); white-space: nowrap; padding: 2px 6px; font-size: .935em; diff --git a/src/Layout/Grid/Grid.scss b/src/Layout/Grid/Grid.scss index e1c510c8..37cba402 100644 --- a/src/Layout/Grid/Grid.scss +++ b/src/Layout/Grid/Grid.scss @@ -1,8 +1,9 @@ -/****************************************************************** -PUNICA CSS > LAYOUT : GRID ****************************************/ -// -// if grid is enable -// +///////////////////////////////////////////////////////// +/// PUNICA CSS > LAYOUT : GRID +///////////////////////////////////////////////////////// +/// +/// if grid is enable +/// @if $layout-grid { .#{$container} { width: $container-width; @@ -18,9 +19,9 @@ PUNICA CSS > LAYOUT : GRID ****************************************/ padding: $column-padding; min-height: $column-min-height; } - // - // EQUAL - // + /// + /// EQUAL + /// @if $equal-feature { &.#{$equal} > [class^="#{$column}"] { height: auto; @@ -39,9 +40,9 @@ PUNICA CSS > LAYOUT : GRID ****************************************/ .#{$column}-#{$label}-#{$id} { grid-column: span #{$id}; } - // - // OFFSET - // + /// + /// OFFSET + /// @if $offset-feature { @for $offset-id from 2 through $grid { .#{$column}-#{$label}-#{$id}.#{$offset}-#{$label}-#{$offset-id} { diff --git a/src/Layout/Grid/variables.scss b/src/Layout/Grid/variables.scss index ba6e4dbd..2372785c 100644 --- a/src/Layout/Grid/variables.scss +++ b/src/Layout/Grid/variables.scss @@ -1,27 +1,25 @@ -/****************************************************************** -PUNICA CSS > LAYOUT : GRID > VARIABLES ****************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > LAYOUT : GRID > VARIABLES +///////////////////////////////////////////////////////// -/***************************************************** -ENABLE / DISABLE FEATURES ****************************/ -$equal-feature : $layout-grid-equal; -$offset-feature : $layout-grid-offset; +/// ENABLE / DISABLE FEATURES =========================== +$equal-feature : $layout-grid-equal; +$offset-feature : $layout-grid-offset; -/***************************************************** -CLASS NAMING *****************************************/ -$row : 'row'; -$container : 'container'; -$column : 'col'; -$offset : 'offset'; -$equal : 'equal'; +/// CLASS NAMING ======================================== +$row : 'row'; +$container : 'container'; +$column : 'col'; +$offset : 'offset'; +$equal : 'equal'; /* Breakpoints */ -$extra-small : 'xs'; -$small : 'sm'; -$medium : 'md'; -$large : 'lg'; -$extra-large : 'xl'; +$extra-small : 'xs'; +$small : 'sm'; +$medium : 'md'; +$large : 'lg'; +$extra-large : 'xl'; -/***************************************************** -PREFERENCES ******************************************/ +/// PREFERENCES ========================================= $grid : 16; $gutter : 6px; $container-width : 100%; diff --git a/src/Layout/index.scss b/src/Layout/index.scss index 4ef5a2ed..02a98c62 100644 --- a/src/Layout/index.scss +++ b/src/Layout/index.scss @@ -1,4 +1,5 @@ -/****************************************************************** -PUNICA CSS > LAYOUT ***********************************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > LAYOUT +///////////////////////////////////////////////////////// @import "Base/Base"; @import "Grid/Grid"; \ No newline at end of file diff --git a/src/Layout/variables.scss b/src/Layout/variables.scss index 4b20db98..05609f30 100644 --- a/src/Layout/variables.scss +++ b/src/Layout/variables.scss @@ -1,3 +1,4 @@ -/****************************************************************** -PUNICA CSS > LAYOUT : VARIABLES ***********************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > LAYOUT : VARIABLES +///////////////////////////////////////////////////////// @import "Grid/variables"; diff --git a/src/Utilities/helpers.scss b/src/Utilities/helpers.scss index eba5dfb6..70e76ede 100644 --- a/src/Utilities/helpers.scss +++ b/src/Utilities/helpers.scss @@ -1,87 +1,114 @@ -/***************************************************** -PUNICA CSS > UTILITIES : HELPERS *********************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > UTILITIES : HELPERS +///////////////////////////////////////////////////////// @import "mixins"; - +/// +/// +/// @if $helpers { - /***************************************************** - Padding & Margin Helpers *****************************/ + + /// + /// Padding & Margin Helpers + /// @include setHelperListWithRange($margin-helpers, $helper-pm-ranges, "px", "!important"); @include setHelperListWithRange($margin-helpers, auto, null, "!important"); // margin auto @include setHelperListWithRange($padding-helpers, $helper-pm-ranges, "px", "!important"); @include setHelperListWithRange($padding-helpers, auto, null, "!important"); // padding auto - /***************************************************** - Font Weights *****************************************/ + /// + /// Font Weights + /// @include setHelperListWithRange($font-weights, $helper-fw-ranges, null, "!important"); - /***************************************************** - Font Sizes *******************************************/ + /// + /// Font Sizes + /// @include setHelperList($font-sizes, "font-size", "!important"); - /***************************************************** - Text Colors ******************************************/ + /// + /// Text Colors + /// @include setHelperList($text-colors, "color", "!important"); - /***************************************************** - Background Colors ************************************/ + /// + /// Background Colors + /// @include setHelperList($bg-colors, "background-color", "!important"); - @include customBackgrounds(); - /***************************************************** - Cursors **********************************************/ + /// + /// Cursors + /// @include setHelperList($cursors, "cursor", "!important"); - /***************************************************** - Display Properties ***********************************/ + /// + /// Display Properties + /// @include setHelperList($display-properties, "display", "!important"); - /***************************************************** - Alignment ********************************************/ + /// + /// Alignment + /// @include setHelperList($align-items, "align-items"); @include setHelperList($align-self, "align-self"); @include setHelperList($justify-content, "justify-content"); - /***************************************************** - Filters **********************************************/ - @include setHelperList($display-filters, "filter"); + /// + /// Filters + /// + @include setHelperList($display-filters); - /***************************************************** - Text Transform Properties ****************************/ + /// + /// Text Transform Properties + /// @include setHelperList($text-transforms, "text-transform"); - /***************************************************** - Overflow Properties **********************************/ + /// + /// Overflow Properties + /// @include setHelperList($overflow-properties); - /***************************************************** - Position Properties **********************************/ + /// + /// Position Properties + /// @include setHelperList($position-properties, "position"); - /***************************************************** - Stack Order ******************************************/ + /// + /// Stack Order + /// @include setHelperListWithRange($z-indexes, $helper-z-indexes, null, "!important"); - /***************************************************** - Direction of the flexible items **********************/ + /// + /// Direction of the flexible items + /// @include setHelperList($flex-directions, "flex-direction"); - /***************************************************** - User Select Properties *******************************/ + /// + /// User Select Properties + /// @include setHelperList($user-selects, "user-select"); - /***************************************************** - Insets *******************************/ + /// + /// Insets + /// @include setNestedHelperList($insets); - /***************************************************** - Line Height Properties *******************************/ + /// + /// Line Height Properties + /// @include setHelperListWithRange($line-heights, $helper-lh-ranges, null, "!important"); - /***************************************************** - Border Radius ****************************************/ + /// + /// Border Radius + /// @include setHelperListWithRange($border-radius, $helper-br-ranges, "px", "!important"); - /***************************************************** - Others ***********************************************/ + /// + /// Backdrop Filters (blur) + /// + @include setHelperListWithRange($backdrops, $helper-backdrops, 'px'); + + /// + /// Others + /// @include otherHelpers(); } \ No newline at end of file diff --git a/src/Utilities/mixins.scss b/src/Utilities/mixins.scss index afe32d49..ed7eaaa1 100644 --- a/src/Utilities/mixins.scss +++ b/src/Utilities/mixins.scss @@ -1,18 +1,26 @@ -/***************************************************** -PUNICA CSS > UTILITIES : HELPERS > MIXINS ************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS > UTILITIES : HELPERS > MIXINS +///////////////////////////////////////////////////////// -/** - * - */ +/// +/// Set List with Range +/// @param {List} $helpers +/// @param {List} $range +/// @param {String} $value-type +/// @param {Boolean} $specificity +/// @mixin setHelperListWithRange( $helpers, $range, $value-type: null, $specificity: null ) { @include setNestedHelperList($helpers, $range, $value-type, $specificity); } -/** - * - */ +/// +/// Set List +/// @param {List} $helpers +/// @param {String} $property-name +/// @param {Boolean|String} $specificity +/// @mixin setHelperList( $list, $property-name: null, $specificity: null ) { @@ -31,9 +39,13 @@ PUNICA CSS > UTILITIES : HELPERS > MIXINS ************/ } } -/** - * - */ +/// +/// Set Nested List +/// @param {List} $helpers +/// @param {List} $second_list +/// @param {String} $value-type +/// @param {String} $specificity +/// @mixin setNestedHelperList( $list, $second_list: null, $value-type: null, $specificity: null ) { @@ -56,37 +68,22 @@ PUNICA CSS > UTILITIES : HELPERS > MIXINS ************/ } } -/** - * - */ +/// +/// Set Properties +/// @param {Property|String} $property +/// @param {mixed} $value +/// @param {String} $value-type +/// @param {String} $specificity +/// @mixin setProperties( $property, $value, $value-type: null, $specificity: null ) { #{$property}: #{$value}#{$value-type} #{$specificity}; } -/** - * - */ -@mixin customBackgrounds() { - .bg-grid { - height: 100%; - background-color: $main-bg; - background-position: center center; - background-image: linear-gradient(90deg, lighten($primary-color, 25%) 1%, transparent 16%), - linear-gradient(lighten($primary-color, 25%) 1%, transparent 16%); - background-size: 10px 10px; - } - .bg-stripe { - height: 100%; - background-image: linear-gradient($main-bg, $main-bg 7px, $primary-color 4px, darken($main-bg, 14%)); - background-size: 100% 8px; - } -} - -/** - * - */ +/// +/// Other Helpers +/// @mixin otherHelpers() { .centered {margin: 0 auto;} .align.right {text-align: right !important;} @@ -136,9 +133,9 @@ PUNICA CSS > UTILITIES : HELPERS > MIXINS ************/ } .transparent {background: transparent !important;} .pure, .pure > div {background: transparent; border: none; box-shadow: none} - .bordered {border: $main-border-width $main-border-style $main-border-color !important;} + .bordered {@include border();} .borderless {border: none !important;} - .rounded {border-radius: $main-border-radius;} + .rounded {border-radius: theme('border-radius');} .radiusless {border-radius:0 !important;} .shadowed {@include shadow();} .shadowless {box-shadow:none !important;} diff --git a/src/Utilities/variables.scss b/src/Utilities/variables.scss index 2c0ce491..f15cc051 100644 --- a/src/Utilities/variables.scss +++ b/src/Utilities/variables.scss @@ -1,16 +1,16 @@ -/***************************************************** -PUNICA CSS > UTILITIES : HELPERS > VARIABLES *********/ +/////////////////////////////////////////////////////// +/// PUNICA CSS > UTILITIES : HELPERS > VARIABLES +/////////////////////////////////////////////////////// -/***************************************************** -PREFERENCES ******************************************/ +/// PREFERENCES ======================================= $helper-pm-ranges : 0,5,10,15,20,30,40,50; // pm: padding/margin $helper-fw-ranges : 100,200,300,400,500,600,700,800,900; // fw: font-weight $helper-z-indexes : -1,0,1,10,20,30,40,50,100,999,9999; $helper-lh-ranges : 0,1,2,3,4,5; // lh: line-height -$helper-br-ranges : 4,8,10,12,14; // br: border-radius +$helper-br-ranges : 4,8,10,12,14,16,500; // br: border-radius +$helper-backdrops : 4,7,10,12,16,20; // backdrop-filter (blur) -/* -Margin ************************************/ +/// Margin ============================================ $margin-helpers: ( // class name (prefix), property ("m-", "margin"), @@ -20,8 +20,7 @@ $margin-helpers: ( ("ml-", "margin-left") ); -/* -Padding ************************************/ +/// Padding =========================================== $padding-helpers: ( // class name (prefix), property ("p-", "padding"), @@ -31,15 +30,13 @@ $padding-helpers: ( ("pl-", "padding-left") ); -/* -Font Weight ************************************/ +/// Font Weight ====================================== $font-weights: ( // class name (prefix), property "fw-": "font-weight" ); -/* -Font Size ************************************/ +/// Font Size ======================================== $font-sizes: ( // class name, value ("mini-text", 60%), @@ -51,36 +48,33 @@ $font-sizes: ( ("giant-text", 350%) ); -/* -Text Colors ************************************/ +/// Text Colors ====================================== $text-colors : ( // class name, value - ("color-grey", $main-grey-color), + ("color-grey", theme('color-grey')), ("color-white", white), ("color-black", black), - ("color-primary", $primary-color), - ("color-success", $success-color), - ("color-warning", $warning-color), - ("color-error", $error-color) + ("color-primary", theme('primary-color')), + ("color-success", theme('success-color')), + ("color-warning", theme('warning-color')), + ("color-error", theme('error-color')) ); -/* -Bg Colors ************************************/ +/// Bg Colors ======================================== $bg-colors : ( // class name, value - ("bg-grey", $main-grey-color), - ("bg-secondary", $main-secondary-bg), + ("bg-grey", theme('color-grey')), + ("bg-secondary", theme('color-secondary')), ("bg-white", white), - ("bg-black", $main-font-color), - ("bg-dark", $main-dark-color), - ("bg-primary", $primary-color), - ("bg-success", $success-color), - ("bg-warning", $warning-color), - ("bg-error", $error-color) + ("bg-black", black), + ("bg-dark", theme('color-dark')), + ("bg-primary", theme('primary-color')), + ("bg-success", theme('success-color')), + ("bg-warning", theme('warning-color')), + ("bg-error", theme('error-color')) ); -/* -Cursors ************************************/ +/// Cursors ========================================== $cursors: ( // class name, value ("cursor-alias", alias), @@ -94,8 +88,7 @@ $cursors: ( ("cursor-zoom-out", zoom-out) ); -/* -Display Properties ************************************/ +/// Display Properties =============================== $display-properties: ( // class name, value ("display-inline", inline), @@ -112,8 +105,7 @@ $display-properties: ( ("display-table-cell", table-cell) ); -/* -Alignment ************************************/ +/// Alignment ======================================== $align-items: ( // class name, value ("align-items-baseline", baseline), @@ -147,16 +139,14 @@ $justify-content: ( ("justify-content-inherit", inherit) ); -/* -Filters ************************************/ +/// Display Filters ================================== $display-filters: ( - // class name, value - ("filter-invert", invert(100%)), - ("filter-gray", grayscale(100%)) + // class name, property, value + ("filter-invert", "filter", invert(100%)), + ("filter-gray", "filter", grayscale(100%)), ); -/* -Text Transforms ************************************/ +/// Text Transforms ================================== $text-transforms: ( // class name, value ("text-uppercase", uppercase), @@ -164,8 +154,7 @@ $text-transforms: ( ("text-capitalize", capitalize) ); -/* -Overflow Properties ************************************/ +/// Overflow Properties ============================== $overflow-properties: ( // class name, property, value ("overflow-auto", "overflow", auto), @@ -181,8 +170,7 @@ $overflow-properties: ( ("overflow-y-scroll", "overflow-y", scroll) ); -/* -Position Properties ************************************/ +/// Position Properties ============================== $position-properties: ( // class name, value ("position-static", static), @@ -194,15 +182,13 @@ $position-properties: ( ("position-inherit", inherit) ); -/* -Stack Order (z-index) **********************************/ +/// Stack Order (z-index) ============================ $z-indexes: ( - // class name, property + // class name (prefix), property "z-": "z-index" ); -/* -Direction of the flexible items (flex-direction) *******/ +/// Direction of the flexible items (flex-direction) = $flex-directions: ( // class name, value ("flex-direction-row", row), @@ -213,8 +199,7 @@ $flex-directions: ( ("flex-direction-inherit", inherit) ); -/* -User Select **********************************/ +/// User Select ====================================== $user-selects: ( // class name, value ("user-select-none", none), @@ -223,8 +208,7 @@ $user-selects: ( ("user-select-all", all) ); -/* -Positioned Elements **************************/ +/// Positioned Elements ============================== $insets: ( // class name, [values] 'top'(0, auto), @@ -233,16 +217,20 @@ $insets: ( 'right'(0, auto), ); -/* -Line Height *********************************/ +/// Line Height ====================================== $line-heights: ( // class name (prefix), property "line-height-": "line-height" ); -/* -Border Radius *******************************/ +/// Border Radius ==================================== $border-radius: ( // class name (prefix), property "radius-": "border-radius" +); + +/// Backdrop Filters ================================= +$backdrops: ( + // class name (prefix), property + "backdrop-": "backdrop-filter" ); \ No newline at end of file diff --git a/src/_global/mixins.scss b/src/_global/mixins.scss index ce627cc9..ab1cd577 100644 --- a/src/_global/mixins.scss +++ b/src/_global/mixins.scss @@ -1,8 +1,12 @@ -/***************************************************** -*** GLOBAL MIXINS ************************************/ -/** - * - */ +///////////////////////////////////////////////////////// +/// GLOBAL MIXINS +///////////////////////////////////////////////////////// + +/// +/// Breakpoints +/// @param {Size} $size +/// @param {Size} $width +/// @mixin breakpoints( $size, $width: 'min-width' ) { @@ -11,21 +15,11 @@ } } -/** - * - */ -@mixin shadow( - $h-offset: 0, - $v-offset: 1px, - $blur: 5px, - $color: rgba(0, 0, 0, 0.15) -) { - box-shadow: $h-offset $v-offset $blur $color; -} - -/** - * - */ +/// +/// Media Group Specs +/// @param {String} $item-name +/// @param {Size} $padding +/// @mixin media-group-specs( $item-name, $padding: 1px ) { @@ -42,51 +36,11 @@ } } -/** - * - */ -@mixin set-size( - $font-size, $padding, $size-name: null -) { - @if $size-name { - &.#{$size-name} { - padding: $padding; - font-size: $font-size; - @content; - } - } @else { - padding: $padding; - font-size: $font-size; - @content; - } - -} - -/** - * - */ -@mixin set-style( - $bg-color, $color, $style-name: null -) { - @if $style-name { - &.#{$style-name} { - background-color: $bg-color; - color: $color; - @content; - } - } @else { - background-color: $bg-color; - color: $color; - @content; - } -} - -/** - * - */ +/// +/// Reference; +/// https://css-tricks.com/fluid-width-video/ +/// @mixin embedded-media { - // References; - // https://css-tricks.com/fluid-width-video/ position: relative; padding-bottom: 56.25% !important; height: 0; diff --git a/src/_global/variables.scss b/src/_global/variables.scss index 45bdf202..b7a7e730 100644 --- a/src/_global/variables.scss +++ b/src/_global/variables.scss @@ -1,67 +1,36 @@ -/***************************************************** -*** GLOBAL DEFINITIONS ******************************/ +///////////////////////////////////////////////////////// +/// GLOBAL DEFINITIONS +///////////////////////////////////////////////////////// -/***************************************************** -FONT *************************************************/ +/// +/// TYPOGRAPHY +/// @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;900&display=swap'); -/***************************************************** -TYPOGRAPHY *******************************************/ -$main-font-family : 'Nunito', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; -$main-font-weight : 400; -$main-font-size : 13px; -$main-line-height : 1.7; -$main-title-weight : 900; +$main-font-family : 'Nunito', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !default; +$main-font-weight : 400 !default; +$main-font-size : 13px !default; +$main-line-height : 1.7 !default; +$main-title-weight : 900 !default; -/***************************************************** -BASE COLORS ******************************************/ -$main-bg : white; -$main-secondary-bg : #e6e6e6; // Platinum -$main-font-color : #3f4143; // Onyx -$main-invert-color : white; -$main-grey-color : #77878b; // Light Slate Gray -$main-dark-color : #414552; // Charcoal -$main-striped-bg : #f0f0f0; // Cultured -$main-hovered-bg : $main-striped-bg; - -/***************************************************** -THEME COLORS *****************************************/ -$primary-color : #0a8fff; // Dodger Blue -$success-color : #2ec4b6; // Tiffany Blue -$warning-color : #de9e36; // Marigold -$error-color : #d62828; // Maximum Red - -/***************************************************** -BORDER ***********************************************/ -$main-border-width : 1px; -$main-border-style : solid; -$main-border-color : #c6c6c6; // Silver Sand -$main-border-radius : 4px; - -/***************************************************** -SCROLLBAR ********************************************/ -$scrollbar-width : 6px; -$scrollbar-bg : $main-secondary-bg; -$scrollbar-color : $main-dark-color; - -/***************************************************** -MAIN GRID NAMING -It's used in card, form and timeline. -******************************************************/ +/// +/// MAIN GRID NAMING +/// It's used in card, form and some of mixins. +/// $grids: ( - //"one": "1", - "two": "2", - "three": "3", - "four": "4", - "five": "5", - "six": "6", - "seven": "7", - "eight": "8", - "nine": "9", - "ten": "10", - "eleven": "11", - "twelve": "12", - "thirteen": "13", - "fourteen": "14", - "fifteen": "15", - "sixteen": "16" + //"one" : "1", + "two" : "2", + "three" : "3", + "four" : "4", + "five" : "5", + "six" : "6", + "seven" : "7", + "eight" : "8", + "nine" : "9", + "ten" : "10", + "eleven" : "11", + "twelve" : "12", + "thirteen" : "13", + "fourteen" : "14", + "fifteen" : "15", + "sixteen" : "16" ); diff --git a/src/_themes/_getters.scss b/src/_themes/_getters.scss new file mode 100644 index 00000000..561c7d4e --- /dev/null +++ b/src/_themes/_getters.scss @@ -0,0 +1,22 @@ +///////////////////////////////////////////////////////// +/// THEME GETTERS +///////////////////////////////////////////////////////// + +/// +/// Get Active Theme +/// @param {String} $theme +/// +@mixin get-theme($theme: $active-theme) { + $current-theme : map-get($punica-themes, $theme); + $theme-map: $current-theme !global; + @content; + $theme-map: null !global; +} + +/// +/// Get active theme's value by key +/// @param {String} $key +/// +@function theme($key) { + @return map-get($theme-map, $key); +} \ No newline at end of file diff --git a/src/_themes/_setters.scss b/src/_themes/_setters.scss new file mode 100644 index 00000000..6fb62679 --- /dev/null +++ b/src/_themes/_setters.scss @@ -0,0 +1,90 @@ +///////////////////////////////////////////////////////// +/// THEME SETTERS +///////////////////////////////////////////////////////// + +/// +/// Shadow +/// @param {Size} $h-offset - Horizontal offset +/// @param {Size} $v-offset - Vertical offset +/// @param {Size} $blur - Blur +/// @param {Color} $color - Color +/// @param {Boolean|String} $inset - Inset +/// +@mixin shadow( + $h-offset: theme('shadow-horizontal'), + $v-offset: theme('shadow-vertical'), + $blur: theme('shadow-blur'), + $color: theme('shadow-color'), + $inset: "" +) { + @if ($inset != "") { + box-shadow: $inset $h-offset $v-offset $blur $color; + } @else { + box-shadow: $h-offset $v-offset $blur $color; + } + @content; +} + +/// +/// Border +/// @param {Size} $width - Border width +/// @param {String} $style - Border style +/// @param {Color} $color - Border color +/// @param {Boolean} $specificity - Specificity +/// +@mixin border( + $width: theme('border-width'), + $style: theme('border-style'), + $color: theme('border-color'), + $specificity: false +) { + @if $specificity { + border: $width $style $color !important; + } @else { + border: $width $style $color; + } + @content; +} + +/// +/// @param {Size} $font-size +/// @param {Integer} $padding +/// @param {String|Boolean} $size-name +/// +@mixin set-size( + $font-size, $padding, $size-name: null +) { + @if $size-name { + &.#{$size-name} { + padding: $padding; + font-size: $font-size; + @content; + } + } @else { + padding: $padding; + font-size: $font-size; + @content; + } + +} + +/// +/// @param {Color} $bg-color +/// @param {Color} $color +/// @param {String|Boolean} $style-name +/// +@mixin set-style( + $bg-color, $color, $style-name: null +) { + @if $style-name { + &.#{$style-name} { + background-color: $bg-color; + color: $color; + @content; + } + } @else { + background-color: $bg-color; + color: $color; + @content; + } +} \ No newline at end of file diff --git a/src/_themes/index.scss b/src/_themes/index.scss new file mode 100644 index 00000000..28a62bb7 --- /dev/null +++ b/src/_themes/index.scss @@ -0,0 +1,139 @@ +///////////////////////////////////////////////////////// +/// PUNICA CSS > THEMES +///////////////////////////////////////////////////////// +@import "_getters"; + +/// +/// +/// +$punica-themes: ( + /// + /// Default Theme + /// + light: ( + /////////////////////////////////////////////////////////// + 'primary-color' : #0a8fff, + 'success-color' : #2ec4b6, + 'warning-color' : #de9e36, + 'error-color' : #d62828, + /////////////////////////////////////////////////////////// + 'background-color' : white, + 'text-color' : #3f4143, + // + 'color-active' : #dcdcdc, + 'color-negative' : white, + 'color-grey' : #a8a8a8, + 'color-secondary' : #e6e6e6, + 'color-dark' : #26272b, + /////////////////////////////////////////////////////////// + // border + 'border-color' : #c6c6c6, + 'border-width' : 1px, + 'border-style' : solid, + 'border-radius' : 4px, + /////////////////////////////////////////////////////////// + /// shadow + 'shadow-horizontal' : 0, + 'shadow-vertical' : 1px, + 'shadow-blur' : 5px, + 'shadow-color' : rgba(0, 0, 0, 0.15), + /////////////////////////////////////////////////////////// + // inputs + 'input-bg' : white, + 'input-color' : #3f4143, + 'input-border-color' : #c6c6c6, + 'input-outline-color' : #26272b, + 'input-outline-width' : 2px, + /////////////////////////////////////////////////////////// + // secondary button + 'button-secondary-bg' : linear-gradient(to top, #e6e6e6 0%,#ffffff 100%), + 'button-secondary-bg-hover' : linear-gradient(to top, #ffffff 0%,#e6e6e6 100%) + ), + /// + /// Dark Theme + /// + dark: ( + /////////////////////////////////////////////////////////// + 'primary-color' : #10a6fa, + 'success-color' : #2abc90, + 'warning-color' : #b78343, + 'error-color' : #d84955, + /////////////////////////////////////////////////////////// + 'background-color' : #26272b, + 'text-color' : white, + // + 'color-active' : lighten(#26272b, 3.7%), + 'color-negative' : white, + 'color-grey' : #6c6e79, + 'color-secondary' : #2b2d2f, + 'color-dark' : lighten(#26272b, 8.5%), + /////////////////////////////////////////////////////////// + // border + 'border-color' : lighten(#26272b, 23%), + 'border-width' : 1px, + 'border-style' : solid, + 'border-radius' : 4px, + /////////////////////////////////////////////////////////// + /// shadow + 'shadow-horizontal' : 0, + 'shadow-vertical' : 4px, + 'shadow-blur' : 8px, + 'shadow-color' : rgba(0, 0, 0, 0.2), + /////////////////////////////////////////////////////////// + // inputs + 'input-bg' : lighten(#26272b, 8.5%), + 'input-color' : white, + 'input-border-color' : lighten(#26272b, 26%), + "input-outline-color" : white, + 'input-outline-width' : 2px, + /////////////////////////////////////////////////////////// + // secondary button + 'button-secondary-bg' : linear-gradient(to top, #202125 0%,#26272b 100%), + 'button-secondary-bg-hover' : linear-gradient(to top, #26272b 0%,#202125 100%) + ), + /// + /// Custom Theme + /// Apply your own color schema + /// + /* + custom: ( + /////////////////////////////////////////////////////////// + 'primary-color' : , + 'success-color' : , + 'warning-color' : , + 'error-color' : , + /////////////////////////////////////////////////////////// + 'background-color' : , + 'text-color' : , + // + 'color-active' : , + 'color-negative' : , + 'color-grey' : , + 'color-secondary' : , + 'color-dark' : , + /////////////////////////////////////////////////////////// + // border + 'border-color' : , + 'border-width' : , + 'border-style' : , + 'border-radius' : , + /////////////////////////////////////////////////////////// + /// shadow + 'shadow-horizontal' : , + 'shadow-vertical' : , + 'shadow-blur' : , + 'shadow-color' : , + /////////////////////////////////////////////////////////// + // inputs + 'input-bg' : , + 'input-color' : , + 'input-border-color' : , + "input-outline-color" : , + 'input-outline-width' : , + /////////////////////////////////////////////////////////// + // button + 'button-secondary-bg' : , + 'button-secondary-bg-hover' : + ), + */ +); \ No newline at end of file diff --git a/src/options.scss b/src/options.scss new file mode 100644 index 00000000..96e5f3c6 --- /dev/null +++ b/src/options.scss @@ -0,0 +1,115 @@ +///////////////////////////////////////////////////////// +/// LAYOUT +///////////////////////////////////////////////////////// + $layout-grid : true; + /**/$layout-grid-equal : true; + /**/$layout-grid-offset : true; // [!] increases the size + +///////////////////////////////////////////////////////// +/// COMPONENTS +///////////////////////////////////////////////////////// + +/// ALERT ============================================= + $components-alert : true; + /**/$components-alert-styles : true; + /**/$components-alert-sizes : true; + +/// BADGE ============================================= + $components-badge : true; + /**/$components-badge-styles : true; + /**/$components-badge-sizes : true; + +/// BILLBOARD ========================================= + $components-billboard : true; + /**/$components-billboard-styles : true; + /**/$components-billboard-sizes : true; + /**/$components-billboard-cover : true; + +/// BREADCRUMB ======================================== + $components-breadcrumb : true; + /**/$components-breadcrumb-sizes : true; + +/// CARD ============================================== + $components-card : true; + /**/$components-card-groups : true; + /**/$components-card-horizontal : true; + /**/$components-card-media : true; + /**//**/$components-card-media-group : true; + +/// LIST ============================================== + $components-list : true; + /**/$components-list-divided : true; + /**/$components-list-hovered : true; + /**/$components-list-striped : true; + +/// MENU ============================================== + $components-menu : true; + +/// NAVBAR ============================================ + $components-navbar : true; + /**/$components-navbar-themes : true; + +/// PANEL ============================================= + $components-panel : true; + /**/$components-panel-media : true; + /**//**/$components-panel-media-group : true; + +/// PROCESS =========================================== + $components-process : true; + /**/$components-process-styles : true; + /**/$components-process-vertical : true; + +/// PROGRESS ========================================== + $components-progress : true; + /**/$components-progress-styles : true; + +/// TABNAV ============================================ + $components-tabnav : true; + /**/$components-tabnav-styles : true; + +/// TIMELINE ========================================== + $components-timeline : true; + /**/$components-timeline-styles : true; + /**/$components-timeline-media : true; + /**//**/$components-timeline-media-group : true; + +/// TOOLTIP =========================================== + $components-tooltip : true; + +///////////////////////////////////////////////////////// +/// ELEMENTS +///////////////////////////////////////////////////////// + +/// Button ============================================ + $elements-button : true; + /**/$elements-button-group : true; + /**/$elements-button-group-vertical : true; + /**/$elements-button-styles : true; + /**/$elements-button-sizes : true; + /**/$elements-button-secondary : true; + /**/$elements-button-dropdown : true; + +/// Form ============================================== + $elements-form : true; + /**/$elements-form-group : true; + /**/$elements-form-input-sizes : true; + /**/$elements-form-validation-styles : true; + /**/$elements-form-checkbox-radio : true; + +/// Icon ============================================== + $elements-icon : true; + +/// Table ============================================= + $elements-table : true; + /**/$elements-table-hovered : true; + /**/$elements-table-striped : true; + +/// Label ============================================= + $elements-label : true; + /**/$elements-label-styles : true; + /**/$elements-label-sizes : true; + +///////////////////////////////////////////////////////// +/// UTILITIES +///////////////////////////////////////////////////////// + $helpers : true; \ No newline at end of file diff --git a/src/punica.scss b/src/punica.scss index a5275a08..f22291c4 100644 --- a/src/punica.scss +++ b/src/punica.scss @@ -1,130 +1,31 @@ -/***************************************************** -PUNICA CSS -https://github.com/codeforms/Punica-CSS-Framework -****************************************************** -DEFAULT SETUP PREFERENCES -******************************************************/ +///////////////////////////////////////////////////////// +/// PUNICA CSS +///////////////////////////////////////////////////////// -/***************************************************** -LAYOUT ***********************************************/ -$layout-grid : true; -/**/$layout-grid-equal : true; -/**/$layout-grid-offset : true; // [!] increases the size +/// Active Theme ======================================== +$active-theme: dark; // light, dark -/***************************************************** -COMPONENTS *******************************************/ -/* Alert ===========================================*/ -$components-alert : true; -/**/$components-alert-styles : true; -/**/$components-alert-sizes : true; +/// Options ============================================= +@import "options"; -/* Badge ===========================================*/ -$components-badge : true; -/**/$components-badge-styles : true; -/**/$components-badge-sizes : true; +/// Themes ============================================== +@import "_themes/index"; -/* Billboard =======================================*/ -$components-billboard : true; -/**/$components-billboard-styles : true; -/**/$components-billboard-sizes : true; -/**/$components-billboard-cover : true; - -/* Breadcrumb ======================================*/ -$components-breadcrumb : true; -/**/$components-breadcrumb-sizes : true; - -/* Card ============================================*/ -$components-card : true; -/**/$components-card-groups : true; -/**/$components-card-horizontal : true; -/**/$components-card-media : true; -/**//**/$components-card-media-group : true; - -/* List ============================================*/ -$components-list : true; -/**/$components-list-divided : true; -/**/$components-list-hovered : true; -/**/$components-list-striped : true; - -/* Menu ============================================*/ -$components-menu : true; - -/* Navbar ==========================================*/ -$components-navbar : true; -/**/$components-navbar-themes : true; - -/* Panel ===========================================*/ -$components-panel : true; -/**/$components-panel-media : true; -/**//**/$components-panel-media-group : true; - -/* Process =========================================*/ -$components-process : true; -/**/$components-process-styles : true; -/**/$components-process-vertical : true; - -/* Progress =========================================*/ -$components-progress : true; -/**/$components-progress-styles : true; - -/* Tabnav ===========================================*/ -$components-tabnav : true; -/**/$components-tabnav-styles : true; - -/* Timeline =========================================*/ -$components-timeline : true; -/**/$components-timeline-styles : true; -/**/$components-timeline-media : true; -/**//**/$components-timeline-media-group : true; - -/* Tooltip ==========================================*/ -$components-tooltip : true; - -/***************************************************** -ELEMENTS *********************************************/ -/* Button ===========================================*/ -$elements-button : true; -/**/$elements-button-group : true; -/**/$elements-button-group-vertical : true; -/**/$elements-button-styles : true; -/**/$elements-button-sizes : true; -/**/$elements-button-secondary : true; -/**/$elements-button-dropdown : true; - -/* Form =============================================*/ -$elements-form : true; -/**/$elements-form-group : true; -/**/$elements-form-input-sizes : true; -/**/$elements-form-validation-styles : true; -/**/$elements-form-checkbox-radio : true; - -/* Icon =============================================*/ -$elements-icon : true; - -/* Table ============================================*/ -$elements-table : true; -/**/$elements-table-hovered : true; -/**/$elements-table-striped : true; - -/* Label ============================================*/ -$elements-label : true; -/**/$elements-label-styles : true; -/**/$elements-label-sizes : true; - -/***************************************************** -UTILITIES ********************************************/ -$helpers : true; - -/***************************************************** -LAUNCHER *********************************************/ -@import "_global/variables"; +/// Global Mixins & Variables =========================== @import "_global/mixins"; -@import "Layout/variables"; -@import "Elements/variables"; -@import "Components/variables"; -@import "Utilities/variables"; -/**/ -@import "Layout/index"; -@import "Elements/index"; -@import "Components/index"; -@import "Utilities/helpers"; +@import "_global/variables"; + +/// Active Theme ======================================== +@include get-theme() { + @import "_themes/_setters"; + /// + @import "Layout/variables"; + @import "Elements/variables"; + @import "Components/variables"; + @import "Utilities/variables"; + /// + @import "Layout/index"; + @import "Elements/index"; + @import "Components/index"; + @import "Utilities/helpers"; +}