| LEFT | RIGHT | 
|---|
| (no file at all) |  | 
|  | 1 /*! | 
|  | 2  * This file is part of website-defaults | 
|  | 3  * Copyright (C) 2016 Eyeo GmbH | 
|  | 4  * | 
|  | 5  * website-defaults is free software: you can redistribute it and/or | 
|  | 6  * modify it under the terms of the GNU General Public License as published by | 
|  | 7  * the Free Software Foundation, either version 3 of the License, or | 
|  | 8  * (at your option) any later version. | 
|  | 9  * | 
|  | 10  * website-defaults is distributed in the hope that it will be useful, | 
|  | 11  * but WITHOUT ANY WARRANTY; without even the implied warranty of | 
|  | 12  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the | 
|  | 13  * GNU General Public License for more details. | 
|  | 14  * | 
|  | 15  * You should have received a copy of the GNU General Public License | 
|  | 16  * along with website-defaults.  If not, see <http://www.gnu.org/licenses/>. | 
|  | 17  */ | 
|  | 18 | 
|  | 19 /******************************************************************************* | 
|  | 20  * Base styles | 
|  | 21  ******************************************************************************/ | 
|  | 22 | 
|  | 23 html | 
|  | 24 { | 
|  | 25   box-sizing: border-box; | 
|  | 26   color: $primary; | 
|  | 27   background-color: $primary-light; | 
|  | 28   font-family: $primary-font; | 
|  | 29   font-size: $medium-font; | 
|  | 30   line-height: 1.15; | 
|  | 31 } | 
|  | 32 | 
|  | 33 /* Set default box-sizing (opinionated) */ | 
|  | 34 | 
|  | 35 *, | 
|  | 36 *:before, | 
|  | 37 *:after | 
|  | 38 { | 
|  | 39   box-sizing: inherit; | 
|  | 40 } | 
|  | 41 | 
|  | 42 /* Remove the margin in all browsers (opinionated). */ | 
|  | 43 | 
|  | 44 body | 
|  | 45 { | 
|  | 46   margin: 0px; | 
|  | 47 } | 
|  | 48 | 
|  | 49 /* Add the correct display in IE 9-. */ | 
|  | 50 | 
|  | 51 article, | 
|  | 52 aside, | 
|  | 53 footer, | 
|  | 54 header, | 
|  | 55 nav, | 
|  | 56 section, | 
|  | 57 main | 
|  | 58 { | 
|  | 59   display: block; | 
|  | 60 } | 
|  | 61 | 
|  | 62 /** | 
|  | 63  * Stretch content full-width | 
|  | 64  */ | 
|  | 65 .full-width | 
|  | 66 { | 
|  | 67   display: block; | 
|  | 68   width: 100%; | 
|  | 69   margin: $small-space 0px; | 
|  | 70 } | 
|  | 71 | 
|  | 72 /** | 
|  | 73  * Center content within a (responsive) fixed width | 
|  | 74  */ | 
|  | 75 .container | 
|  | 76 { | 
|  | 77   width: $mobile-width; | 
|  | 78   max-width: 100%; | 
|  | 79   margin: 0px auto; | 
|  | 80   padding: 0px $small-space; | 
|  | 81 } | 
|  | 82 | 
|  | 83 @media(min-width: $tablet-breakpoint) | 
|  | 84 { | 
|  | 85   .container | 
|  | 86   { | 
|  | 87     width: $tablet-width; | 
|  | 88   } | 
|  | 89 } | 
|  | 90 | 
|  | 91 @media(min-width: $desktop-breakpoint) | 
|  | 92 { | 
|  | 93   .container | 
|  | 94   { | 
|  | 95     width: $desktop-width; | 
|  | 96   } | 
|  | 97 } | 
| LEFT | RIGHT | 
|---|