mirror of
https://github.com/locomotivemtl/locomotive-boilerplate.git
synced 2026-01-15 00:55:08 +08:00
1 line
13 KiB
CSS
1 line
13 KiB
CSS
:root{--grid-columns: 4;--grid-gutter: 0.625rem;--grid-gutter-half: calc(0.5 * var(--grid-gutter));--grid-margin: 0.625rem;--container-width: calc(100% - 2 * var(--grid-margin));--font-size-h1: 2.25rem;--font-size-h2: 1.75rem;--font-size-h3: 1.5rem;--font-size-h4: 1.25rem;--font-size-h5: 1.125rem;--font-size-h6: 1rem}@media(min-width: 700px){:root{--grid-columns: 12;--grid-gutter: 1rem;--grid-margin: 1.25rem}}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}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}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html{box-sizing:border-box}template,[hidden]{display:none}*,:before,:after{box-sizing:inherit}address{font-style:inherit}dfn,cite,em,i{font-style:italic}b,strong{font-weight:700}a{text-decoration:none}a svg{pointer-events:none}ul,ol{margin:0;padding:0;list-style:none}p,figure{margin:0;padding:0}h1,h2,h3,h4,h5,h6{margin:0}a,area,button,input,label,select,textarea,[tabindex]{touch-action:manipulation}[hreflang]>abbr[title]{text-decoration:none}table{border-spacing:0;border-collapse:collapse}hr{display:block;margin:1em 0;padding:0;height:1px;border:0;border-top:1px solid #ccc}audio,canvas,iframe,img,svg,video{vertical-align:middle}audio:not([controls]){display:none;height:0}img,svg{max-width:100%;height:auto}img[width],img[height],svg[width],svg[height]{max-width:none}img{font-style:italic}svg{fill:currentColor}input,select,textarea{display:block;margin:0;padding:0;width:100%;outline:0;border:0;border-radius:0;background:none rgba(0,0,0,0);color:inherit;font:inherit;line-height:normal;-webkit-appearance:none;-moz-appearance:none;appearance:none}select{text-transform:none}select::-ms-expand{display:none}select::-ms-value{background:none;color:inherit}textarea{overflow:auto;resize:vertical}button,.c-button{display:inline-block;overflow:visible;margin:0;padding:0;outline:0;border:0;background:none rgba(0,0,0,0);color:inherit;vertical-align:middle;text-align:center;text-decoration:none;text-transform:none;font:inherit;line-height:normal;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}button:focus,button:hover,.c-button:focus,.c-button:hover{text-decoration:none}@font-face{font-display:swap;font-family:"Source Sans";src:url("../fonts/SourceSans3-Bold.woff2") format("woff2"),url("../fonts/SourceSans3-Bold.woff") format("woff");font-weight:700;font-style:normal}@font-face{font-display:swap;font-family:"Source Sans";src:url("../fonts/SourceSans3-BoldIt.woff2") format("woff2"),url("../fonts/SourceSans3-BoldIt.woff") format("woff");font-weight:700;font-style:italic}@font-face{font-display:swap;font-family:"Source Sans";src:url("../fonts/SourceSans3-Regular.woff2") format("woff2"),url("../fonts/SourceSans3-Regular.woff") format("woff");font-weight:400;font-style:normal}@font-face{font-display:swap;font-family:"Source Sans";src:url("../fonts/SourceSans3-RegularIt.woff2") format("woff2"),url("../fonts/SourceSans3-RegularIt.woff") format("woff");font-weight:400;font-style:italic}html{min-height:100%;line-height:1.5;font-family:"Source Sans",-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif;color:#000;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(max-width: 699px){html{font-size:14px}}@media(min-width: 700px)and (max-width: 999px){html{font-size:14px}}@media(min-width: 1000px)and (max-width: 1199px){html{font-size:15px}}@media(min-width: 1200px)and (max-width: 1599px){html{font-size:16px}}@media(min-width: 1600px)and (max-width: 1999px){html{font-size:17px}}@media(min-width: 2000px)and (max-width: 2399px){html{font-size:18px}}@media(min-width: 2400px){html{font-size:20px}}html.is-loading{cursor:wait}html.has-scroll-smooth{overflow:hidden;position:fixed;left:0;top:0;height:100%;width:100%}html.has-scroll-dragging{-webkit-user-select:none;-moz-user-select:none;user-select:none}.has-scroll-smooth body{overflow:hidden}::-moz-selection{background-color:#fff;color:#3297fd;text-shadow:none}::selection{background-color:#fff;color:#3297fd;text-shadow:none}a{color:#1a0dab}a:focus,a:hover{color:#13097c}.o-scroll{min-height:100vh}.o-container{margin-right:auto;margin-left:auto;padding-left:var(--grid-margin);padding-right:var(--grid-margin)}.o-ratio{position:relative;display:block;overflow:hidden}.o-ratio:before{display:block;padding-bottom:100%;width:100%;content:""}.o-ratio_content,.o-ratio>img,.o-ratio>iframe,.o-ratio>embed,.o-ratio>object{position:absolute;top:0;bottom:0;left:0;width:100%}.o-icon{display:inline-block;vertical-align:middle}.o-icon svg{--icon-height: calc(var(--icon-width) * (1 / (var(--icon-ratio))));display:block;width:var(--icon-width);height:var(--icon-height);fill:currentColor}.o-grid{display:grid;width:100%}.o-grid:is(ul,ol){margin:0;padding:0;list-style:none}.o-grid.-cols{grid-template-columns:repeat(var(--grid-columns), 1fr)}.o-grid.-col-12{grid-template-columns:repeat(12, 1fr)}.o-grid.-col-4{grid-template-columns:repeat(4, 1fr)}@media(min-width: 1000px){.o-grid.-col-12\@from-medium{grid-template-columns:repeat(12, 1fr)}}.o-grid.-gutters{gap:var(--grid-gutter);-moz-column-gap:var(--grid-gutter);column-gap:var(--grid-gutter)}.o-grid.-full-height{height:100%}.o-grid.-top-items{align-items:start}.o-grid.-right-items{justify-items:end}.o-grid.-bottom-items{align-items:end}.o-grid.-left-items{justify-items:start}.o-grid.-center-items{align-items:center;justify-items:center}.o-grid.-center-items-x{justify-items:center}.o-grid.-center-items-y{align-items:center}.o-grid.-stretch-items{align-items:stretch;justify-items:stretch}.o-grid.-top-cells{align-content:start}.o-grid.-right-cells{justify-content:end}.o-grid.-bottom-cells{align-content:end}.o-grid.-left-cells{justify-content:start}.o-grid.-center-cells{align-content:center;justify-content:center}.o-grid.-center-cells-x{justify-content:center}.o-grid.-center-cells-y{align-content:center}.o-grid.-stretch-cells{align-content:stretch;justify-content:stretch}.o-grid.-space-around-cells{align-content:space-around;justify-content:space-around}.o-grid.-space-around-cells-x{justify-content:space-around}.o-grid.-space-around-cells-y{align-content:space-around}.o-grid.-space-between-cells{justify-content:space-between;align-content:space-between}.o-grid.-space-between-cells-x{justify-content:space-between}.o-grid.-space-between-cells-y{align-content:space-between}.o-grid.-space-evenly-cells{justify-content:space-evenly;align-content:space-evenly}.o-grid.-space-evenly-cells-x{justify-content:space-evenly}.o-grid.-space-evenly-cells-y{align-content:space-evenly}.o-grid_item{grid-column-start:var(--gc-start, 1);grid-column-end:var(--gc-end, -1)}.o-grid_item.-align-end{align-self:end}.c-scrollbar{position:absolute;right:0;top:0;width:11px;height:100vh;transform-origin:center right;transition:transform .3s,opacity .3s;opacity:0}.c-scrollbar:hover{transform:scaleX(1.45)}.c-scrollbar:hover,.has-scroll-scrolling .c-scrollbar,.has-scroll-dragging .c-scrollbar{opacity:1}.c-scrollbar_thumb{position:absolute;top:0;right:0;background-color:#000;opacity:.5;width:7px;border-radius:10px;margin:2px;cursor:grab}.has-scroll-dragging .c-scrollbar_thumb{cursor:grabbing}.c-heading{margin-bottom:1.875rem}.c-heading.-h1{font-size:var(--font-size-h1)}.c-heading.-h2{font-size:var(--font-size-h2)}.c-heading.-h3{font-size:var(--font-size-h3)}.c-heading.-h4{font-size:var(--font-size-h4)}.c-heading.-h5{font-size:var(--font-size-h5)}.c-heading.-h6{font-size:var(--font-size-h6)}.c-button{padding:.9375rem 1.25rem;background-color:#d3d3d3}.c-button:focus,.c-button:hover{background-color:#a9a9a9}.c-form_item{position:relative;margin-bottom:1.875rem}.c-form_label,.c-form_checkboxLabel,.c-form_radioLabel{display:block;margin-bottom:.625rem}.c-form_input,.c-form_textarea,.c-form_select_input{padding:.625rem;border:1px solid #d3d3d3;background-color:#fff}.c-form_input:hover,.c-form_textarea:hover,.c-form_select_input:hover{border-color:#a9a9a9}.c-form_input:focus,.c-form_textarea:focus,.c-form_select_input:focus{border-color:dimgray}.c-form_input::-moz-placeholder, .c-form_textarea::-moz-placeholder, .c-form_select_input::-moz-placeholder{color:gray}.c-form_input::placeholder,.c-form_textarea::placeholder,.c-form_select_input::placeholder{color:gray}.c-form_checkboxLabel,.c-form_radioLabel{position:relative;display:inline-block;margin-right:.625rem;margin-bottom:0;padding-left:1.75rem;cursor:pointer}.c-form_checkboxLabel::before,.c-form_radioLabel::before,.c-form_checkboxLabel::after,.c-form_radioLabel::after{position:absolute;top:50%;left:0;display:inline-block;margin-top:-0.5625rem;padding:0;width:1.125rem;height:1.125rem;content:""}.c-form_checkboxLabel::before,.c-form_radioLabel::before{background-color:#fff;border:1px solid #d3d3d3}.c-form_checkboxLabel::after,.c-form_radioLabel::after{border-color:rgba(0,0,0,0);background-color:rgba(0,0,0,0);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2210.5%22%20viewBox%3D%220%200%2013%2010.5%22%20enable-background%3D%22new%200%200%2013%2010.5%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23424242%22%20d%3D%22M4.8%205.8L2.4%203.3%200%205.7l4.8%204.8L13%202.4c0%200-2.4-2.4-2.4-2.4L4.8%205.8z%22%2F%3E%3C%2Fsvg%3E");background-position:center;background-size:.75rem;background-repeat:no-repeat;opacity:0}.c-form_checkboxLabel:hover::before,.c-form_radioLabel:hover::before{border-color:#a9a9a9}.c-form_checkbox:focus+.c-form_checkboxLabel::before,.c-form_radio:focus+.c-form_checkboxLabel::before,.c-form_checkbox:focus+.c-form_radioLabel::before,.c-form_radio:focus+.c-form_radioLabel::before{border-color:dimgray}.c-form_checkbox:checked+.c-form_checkboxLabel::after,.c-form_radio:checked+.c-form_checkboxLabel::after,.c-form_checkbox:checked+.c-form_radioLabel::after,.c-form_radio:checked+.c-form_radioLabel::after{opacity:1}.c-form_checkbox,.c-form_radio{position:absolute;width:0;opacity:0}.c-form_radioLabel::before,.c-form_radioLabel::after{border-radius:50%}.c-form_radioLabel::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20enable-background%3D%22new%200%200%2013%2013%22%20xml%3Aspace%3D%22preserve%22%3E%3Ccircle%20fill%3D%22%23424242%22%20cx%3D%226.5%22%20cy%3D%226.5%22%20r%3D%226.5%22%2F%3E%3C%2Fsvg%3E");background-size:.375rem}.c-form_select{position:relative;cursor:pointer}.c-form_select::after{position:absolute;top:0;right:0;bottom:0;z-index:2;width:2.5rem;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2211.3%22%20viewBox%3D%220%200%2013%2011.3%22%20enable-background%3D%22new%200%200%2013%2011.3%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23424242%22%20points%3D%226.5%2011.3%203.3%205.6%200%200%206.5%200%2013%200%209.8%205.6%20%22%2F%3E%3C%2Fsvg%3E");background-position:center;background-size:.5rem;background-repeat:no-repeat;content:"";pointer-events:none}.c-form_select_input{position:relative;z-index:1;padding-right:2.5rem;cursor:pointer}.c-form_textarea{min-height:12.5rem}.u-2\:1::before{padding-bottom:50%}.u-4\:3::before{padding-bottom:75%}.u-16\:9::before{padding-bottom:56.25%}.u-gc-1\/3{--gc-start: 1;--gc-end: 3}@media(min-width: 1000px){.u-gc-1\/5\@from-medium{--gc-start: 1;--gc-end: 5}}@media(min-width: 1000px){.u-gc-1\/8\@from-medium{--gc-start: 1;--gc-end: 8}}@media(min-width: 1000px){.u-gc-5\/9\@from-medium{--gc-start: 5;--gc-end: 9}}@media(min-width: 1000px){.u-gc-5\/13\@from-medium{--gc-start: 5;--gc-end: 13}}@media(min-width: 1000px){.u-gc-9\/13\@from-medium{--gc-start: 9;--gc-end: 13}} |