.button.active{border-color:#3ea29d;background-color:#3ea29d;color:#fff;cursor:default}.button.active .ic svg{stroke:#fff}.button.active:hover,.button.active:focus,.button.active:active{border-color:#3ea29d;background-color:#3ea29d}.gbf-buttons{display:grid;grid-template-columns:repeat(5, auto) 1fr auto;column-gap:5px}.gbf-buttons-scss,.gbf-buttons-css{justify-self:end}.gbf-code{display:none;position:fixed;z-index:105;top:0;left:0;right:0;bottom:0;background-color:rgba(255,255,255,.9)}.gbf-code.active{display:block}.gbf-code-inner{display:grid;grid-template-rows:auto 1fr;position:absolute;top:50%;left:50%;width:800px;height:600px;max-width:90vw;max-height:90vh;padding:20px;background-color:#fff;border:1px solid #dedede;border-radius:4px;transform:translate(-50%, -50%)}.gbf-code-close{position:absolute;top:20px;right:20px}.gbf-code-code{overflow-y:auto}.gbf-viewer-contain{display:flex;justify-content:center;align-items:flex-start}.gbf-viewer-contain-inner{position:relative;width:100%}[data-mode=phone-portrait] .gbf-viewer-contain-inner{width:490px}[data-mode=phone-landscape] .gbf-viewer-contain-inner{width:700px}[data-mode=tablet-portrait] .gbf-viewer-contain-inner{width:820px}[data-mode=tablet-landscape] .gbf-viewer-contain-inner{width:1180px}.gbf-viewer{position:relative;width:100%;height:0;padding-top:56%;border:1px solid #dedede;border-radius:4px;overflow:hidden}[data-mode=phone-portrait] .gbf-viewer{padding-top:180%}[data-mode=phone-landscape] .gbf-viewer{padding-top:46%}[data-mode=tablet-portrait] .gbf-viewer{padding-top:125%}[data-mode=tablet-landscape] .gbf-viewer{padding-top:56%}.gbf-viewer iframe{position:absolute;top:0;left:0;width:100%;height:100%}.gbf-body{background-color:#fff}.gbf-grid{display:grid;grid-template-columns:repeat(12, 1fr);gap:20px;width:100%;padding-top:30px}.gbf-grid>*{align-self:start;grid-column:auto/span 3}.gbf-grid fieldset{display:grid;grid-template-columns:1fr;position:relative;border-radius:4px;background-color:#ededed;cursor:pointer}.gbf-grid fieldset label{padding:5px 10px;text-transform:uppercase;font-size:1.3rem;font-weight:500}.gbf-grid fieldset input,.gbf-grid fieldset textarea{width:100%;padding:5px 10px 10px;background:none;border-width:0;font-family:monospace;font-size:1.6rem;line-height:1.25}.gbf-grid fieldset textarea{min-height:calc(1.6rem * 1.25 * 8)}.gbf-grid-mode{position:fixed;z-index:100;top:0;left:0;width:100%;height:50px;padding:10px 20px;line-height:30px;font-weight:300;font-size:24px;background-color:rgba(255,255,255,.9)}.gbf-grid-mode::after{content:"Phone (portrait)";font-weight:500}.gbf-grid .gbf-grid-col-1{grid-column-end:span 1}.gbf-grid .gbf-grid-col-2{grid-column-end:span 2}.gbf-grid .gbf-grid-col-3{grid-column-end:span 3}.gbf-grid .gbf-grid-col-4{grid-column-end:span 4}.gbf-grid .gbf-grid-col-5{grid-column-end:span 5}.gbf-grid .gbf-grid-col-6{grid-column-end:span 6}.gbf-grid .gbf-grid-col-7{grid-column-end:span 7}.gbf-grid .gbf-grid-col-8{grid-column-end:span 8}.gbf-grid .gbf-grid-col-9{grid-column-end:span 9}.gbf-grid .gbf-grid-col-10{grid-column-end:span 10}.gbf-grid .gbf-grid-col-11{grid-column-end:span 11}.gbf-grid .gbf-grid-col-12{grid-column-end:span 12}.gbf-grid .gbf-grid-col-last+*{grid-column-start:1}@media all and (min-width: 500px){.gbf-grid-mode::after{content:"Phone (landscape)"}.gbf-grid .gbf-grid-pl-col-1{grid-column-end:span 1}.gbf-grid .gbf-grid-pl-col-2{grid-column-end:span 2}.gbf-grid .gbf-grid-pl-col-3{grid-column-end:span 3}.gbf-grid .gbf-grid-pl-col-4{grid-column-end:span 4}.gbf-grid .gbf-grid-pl-col-5{grid-column-end:span 5}.gbf-grid .gbf-grid-pl-col-6{grid-column-end:span 6}.gbf-grid .gbf-grid-pl-col-7{grid-column-end:span 7}.gbf-grid .gbf-grid-pl-col-8{grid-column-end:span 8}.gbf-grid .gbf-grid-pl-col-9{grid-column-end:span 9}.gbf-grid .gbf-grid-pl-col-10{grid-column-end:span 10}.gbf-grid .gbf-grid-pl-col-11{grid-column-end:span 11}.gbf-grid .gbf-grid-pl-col-12{grid-column-end:span 12}.gbf-grid .gbf-grid-pl-col-last+*{grid-column-start:1}.gbf-grid .gbf-grid-pl-col-nolast+*{grid-column-start:auto}}@media all and (min-width: 768px){.gbf-grid-mode::after{content:"Tablet (portrait)"}.gbf-grid .gbf-grid-tp-col-1{grid-column-end:span 1}.gbf-grid .gbf-grid-tp-col-2{grid-column-end:span 2}.gbf-grid .gbf-grid-tp-col-3{grid-column-end:span 3}.gbf-grid .gbf-grid-tp-col-4{grid-column-end:span 4}.gbf-grid .gbf-grid-tp-col-5{grid-column-end:span 5}.gbf-grid .gbf-grid-tp-col-6{grid-column-end:span 6}.gbf-grid .gbf-grid-tp-col-7{grid-column-end:span 7}.gbf-grid .gbf-grid-tp-col-8{grid-column-end:span 8}.gbf-grid .gbf-grid-tp-col-9{grid-column-end:span 9}.gbf-grid .gbf-grid-tp-col-10{grid-column-end:span 10}.gbf-grid .gbf-grid-tp-col-11{grid-column-end:span 11}.gbf-grid .gbf-grid-tp-col-12{grid-column-end:span 12}.gbf-grid .gbf-grid-tp-col-last+*{grid-column-start:1}.gbf-grid .gbf-grid-tp-col-nolast+*{grid-column-start:auto}}@media all and (min-width: 992px){.gbf-grid-mode::after{content:"Tablet (landscape)"}.gbf-grid .gbf-grid-tl-col-1{grid-column-end:span 1}.gbf-grid .gbf-grid-tl-col-2{grid-column-end:span 2}.gbf-grid .gbf-grid-tl-col-3{grid-column-end:span 3}.gbf-grid .gbf-grid-tl-col-4{grid-column-end:span 4}.gbf-grid .gbf-grid-tl-col-5{grid-column-end:span 5}.gbf-grid .gbf-grid-tl-col-6{grid-column-end:span 6}.gbf-grid .gbf-grid-tl-col-7{grid-column-end:span 7}.gbf-grid .gbf-grid-tl-col-8{grid-column-end:span 8}.gbf-grid .gbf-grid-tl-col-9{grid-column-end:span 9}.gbf-grid .gbf-grid-tl-col-10{grid-column-end:span 10}.gbf-grid .gbf-grid-tl-col-11{grid-column-end:span 11}.gbf-grid .gbf-grid-tl-col-12{grid-column-end:span 12}.gbf-grid .gbf-grid-tl-col-last+*{grid-column-start:1}.gbf-grid .gbf-grid-tl-col-nolast+*{grid-column-start:auto}}@media all and (min-width: 1200px){.gbf-grid-mode::after{content:"Desktop"}.gbf-grid .gbf-grid-d-col-1{grid-column-end:span 1}.gbf-grid .gbf-grid-d-col-2{grid-column-end:span 2}.gbf-grid .gbf-grid-d-col-3{grid-column-end:span 3}.gbf-grid .gbf-grid-d-col-4{grid-column-end:span 4}.gbf-grid .gbf-grid-d-col-5{grid-column-end:span 5}.gbf-grid .gbf-grid-d-col-6{grid-column-end:span 6}.gbf-grid .gbf-grid-d-col-7{grid-column-end:span 7}.gbf-grid .gbf-grid-d-col-8{grid-column-end:span 8}.gbf-grid .gbf-grid-d-col-9{grid-column-end:span 9}.gbf-grid .gbf-grid-d-col-10{grid-column-end:span 10}.gbf-grid .gbf-grid-d-col-11{grid-column-end:span 11}.gbf-grid .gbf-grid-d-col-12{grid-column-end:span 12}.gbf-grid .gbf-grid-d-col-last+*{grid-column-start:1}.gbf-grid .gbf-grid-d-col-nolast+*{grid-column-start:auto}}