@import url("http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic,700italic,900italic");
@import url("http://fonts.googleapis.com/css?family=Ropa+Sans");
@import url("http://fonts.googleapis.com/css?family=PT+Serif");
@import url("https://fonts.googleapis.com/css?family=Ovo|Quattrocento+Sans");
#page-wrapper { font-family: "Lato", Helvetica, sans-serif; background-color: whitesmoke; }

#page-wrapper p { color: #536775; font-size: 1.7rem; line-height: 2.1rem; margin-bottom: 20px; }

#page-wrapper small { Font-Family: 'Ovo', Serif; font-size: 69%; clear: both; }

#page-wrapper a { Font-Family: 'Ovo', Serif; text-decoration: none; color: #EA5555; }

#page-wrapper a:hover { color: #80CFEF; }

#page-wrapper h1, #page-wrapper .highlight { Font-Family: 'Quattrocento Sans', Sans-Serif; color: #80CFEF; font-size: 3em; }

#page-wrapper .highlight { margin: 8vh 0 3vh; }

#page-wrapper ol { list-style: decimal; }

#page-wrapper h3 { font-size: 120%; font-weight: bolder; }

#page-wrapper section { Font-Family: 'Quattrocento Sans', Sans-Serif; font-size: 1.7 rem; }

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
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: 100%; 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; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

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

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

* { box-sizing: border-box; }

a { text-decoration: none; }

li { line-height: 24px; font-size: 16px; }

li.title { font-size: 1.5em; line-height: 2em; }

li a { line-height: inherit; font-size: inherit; }

body { background-color: whitesmoke; }

.home #page-wrapper { font-family: "Lato", Helvetica, sans-serif; background-color: whitesmoke; }

.home #page-wrapper p { font-size: 1.7rem; line-height: 2.1rem; }

.home #page-wrapper .highlight { Font-Family: 'Quattrocento Sans', Sans-Serif; color: #80CFEF; font-size: 3em; margin: 8vh 0 3vh; }

.home #page-wrapper a { color: #3a3a3a; }

.home #page-wrapper a:hover { color: #EA5555; }

.home #page-wrapper section { display: flex; padding: 35px; height: auto; Font-Family: 'Quattrocento Sans', Sans-Serif; font-size: 1.7 rem; max-width: 1300px; }

@media all and (max-width: 768px) { .home #page-wrapper section { font-size: 2.2 rem; line-height: 2.7 rem; flex-direction: column; flex-wrap: wrap; padding: 15px; max-width: 95vw; } }

.home #page-wrapper section div { flex-direction: row; }

.home #page-wrapper section div.details { flex: 6; }

.home #page-wrapper section div.material { flex: 4; }

.home #page-wrapper section div.material img, .home #page-wrapper section div.material iframe { border: 15px solid white; max-height: 300px; }

.home #page-wrapper section div.material img:hover, .home #page-wrapper section div.material iframe:hover { box-shadow: 1px 1px 10px #DDDCD7; }

.home #page-wrapper section div:nth-child(even) { text-align: right; padding-left: 35px; }

.home #page-wrapper section div:nth-child(odd) { padding-left: 25px; }

@media (max-device-width: 768px), (max-width: 768px) { .home #page-wrapper section div { width: 100%; text-align: center; margin: 25px auto; } .home #page-wrapper section div.details { flex: 1; order: 1; } .home #page-wrapper section div.material { flex: 1; order: 2; } .home #page-wrapper section div.material img, .home #page-wrapper section div.material iframe { max-width: 85%; } .home #page-wrapper section div:nth-child(even) { text-align: center; padding-left: 0px; } }

.home #page-wrapper section div p { color: #536775; }

.home #page-wrapper section div small { Font-Family: 'Ovo', Serif; font-size: 69%; clear: both; }

.home #page-wrapper section div a { Font-Family: 'Ovo', Serif; text-decoration: none; color: #EA5555; }

.home #page-wrapper section div a:hover { color: #80CFEF; }

.page #page-wrapper { width: 90vw; margin: 20px 5vw; padding-bottom: 200px; overflow: auto; }

@media (max-device-width: 768px), (max-width: 768px) { .page #page-wrapper { width: 98vw; margin: 1vw; padding: 20px; } }

.page #page-wrapper section.cover { float: left; width: 40%; margin: 0px 35px 20px 0px; }

@media (max-device-width: 768px), (max-width: 768px) { .page #page-wrapper section.cover { width: 97%; } }

.page #page-wrapper section.cover img { width: 100%; }

.page #page-wrapper section.content { width: 55%; float: left; }

@media (max-device-width: 768px), (max-width: 768px) { .page #page-wrapper section.content { width: 97%; } }

.page #page-wrapper section.content img { max-width: 95%; margin: 15px; }

.blog { Font-Family: 'Ovo', Serif; padding: 10px 15px; color: #536775; font-size: 1rem; background-color: #f1f1f1; }

.blog em { font-style: italic; }

.blog h2 { font-family: "Abril Fatface", Serif; font-size: 3vh; margin-bottom: 15px; }

.blog h2 a { color: #536775; }

.blog h2 a:hover { color: #EA5555; }

.blog article { overflow: auto; }

.blog iframe { width: 100%; min-height: 50vh; }

.blog * a { color: #EA5555; }

.blog *:hover { color: #80CFEF; }

@media all and (max-width: 991px) { .blog { font-size: 2.2 rem; line-height: 2.7 rem; } }

.blog .blog-wrapper { padding: 20px; overflow: auto; }

@media all and (max-width: 991px) { .blog .blog-wrapper { padding: 10px; } }

.blog header { height: 17vh; margin-top: 3vh; }

.blog header h1 { font-size: 5vh; }

.blog .sidebar { width: 18%; position: fixed; height: auto; right: 0; padding: 0 25px 25px 25px; }

@media all and (min-width: 1199px) { .blog .sidebar { top: 25vh; } }

.blog .sidebar p { color: #536775; font-family: "Quattrocento Sans", Sans-Serif; font-size: 1em; line-height: 1.4em; margin: 3px; }

@media all and (max-width: 991px) { .blog .sidebar { width: 100%; position: relative; float: left; clear: both; border: 0px none; } }

.blog .sidebar ul li { list-style: none; padding-left: 5px; }

.blog .post-wrapper { float: left; margin-left: 10%; width: 60%; max-width: 1000px; }

@media all and (max-width: 991px) { .blog .post-wrapper { width: 100%; max-width: 100%; margin-left: 0px; } }

.blog .post-wrapper .post-content { background-color: white; padding: 25px; }

.blog .post-wrapper .post-content p { font-size: 1.2rem; line-height: 1.6rem; color: #51585E; margin-bottom: 20px; }

.blog .post-wrapper .post-content img { max-width: 90%; margin: 20px; }

.blog .post-wrapper .post-content img.tall { max-height: 65vh; }

.blog .post-wrapper .post-content img.left { float: left; }

.blog .post-wrapper .post-content img.right { float: right; }

.blog .post-title { color: #EA5555; margin: 20px 0; font-family: "Abril Fatface", Serif; }

.blog .feed-wrapper header { margin-top: 0px; }

.blog .feed-wrapper h1 { text-align: center; border-bottom: 1px solid; padding-bottom: 10px; }

.blog .feed-wrapper .post-content { margin: 25px 0px; }

* { box-sizing: border-box; }

body.gallery { margin: 0px; overflow: auto; background: whitesmoke; padding: 0px; }

.page_wrapper { height: 100vh; margin: 0px; padding: 0px; }

.fgGallery { margin-right: auto; margin-left: auto; text-align: center; box-sizing: content-box; padding-top: 45px; }

.fgGallery.loading svg { display: block; }

.fgGallery.loading img { display: none; }

.fgGallery svg { display: none; }

.gallery-icon { font-weight: 100; font-size: 10px; line-height: 5px; }

.fgDrawer { float: left; width: 100%; padding: 20px; text-align: center; margin: 45px 0px; }

img.fgDisplay { cursor: pointer; box-sizing: content-box; border: solid 1px #B5B9BD; }

.fgWrapper { width: 100%; top: 0; height: 95vh; }

div.controls { background: transparent; color: #B5B9BD; font-family: helvetica; font-size: 13px; line-height: 19px; font-weight: bold; padding: 0px; width: 100%; height: 45px; bottom: 0; right: 0px; }

div.controls #control-wrapper { width: 200px; float: right; margin-right: 20px; }

div.controls #control-wrapper div { float: right; padding: 0px 10px; }

div.controls .previous { padding-right: 8px; }

div.controls .next { padding-left: 7px; }

div.controls .previous, div.controls .next { padding-top: 2px; height: 45px; float: right; background: transparent; }

#thmbs { background-color: transparent; height: 37px; width: 43px; float: left; cursor: pointer; }

#thmbs span { font-size: 0px; width: 10px; height: 9px; border-left: 1px solid #EAE9DF; border-bottom: 1px solid  #D2D1C6; border-top: 1px solid white; border-right: 1px solid white; display: block; float: left; margin: 2px; }

#thmbs:hover span { border-right: 1px solid #EAE9DF; border-top: 1px solid  #D2D1C6; border-bottom: 1px solid white; border-left: 1px solid white; }

#info-toggle { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; border: solid 1px #EAE9DF; background-color: transparent; height: 37px; width: 54px; float: right; padding: 4px; margin: 2px 10px; cursor: pointer; position: absolute; right: 0; top: 8px; }

#info-toggle:hover { background: #F1F1F1; }

#info-toggle span { border-top: 1px solid #EAE9DF; border-bottom: 1px solid white; height: 0px; width: 95%; display: block; margin: 2px; }

#titlecard { width: 85%; float: left; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { #titlecard { min-height: 100vh; } }

#titlecard .content { width: 50%; margin: 25px auto; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { #titlecard .content { width: 100%; margin: 5%; } }

#titlecard .content a { color: #EA5555; }

#titlecard .content p { font-family: "Lato", serif; font-size: 1.3rem; line-height: 1.7rem; font-weight: 200; margin: 10px 0px; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { #titlecard .content p { font-size: 1.7rem; line-height: 2.2rem; } }

#titlecard h1 { color: #51585E; font-family: 'Lato', helvetica, sans-serif; text-align: center; font-size: 2em; line-height: 2.5em; overflow: auto; margin: 45px auto; }

#titlecard #open-container { font-family: "Lato", sans-serif; text-align: center; }

#titlecard #open-container a { font-style: italic; color: #51585E; }

#titlecard #open-container a:hover { color: #EA5555; }

.gallery-image { overflow: hidden; position: absolute; top: 5vh; height: 90vh; width: 100%; transition: height 1.5s, top 1.5s; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { .gallery-image { position: relative; overflow: initial; margin: 5vh 0vh; } }

.gallery-image .image-image { background-size: contain; background-repeat: no-repeat; background-position: center; width: 100%; padding: 20px; height: 100%; cursor: pointer; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { .gallery-image .image-image { float: left; clear: both; position: relative; } }

.gallery-image .image-title, .gallery-image .image-caption { color: #51585E; font-family: 'Lato', helvetica, sans-serif; display: none; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { .gallery-image .image-title, .gallery-image .image-caption { display: block; } }

#gallery-container { display: none; position: relative; height: 100vh; width: 85%; float: left; -webkit-transition: width 1s; transition: width 1s; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { #gallery-container { display: block; width: 100%; padding: 0 2%; } }

#gallery-container.full .gallery-image { height: 99vh; top: 0px; }

#gallery-container #right-clicker { cursor: e-resize; height: 100vh; width: 35%; z-index: 5000; float: right; top: 0px; right: 0px; position: relative; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { #gallery-container #right-clicker { display: none; } }

#gallery-container #left-clicker { cursor: w-resize; height: 100vh; width: 35%; z-index: 5001; float: left; top: 0px; position: relative; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { #gallery-container #left-clicker { display: none; } }

#drawer { padding: 25px; float: left; width: 15%; height: 100vh; border-right: 1px solid #EAE9DF; font-family: "Lato", sans-serif; color: #B5B9BD; -webkit-transition: margin-left 1s; transition: margin-left 1s; }

@media (max-device-width: 1199px), screen and (max-width: 1199px) { #drawer { display: none; } }

#drawer #infocard { padding-bottom: 15px; min-height: 25vh; max-height: 50vh; color: #3a3a3a; line-height: 125%; }

#drawer #infocard #active-title p { font-weight: 500; margin-bottom: 10px; font-size: 1.1rem; }

#drawer #infocard #active-caption p { font-weight: 200; margin-bottom: 5px; }

#drawer #infocard #active-dimensions, #drawer #infocard #active-medium { font-size: 85%; font-weight: 100; }

#drawer #utilities { width: 100%; border-bottom: 1px dotted #B5B9BD; padding-bottom: 15px; margin-bottom: 15px; float: left; }

#drawer #utilities #show-all { font-weight: 100; }

#drawer #utilities a { color: #B5B9BD; font-weight: lighter; text-align: center; cursor: pointer; }

#drawer #utilities a:hover { color: #51585E; }

#drawer #utilities #open-drawer { position: fixed; width: 35px; z-index: 15000; top: 0; left: 0; display: none; }

#drawer .thumbnails { float: left; width: 100%; display: flex; flex-wrap: wrap; }

#drawer .thumbnails .thumbnail { display: block; border: 1px solid whitesmoke; width: 55px; height: 55px; background-size: cover; background-repeat: no-repeat; margin: 5px; cursor: pointer; opacity: .8; }

#drawer .thumbnails .thumbnail:hover { opacity: 1; }

#drawer .thumbnails .thumbnail img { max-height: 60px; cursor: pointer; }

#all-series { -webkit-transition: width 1s; transition: width 1s; display: none; padding-top: 15px; margin-bottom: 15px; border-top: 1px solid #B5B9BD; }

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