@import url("https://fast.fonts.net/t/1.css?apiType=css&projectid=3af16084-ba56-49ca-b37d-0b49b59e1927");


@font-face {
    font-family: "AleoRegular";
    src: url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Regular-webfont.eot);
    src: url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Regular-webfont.eot?#iefix) format('embedded-opentype'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Regular-webfont.woff) format('woff'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Regular-webfont.ttf) format('truetype'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Regular-webfont.svg) format('svg')
}

@font-face {
    font-family: "AleoBold";
    src: url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Bold-webfont.eot);
    src: url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Bold-webfont.eot?#iefix) format('embedded-opentype'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Bold-webfont.woff) format('woff'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Bold-webfont.ttf) format('truetype'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/Aleo-Bold-webfont.svg) format('svg')
}

@font-face {
    font-family: "ProximaNovaBold";
    src: url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/fbc6b03a-b3a1-427c-a884-053deca3a53c.eot);
    src: url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/fbc6b03a-b3a1-427c-a884-053deca3a53c.eot?#iefix) format('embedded-opentype'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/d999c07b-a049-4eb5-b8a6-4f36ae25e67e.woff) format('woff'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/4d4a75f5-d32a-4a09-8665-133afd39cc37.ttf) format('truetype'), url(//cartodb-assets.global.ssl.fastly.net/odyssey.js/8152bc4e-d700-4c78-b6be-326893e6f53f.svg) format('svg')
}

body { text-align: center; min-height: 100%; background: #FFFFFF }

html { min-height: 100% }

.progress-bar { position: fixed; left: 0; top: 0; height: 3px; display: inline-block; background: #FF7373; width: 20%; z-index: 2 }

.inner-header { background: #333333; color: #FFFFFF; padding: 20px 0 }

#layout { width: 100%; margin: 0px auto; background: #F5F5F5 }

#header { padding: 20px 0; max-width: 800px; margin: 0 auto }

#header h1 { font: 40px 'AleoBold'; color: #FFFFFF }

#header h2 { font: 28px/32px 'AleoRegular'; color: rgba(255, 255, 255, 0.6); margin-top: 12px }

#header h3 { font: 24px 'AleoRegular'; color: rgba(255, 255, 255, 0.6); margin-top: 12px }

#header h4 { font: 22px 'AleoRegular'; color: rgba(255, 255, 255, 0.6); margin-top: 12px }

#header h5 { font: 20px 'AleoRegular'; color: rgba(255, 255, 255, 0.6); margin-top: 12px }

#header h6 { font: 18px 'AleoRegular'; color: rgba(255, 255, 255, 0.6); margin-top: 12px }

#header p { font: 16px/26px 'AleoRegular'; color: rgba(255, 255, 255, 0.6); margin-top: 12px }

#header a { text-decoration: none; color: #666666 }

#header ul, #header ol { font: 16px/26px 'AleoRegular'; color: #666666; margin-top: 12px }

#header ul { list-style-type: disc }

#header ol { list-style-type: lower-hexadecimal }

#header blockquote { background: #F5F5F5; padding: 20px; margin-top: 20px; border-radius: 4px }

#header blockquote ul, #header blockquote ol { margin-left: 17px }

#header blockquote *:first-child { margin-top: 0 }

#map { width: 100%; height: 100% }

#map_container { height: 300px }

#map_container.attachTop { position: fixed; max-width:100vw; width: 100%; top: 0; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2) }

@media screen and (max-width: 400px) {
    #map_container.attachTop { position: fixed; max-width: 340px; width: 100%; top: 0; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2) }
    .leaflet-control{
        display: none !important;
    }
    #map_container { height: 250px }
}

#od_content { padding: 40px 40px 80px; max-width: 800px; margin: 0 auto; text-align: left; min-height: 1800px }

#od_content img { max-width: 100%; margin: 20px 0 0 0 }

#od_content.attachMap { margin-top: 250px }

#od_content > div { margin-top: 40px; background: #FFFFFF; padding: 40px; border-radius: 2px; box-shadow: 0 1px 0px rgba(0, 0, 0, 0.1) }

#od_content > div:first-child { margin: 0 }

#od_content h1 { font: 26px 'AleoBold'; color: #333333 }

#od_content h1:before { od_content: ""; height: 3px; display: block; width: 70px; background: #333333; margin-bottom: 15px }

#od_content h2, #od_content h3, #od_content h4, #od_content h5, #od_content h6 { font: 18px 'AleoBold'; color: #333333; margin-top: 20px }

#od_content p { font: 16px/26px 'AleoRegular'; color: #666666; margin-top: 20px }

#od_content a { text-decoration: none; color: #666666 }

#od_content ul, #od_content ol { font: 16px/26px 'AleoRegular'; color: #666666; margin-top: 20px }

#od_content ul { list-style-type: disc }

#od_content ol { list-style-type: lower-hexadecimal }

#od_content blockquote { background: #F5F5F5; padding: 20px; margin-top: 20px; border-radius: 4px }

#od_content blockquote ul, #od_content blockquote ol { margin-left: 17px }

#od_content blockquote *:first-child { margin-top: 0 }

#od_content strong { font-family: "AleoBold" }

#od_content em { font-style: italic }

div#credits { position: fixed; bottom: 0; left: 0; right: 0; height: 44px; background-color: #FFFFFF; border-top: 1px solid #E5E5E5; z-index: 1000001 }

div#credits a { color: #FF7373 }

div#credits span { padding: 18px 0 0 0; position: absolute; font-size: 12px; text-transform: uppercase }

div#credits span.title { left: 40px; font-family: 'Proxima N W01 Bold', Sans-serif; color: #333333 }

div#credits span.author { right: 40px; font-family: AleoRegular, Serif; color: #999999; letter-spacing: 2px; font-size: 10px; text-align: right }
