_base.scss
1 /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ 2 3 /* Document 4 ========================================================================== */ 5 6 /** 7 * 1. Correct the line height in all browsers. 8 * 2. Prevent adjustments of font size after orientation changes in iOS. 9 */ 10 11 html { 12 line-height: 1.15; /* 1 */ 13 -webkit-text-size-adjust: 100%; /* 2 */ 14 } 15 16 /* Sections 17 ========================================================================== */ 18 19 /** 20 * Remove the margin in all browsers. 21 */ 22 23 body { 24 margin: 0; 25 } 26 27 /** 28 * Render the `main` element consistently in IE. 29 */ 30 31 main { 32 display: block; 33 } 34 35 /** 36 * Correct the font size and margin on `h1` elements within `section` and 37 * `article` contexts in Chrome, Firefox, and Safari. 38 */ 39 40 h1 { 41 font-size: 2em; 42 margin: 0.67em 0; 43 } 44 45 /* Grouping content 46 ========================================================================== */ 47 48 /** 49 * 1. Add the correct box sizing in Firefox. 50 * 2. Show the overflow in Edge and IE. 51 */ 52 53 hr { 54 box-sizing: content-box; /* 1 */ 55 height: 0; /* 1 */ 56 overflow: visible; /* 2 */ 57 } 58 59 /** 60 * 1. Correct the inheritance and scaling of font size in all browsers. 61 * 2. Correct the odd `em` font sizing in all browsers. 62 */ 63 64 pre { 65 font-family: monospace, monospace; /* 1 */ 66 font-size: 1em; /* 2 */ 67 } 68 69 /* Text-level semantics 70 ========================================================================== */ 71 72 /** 73 * Remove the gray background on active links in IE 10. 74 */ 75 76 a { 77 background-color: transparent; 78 } 79 80 /** 81 * 1. Remove the bottom border in Chrome 57- 82 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 83 */ 84 85 abbr[title] { 86 border-bottom: none; /* 1 */ 87 text-decoration: underline; /* 2 */ 88 text-decoration: underline dotted; /* 2 */ 89 } 90 91 /** 92 * Add the correct font weight in Chrome, Edge, and Safari. 93 */ 94 95 b, 96 strong { 97 font-weight: bolder; 98 } 99 100 /** 101 * 1. Correct the inheritance and scaling of font size in all browsers. 102 * 2. Correct the odd `em` font sizing in all browsers. 103 */ 104 105 code, 106 kbd, 107 samp { 108 font-family: monospace, monospace; /* 1 */ 109 font-size: 1em; /* 2 */ 110 } 111 112 /** 113 * Add the correct font size in all browsers. 114 */ 115 116 small { 117 font-size: 80%; 118 } 119 120 /** 121 * Prevent `sub` and `sup` elements from affecting the line height in 122 * all browsers. 123 */ 124 125 sub, 126 sup { 127 font-size: 75%; 128 line-height: 0; 129 position: relative; 130 vertical-align: baseline; 131 } 132 133 sub { 134 bottom: -0.25em; 135 } 136 137 sup { 138 top: -0.5em; 139 } 140 141 /* Embedded content 142 ========================================================================== */ 143 144 /** 145 * Remove the border on images inside links in IE 10. 146 */ 147 148 img { 149 border-style: none; 150 } 151 152 /* Forms 153 ========================================================================== */ 154 155 /** 156 * 1. Change the font styles in all browsers. 157 * 2. Remove the margin in Firefox and Safari. 158 */ 159 160 button, 161 input, 162 optgroup, 163 select, 164 textarea { 165 font-family: inherit; /* 1 */ 166 font-size: 100%; /* 1 */ 167 line-height: 1.15; /* 1 */ 168 margin: 0; /* 2 */ 169 } 170 171 /** 172 * Show the overflow in IE. 173 * 1. Show the overflow in Edge. 174 */ 175 176 button, 177 input { 178 /* 1 */ 179 overflow: visible; 180 } 181 182 /** 183 * Remove the inheritance of text transform in Edge, Firefox, and IE. 184 * 1. Remove the inheritance of text transform in Firefox. 185 */ 186 187 button, 188 select { 189 /* 1 */ 190 text-transform: none; 191 } 192 193 /** 194 * Correct the inability to style clickable types in iOS and Safari. 195 */ 196 197 button, 198 [type='button'], 199 [type='reset'], 200 [type='submit'] { 201 -webkit-appearance: button; 202 } 203 204 /** 205 * Remove the inner border and padding in Firefox. 206 */ 207 208 button::-moz-focus-inner, 209 [type='button']::-moz-focus-inner, 210 [type='reset']::-moz-focus-inner, 211 [type='submit']::-moz-focus-inner { 212 border-style: none; 213 padding: 0; 214 } 215 216 /** 217 * Restore the focus styles unset by the previous rule. 218 */ 219 220 button:-moz-focusring, 221 [type='button']:-moz-focusring, 222 [type='reset']:-moz-focusring, 223 [type='submit']:-moz-focusring { 224 outline: 1px dotted ButtonText; 225 } 226 227 /** 228 * Correct the padding in Firefox. 229 */ 230 231 fieldset { 232 padding: 0.35em 0.75em 0.625em; 233 } 234 235 /** 236 * 1. Correct the text wrapping in Edge and IE. 237 * 2. Correct the color inheritance from `fieldset` elements in IE. 238 * 3. Remove the padding so developers are not caught out when they zero out 239 * `fieldset` elements in all browsers. 240 */ 241 242 legend { 243 box-sizing: border-box; /* 1 */ 244 color: inherit; /* 2 */ 245 display: table; /* 1 */ 246 max-width: 100%; /* 1 */ 247 padding: 0; /* 3 */ 248 white-space: normal; /* 1 */ 249 } 250 251 /** 252 * Add the correct vertical alignment in Chrome, Firefox, and Opera. 253 */ 254 255 progress { 256 vertical-align: baseline; 257 } 258 259 /** 260 * Remove the default vertical scrollbar in IE 10+. 261 */ 262 263 textarea { 264 overflow: auto; 265 } 266 267 /** 268 * 1. Add the correct box sizing in IE 10. 269 * 2. Remove the padding in IE 10. 270 */ 271 272 [type='checkbox'], 273 [type='radio'] { 274 box-sizing: border-box; /* 1 */ 275 padding: 0; /* 2 */ 276 } 277 278 /** 279 * Correct the cursor style of increment and decrement buttons in Chrome. 280 */ 281 282 [type='number']::-webkit-inner-spin-button, 283 [type='number']::-webkit-outer-spin-button { 284 height: auto; 285 } 286 287 /** 288 * 1. Correct the odd appearance in Chrome and Safari. 289 * 2. Correct the outline style in Safari. 290 */ 291 292 [type='search'] { 293 -webkit-appearance: textfield; /* 1 */ 294 outline-offset: -2px; /* 2 */ 295 } 296 297 /** 298 * Remove the inner padding in Chrome and Safari on macOS. 299 */ 300 301 [type='search']::-webkit-search-decoration { 302 -webkit-appearance: none; 303 } 304 305 /** 306 * 1. Correct the inability to style clickable types in iOS and Safari. 307 * 2. Change font properties to `inherit` in Safari. 308 */ 309 310 ::-webkit-file-upload-button { 311 -webkit-appearance: button; /* 1 */ 312 font: inherit; /* 2 */ 313 } 314 315 /* Interactive 316 ========================================================================== */ 317 318 /* 319 * Add the correct display in Edge, IE 10+, and Firefox. 320 */ 321 322 details { 323 display: block; 324 } 325 326 /* 327 * Add the correct display in all browsers. 328 */ 329 330 summary { 331 display: list-item; 332 } 333 334 /* Misc 335 ========================================================================== */ 336 337 /** 338 * Add the correct display in IE 10+. 339 */ 340 341 template { 342 display: none; 343 } 344 345 /** 346 * Add the correct display in IE 10. 347 */ 348 349 [hidden] { 350 display: none; 351 }