@font-face { font-family: "CooperHewitt"; src: url("../fonts/CooperHewitt/CooperHewitt-Bold.eot"); src: url("../fonts/CooperHewitt/CooperHewitt-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/CooperHewitt/CooperHewitt-Bold.woff") format("woff"), url("../fonts/CooperHewitt/CooperHewitt-Bold.ttf") format("truetype"), url("../fonts/CooperHewitt/CooperHewitt-Bold.svg#CooperHewitt") format("svg"); }

@font-face { font-family: "CooperHewitt-BoldItalic"; src: url("../fonts/CooperHewitt/CooperHewitt-BoldItalic.eot"); src: url("../fonts/CooperHewitt/CooperHewitt-BoldItalic.eot?#iefix") format("embedded-opentype"), url("../fonts/CooperHewitt/CooperHewitt-BoldItalic.woff") format("woff"), url("../fonts/CooperHewitt/CooperHewitt-BoldItalic.ttf") format("truetype"), url("../fonts/CooperHewitt/CooperHewitt-BoldItalic.svg#CooperHewitt-BoldItalic") format("svg"); }

@font-face { font-family: "rubik"; src: url("../fonts/rubik/Rubik-Light.eot"); src: url("../fonts/rubik/Rubik-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/rubik/Rubik-Light.woff") format("woff"), url("../fonts/rubik/Rubik-Light.ttf") format("truetype"), url("../fonts/rubik/Rubik-Light.svg#rubik") format("svg"); }

@font-face { font-family: "Rubik-Bold"; src: url("../fonts/rubik/Rubik-Bold.eot"); src: url("../fonts/rubik/Rubik-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/rubik/Rubik-Bold.woff") format("woff"), url("../fonts/rubik/Rubik-Bold.ttf") format("truetype"), url("../fonts/rubik/Rubik-Bold.svg#Rubik-Bold") format("svg"); }

@font-face { font-family: "cmu-concrete-ita"; src: url("../fonts/Concrete/cmunoti.eot"); src: url("../fonts/Concrete/cmunoti.eot?#iefix") format("embedded-opentype"), url("../fonts/Concrete/cmunoti.woff") format("woff"), url("../fonts/Concrete/cmunoti.ttf") format("truetype"), url("../fonts/Concrete/cmunoti.svg#cmu-concrete-ita") format("svg"); }

* { box-sizing: border-box; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, 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, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 16px; font: inherit; vertical-align: baseline; }

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

html, body { height: 100%; }

body { line-height: 1; }

ol, ul { list-style: none; }

a { text-decoration: none; color: black; }

blockquote, q { quotes: none; }

img { width: 100%; height: 100%; vertical-align: bottom; }

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

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

p { font-style: normal; }

em { font-style: italic; }

strong { font-family: "Rubik-Bold"; }

h1 { font-size: 1.2rem; line-height: 50px; }

h1 a { font-family: "CooperHewitt"; font-weight: normal; }

h2 { font-family: "CooperHewitt-BoldItalic"; font-size: 1.1rem; line-height: 50px; }

p { font-family: "rubik"; font-size: 1rem; line-height: 1.3rem; }

p a { font-family: "cmu-concrete-ita"; }

.top > div:nth-child(1) { color: white; }

.top > div:nth-child(1) a { color: #ff0054; }

#header { padding: 0 20px; }

body { overflow: hidden; }

#page { height: 100%; background: #e6e6e6; }

#page .navbar { width: 100%; height: 50px; }

#page .handler { width: 50px; height: 50px; border-radius: 25px; position: absolute; top: 50%; z-index: 999; cursor: -webkit-grab; cursor: grab; }

#page .hand1 { background: green; opacity: 0.5; left: calc((100%/3) - 25px); }

#page .hand2 { background: red; opacity: 0.5; right: calc((100%/3) - 25px); }

#page .mouseDown { cursor: -webkit-grabbing; cursor: grabbing; }

#page #start { width: 100%; height: calc(100% - 50px); }

#page #start .top, #page #start .bottom { width: 100%; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-pack: justify; justify-content: space-between; }

#page #start img { filter: grayscale(100%) contrast(4); transition: filter 0.5s; }

#page #start img:hover { filter: grayscale(0%); transition: filter 0.5s; }

#page #start .top { position: relative; height: calc(100% / 2); }

#page #start .top > div:nth-child(-n+2) { padding: 0px 20px; }

#page #start .top > div:nth-child(1) { background: #969696; }

#page #start .bottom { position: absolute; height: auto; top: calc(100% / 2 + 25px); bottom: 0; }

#page #start .bottom > div:nth-child(1) { background: red; }

#page #start .blocs { overflow-y: auto; margin: 2px; width: calc(100% / 3); min-width: 200px; }

#page #start .blocs:nth-child(2) { background: white; left: calc(100% / 3); }

#page #start .blocs:nth-child(3) { background: white; }

#mapid { height: 180px; }

/*# sourceMappingURL=data:application/json;charset=utf8;base64,[encoded data, 19348 characters] */
