/* thank you! http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }

del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }

@font-face { font-family: "Calibre-Medium"; src: url("/static/fonts/Calibre-Medium.woff"); src: url("/static/fonts/Calibre-Medium.eot?#iefix") format("embedded-opentype"), url("/static/fonts/Calibre-Medium.woff") format("woff"), url("/static/fonts/Calibre-Medium.otf") format("opentype"); }
@font-face { font-family: "Calibre-Regular"; src: url("/static/fonts/Calibre-Regular.woff"); src: url("/static/fonts/Calibre-Regular.eot?#iefix") format("embedded-opentype"), url("/static/fonts/Calibre-Regular.woff") format("woff"), url("/static/fonts/Calibre-Regular.otf") format("opentype"); }
@font-face { font-family: "Calibre-Semibold"; src: url("/static/fonts/Calibre-Semibold.woff"); src: url("/static/fonts/Calibre-Semibold.eot?#iefix") format("embedded-opentype"), url("/static/fonts/Calibre-Semibold.woff") format("woff"), url("/static/fonts/Calibre-Semibold.otf") format("opentype"); }
@font-face { font-family: "Calibre-Bold"; src: url("/static/fonts/Calibre-Bold.woff"); src: url("/static/fonts/Calibre-Bold.eot?#iefix") format("embedded-opentype"), url("/static/fonts/Calibre-Bold.woff") format("woff"), url("/static/fonts/Calibre-Bold.otf") format("opentype"); }
body.is-debug div.center-wrapper { background-image: url("/static/images/grid.png"); background-repeat: repeat-y; background-position: 20px 0; }

h1, h2 { font-family: 'Calibre-Semibold','Montserrat', Arial, Helvetica, sans-serif; font-weight: 700; font-size: 16em; text-transform: uppercase; }

h1 { letter-spacing: 0.3em; }

h2 { font-family: 'Calibre-Bold','Montserrat', Arial, Helvetica, sans-serif; font-weight: 700; font-size: 2.7em; letter-spacing: 0.1em; }

p { font-family: 'Calibre-Semibold','Montserrat', Arial, Helvetica, sans-serif; font-weight: 700; margin-bottom: 1em; line-height: 1em; font-size: 1.2em; text-align: left; margin-bottom: 0; padding-bottom: 1em; }
p em { font-size: 0.7em; }

img { max-width: 90%; height: auto; display: inline-block; vertical-align: middle; }
img.extend_size { width: 100%; }

a { letter-spacing: 0.1em; text-transform: uppercase; color: #0f2e5c; text-decoration: none; }
a:hover { color: #f7dfd9; }

html { height: 100%; min-width: 100%; background-color: #0f2e5c; }

body { height: 100%; background-color: #f7dfd9; font-family: 'Calibre-Bold','Montserrat', Arial, Helvetica, sans-serif; font-weight: 700; text-align: center; color: #0f2e5c; font-size: 1.5em; }

body.content { height: 100%; background-color: #0f2e5c; font-family: 'Calibre-Bold','Montserrat', Arial, Helvetica, sans-serif; font-weight: 700; text-align: center; color: #f7dfd9; font-size: 1.5em; }
body.content a { color: #f7dfd9; }
body.content a:hover { color: #0f2e5c; background: #f7dfd9; }
body.content nav.mainnav { float: left; top: -37%; position: relative; left: -17%; }
body.content nav.mainnav a { font-size: 2em; }
body.content nav.mainnav a:hover { background: none; }
body.content nav.mainnav img { height: 2em; }

body > header { padding-top: 1%; }

nav.mainnav ul li { display: block; float: left; line-height: 18px; margin: 30px; margin-top: 20px; }
nav.mainnav ul li a { font-family: 'Calibre-Bold','Montserrat', Arial, Helvetica, sans-serif; font-weight: 700; text-transform: uppercase; font-size: 18px; letter-spacing: 0.03em; text-decoration: none; }
nav.mainnav ul li a:hover { color: #fff; text-decoration: none; }

section.mainsection { width: 100%; margin: 0 auto; }

div#front { display: block; position: absolute; }

div.copy { position: absolute; top: 3em; float: right; width: 50%; right: 2em; }

div.copy-friends { position: absolute; top: 3em; float: right; width: 50%; right: 2em; }
div.copy-friends a { letter-spacing: 0.1em; text-transform: uppercase; color: #0f2e5c; text-decoration: none; }
div.copy-friends a:hover { color: #f7dfd9; background: none; }

h3.menu { font-size: 1.8em; position: relative; top: 0.8em; }

section#front { position: relative; height: 90%; color: #fff; }
section#front img { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 5%; }

.demo-2 { --color-text: #fff; --color-bg: #f7dfd9; --color-link: #0f2e5c; --color-link-hover: #fff; --color-title: #fff; --color-subtitle: #0f2e5c; }

.content__title { font-family: 'Calibre-Semibold','Montserrat', Arial, Helvetica, sans-serif; font-weight: 700; font-size: 7vw; font-weight: 700; color: var(--color-title); text-align: center; margin: 0; text-transform: lowercase; letter-spacing: 0.06em; }

.content__subtitle { color: var(--color-subtitle); padding: 0 0.75em; margin: 0; letter-spacing: 0.5em; text-indent: 0.5em; font-weight: 700; text-transform: uppercase; }

@media screen and (max-width: 55em) { .content--fixed { background: #acb2b9; }
  .content__title { font-size: 2em; }
  .content__subtitle { font-size: 0.85em; } }
@media screen and (max-width: 1200px) { h1 { font-size: 12em; letter-spacing: 0.2em; }
  h1 { font-size: 12em; letter-spacing: 0.2em; }
  body.content nav.mainnav { left: -24%; } }
@media screen and (max-width: 800px) { h1 { font-size: 12em; letter-spacing: 0.2em; }
  h1 { font-size: 12em; letter-spacing: 0.2em; }
  body.content nav.mainnav { left: -29%; } }
@media screen and (max-width: 630px) { h1 { font-size: 6em; }
  h2 { padding-top: 0.2em; }
  section#front { height: 85%; }
  h3.menu { position: relative; left: -1em; top: 0.2em; }
  p { font-size: 0.8em; }
  body.content nav.mainnav { top: -43%; left: -3%; }
  body.content nav.mainnav a { font-size: 1em; }
  div.copy { width: 80%; left: 2em; }
  div.copy-friends { width: 80%; left: 2em; }
  div.copy-friends a { color: #fff; }
  nav.mainnav ul li { margin: 14px; } }

/*# sourceMappingURL=base.css.map */