@charset "UTF-8";
/**
* basicss overrides
*
* any defaults in basicss/basicss/_settings.scss
* may be overridden...
*
* e.g. $prototyping: true;
*/
/**
* basicss.scss
*
* Author: Marian Friedmann
*
*/
/* ====================================================
Reset, Defaults, Mixins
==================================================== */
/**
* Reset, Default settings
*/
/**
* _settings.scss
*
* Author: Marian Friedmann
*/
/**
* Variables Mode
*/
/**
* Default colors
*/
/**
* Default objects
*/
/**
* Default helper
*/
/**
* Default fonts
*/
/**
* Default font size
*/
/**
* Default headings
*/
/**
* Default spacing
*/
/**
* Default breakpoints
*/
/**
* Default spaces
*/
/**
* Default constrains
*/
/**
* Arrows
*/
/**
* Global Variables
*/
/**
* Mixins
*/
/**
* _media.scss
*
* Author: Marius Scheel
*
* Usage:
* @include media(300px);
* or @include media(300px, false);
* or @include media(max-width 300px);
* or @include media(100px max-width 300px);
* or @include media(max-width 100px max-width 300px);
* or @include media(max-width 100px max-width 300px, true);
*
*/
/**
* _hdpi.scss
*
* Author: Marius Scheel
*
* defaults to 1.3 to include Google Nexus 7
* adapted from bourbon:
* https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/css3/_hidpi-media-query.scss
*
* Usage:
* @include hdpi {
* // your css for hdpi displays
* };
*
* you can use a custom ratio, if you like:
* @include hdpi(1.5) {
* // your css
* };
*/
/**
* _retina-image.scss
*
* Author: Marius Scheel
*
* Usage:
* .hero {
* @include retina-image("../path/to/hero", 200px 400px);
* }
*
* to use a specific filename:
* .hero {
* @include retina-image("../path/to/hero", 200px 400px, "../path/to/retina-hero");
* }
*
* modified version of bourbon's retina-image mixin.
* The mixin uses a @2x.png retina filename by default.
* https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/addons/_retina-image.scss
*/
/**
* _font-size.scss
*
* Author: Marian Friedmann
*
*/
/**
* _px-to-rem.scss
*
* Author: Marian Friedmann
*
* Usage:
* .element {
* @include px-to-rem(padding, 0 24px)
* }
*
* Output:
* .element {
* padding: 0 24px;
* padding: 0 1.5rem;
* }
*
*/
/**
* _clearfix.scss
*
* Author: Marian Friedmann
*
* Usage:
* .element {
* @include clearfix;
* }
*
*/
/**
* _ellipsis.scss
*
* Author: Marian Friedmann
*
* ellipsis mixin
*
*/
/* ====================================================
Base Styles
==================================================== */
/**
* _main.scss
*
* Author: Marian Friedmann
*
*/
/**
* _baseline.scss
*
* Author: Marian Friedmann
*
*/
/**
* _typo.scss
*
* Author: Marian Friedmann
*
*/
/**
* _links.scss
*
* Author: Marian Friedmann
*
*/
/**
* media-src.scss
*
* Author: Marian Friedmann
*
*/
/* ====================================================
Objects
==================================================== */
/**
* _grid.scss
*
* Author: Marian Friedmann
*
* Usage:
*
*
* the example above combines the grid items with the widths from helper/_width.scss
*/
/**
* Reverse the order of grid items
*/
/**
* adds a seperator line to the grid
*/
/**
* Grid items without gutters
*/
/**
* Grid size variations
*/
/**
* _btn.scss
*
* Author: Marian Friedmann
*
* Usage:
* btn
* btn
*/
/* Button disguised as a link. */
/**
* _constrain.scss
*
* Author: Marius Scheel
*
*/
/**
* _nav.scss
*
* Author: Marian Friedmann
*
* source: Nav abstraction from csswizardry.com/2011/09/the-nav-abstraction
*
* Can be used on an `ol` or `ul` and displays the list items horizontally.
* Extend it with the following subclasses:
*
* - nav--stacked // displays the list items vertically
* - nav--banner // centres the list
* - nav--block // expands list items clickable areas
* - nav--fit // forces the list to occupy the full width of its parent
* - nav--keywords // display as a list of keywords
* - nav--breadcrumb // display as breadcrumbs
* - nav--parallel // display nav items with parallel separator
*
* Markup:
*
*
*/
/**
* 'nav-stacked' displays the list items vertically
*/
/**
* 'nav-banner' centres the list
*/
/**
* 'nav--block' expands list items clickable areas with padding
*/
/**
* 'nav--fit' forces the list to occupy the full width of its parent
*/
/**
* 'nav--keywords' display as a list of keywords
*/
/**
* 'nav--breadcrumbs' display as breadcrumbs
*/
/**
* 'nav--parallel' display with parallel separator
*/
/**
* _box.scss
*
* modified version of:
* https://github.com/inuitcss/objects.box/blob/master/_objects.box.scss
*
*/
/**
* _media.scss
*
* displays image and text side by side
*
* Example markup:
*
*
* use the `.media--rev` modifier to reverse the the image location and put it to the right
* use the `.media--small` modifier, to decrease the gutter width between image and content
*
* for more information have a look at:
* stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code
*
*/
/**
* _bare-list.scss
*
*/
/**
* _ui-list.scss
*
* based on Harry Roberts ui-list object:
* https://github.com/inuitcss/objects.ui-list/blob/master/_objects.ui-list.scss
*
* creates blocky items, can be used with lists or the corresponding markup:
*
*
*
* or:
*
*
*
* can optionally be used with --separator and --border, where --separator
* adds borders to the list element and --border to the list itself
*
* comes with different size modifiers
*
*/
/**
* Modifiers for sizing the list
*/
/**
* _arrow.scss
*
* Author: Marian Friedmann
*
* Usage:
*
* ...
*
*
*/
/**
* Arrow Top
*/
/**
* Arrow Bottom
*/
/**
* Arrow Left
*/
/**
* Arrow Right
*/
/**
* _icon.scss
*
* Author: Marian Friedmann
*
* Usage:
*
* ...
*
*
*/
/**
* Basic & spacing
*/
/**
* _width.scss
*
* Author: Marian Friedmann
*
* Usage:
*
*
*/
/**
* _typo.scss
*
* Author: Marian Friedmann
*
* Alt Text Styles.
*
* ## alignment
* - text--left
* - text--right
* - text--center
*
* ## utilities
* - text--secondary
* - text--inherit-color
* - text--no-wrap
* - text--large
*
* Usage:
*
*
Lorem Ipsum
*
Lorem ipsum
*