/** Reset some basic elements */
body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr, dl, dd, ol, ul, figure { margin: 0; padding: 0; }

/** Variables **********************************************/
/* portfolio tinkering */
/* Set theme color *************************/
/************************************************************/
/** Basic styling */
body { font-family: Lato, sans-serif; font-size: 20px; line-height: 1.5em; font-weight: 100; color: #111; background-color: #EEE; -webkit-text-size-adjust: 100%; }

.brand-text { color: #F37B65; display: inline; }

.projects_container { /*overflow-y: scroll;*/ width: 100%; }

.head_name { color: #111; font-size: 1.75em; line-height: 1; letter-spacing: 3px; font-weight: 400; font-size: 40px; padding: 0%; }

.head_role { color: #F37B65; font-size: 1.75em; line-height: 1; letter-spacing: 3px; font-weight: 400; font-size: 30px; }

@media (max-width: 1020px) { .head_name { color: #000; font-size: 1.75em; line-height: 1; letter-spacing: 3px; font-weight: 400; font-size: 20px; padding: 0%; padding-top: 5%; } .head_role { color: #F37B65; font-size: 1.75em; line-height: 1; letter-spacing: 3px; font-weight: 400; font-size: 15px; } }

.blogdate { font-size: 12px; display: inline; }

/** Set `margin-bottom` to maintain vertical rhythm */
p, blockquote, pre, ul, ol, dl, figure, .highlight { margin-bottom: 20px; }

.alignright { float: right; }

hr { /* Inset, by Dan Eden */ border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3); }

/** Figures */
figure > img { display: block; }

figcaption { font-size: 17.5px; }

/** Lists */
ul, ol { margin-left: 50px; }

li > ul, li > ol { margin-bottom: 0; }

/** Headings */
h1, h2, h3, h4, h5, h6 { font-weight: 100; }

/** Links */
a { color: #111; text-decoration: none; /* &:visited { color: darken($colour-theme, 15%);  } */ }

a:hover { color: #F37B65; text-decoration: none; }

article a { color: #F37B65; font-weight: 100; }

article a:hover { text-decoration: none; }

a.portfolio-content { color: #F37B65; }

/** Blockquotes */
blockquote { color: #111; border-left: 10px solid #e8e8e8; padding-left: 25px; font-size: 18px; font-style: italic; }

blockquote > :last-child { margin-bottom: 0; }

/** Code formatting */
pre, code { font-size: 15px; border-radius: 3px; background-color: #e8e8e8; }

code { padding: 1px 5px; }

pre { padding: 8px 12px; overflow-x: scroll; }

pre > code { border: 0; padding-right: 0; padding-left: 0; }

/** Wrapper */
.wrapper { height: 100%; margin-right: auto; margin-left: auto; padding-right: 50px; padding-left: 50px; }

@media screen and (max-width: 800px) { .wrapper { max-width: -webkit-calc(800px - (50px)); max-width: calc(800px - (50px)); padding-right: 15px; padding-left: 15px; } }

/** Clearfix */
.wrapper:before, .wrapper:after { content: ""; display: table; clear: both; }

iframe { margin: 0 auto; display: block; border-style: none; }

.container { width: 100%; height: 75%; }

.container_row { display: grid; }

.layer1, .layer2, .layer3, .layer4 { grid-column: 1; grid-row: 1; z-index: 1; }

.eye { position: relative; display: inline-block; z-index: 0; border-radius: 50%; width: 5%; height: 6.6%; left: 49%; top: 22%; transform: translate(-50%, -50%); background: #FFF; }

.eye:after { position: absolute; z-index: 0; bottom: 25%; right: -8%; width: 75%; height: 75%; background: #000; border-radius: 50%; content: " "; }

.eyer { position: relative; display: inline-block; z-index: 0; border-radius: 50%; width: 5%; height: 6.6%; left: 54%; top: 24%; transform: translate(-50%, -50%); background: #FFF; }

.eyer:after { position: absolute; z-index: 0; bottom: 25%; right: -8%; width: 75%; height: 75%; background: #000; border-radius: 50%; content: " "; }

.site-inner { margin: 5%; padding: 0%; left: 12.5%; top: -4%; width: 65%; height: auto; position: absolute; background-color: #FFF; }

@media (max-width: 1400px) { .site-inner { margin: 0%; margin-top: 5%; left: 5%; width: 90%; } }

/** Site header   ********************************************************** */
.site-header { background-color: #FFF; opacity: 0.75; width: 100%; height: 128px; z-index: 50; }

.site-header-table { margin: 0%; padding: 0%; width: 100%; height: inherit; top: 0%; z-index: 500; }

.site-title { font-size: 20px; line-height: 56px; letter-spacing: -1px; margin-bottom: 0; }

.site-title:hover { text-decoration: none; color: #AAA; }

.site-nav { float: right; line-height: 56px; }

.site-nav .page-link { color: #111; line-height: 1.5em; }

.site-nav .page-link:not(:first-child) { margin-left: 10px; }

@media screen and (max-width: 600px) { .site-nav { position: fixed; top: 0px; right: 10px; text-align: right; } .site-nav:hover .trigger { display: block; padding-bottom: 5px; } .site-nav .page-link { display: line; } }

/* Style the navigation menu */
.topnav { position: absolute; top: 32px; right: 5%; display: none; z-index: 100; }

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks { display: none; overflow: hidden; background-color: #333; position: sticky; z-index: 100; }

/* Style navigation menu links */
.topnav a { color: white; padding: 16px 16px; text-decoration: none; font-size: 17px; display: block; }

/* Style the hamburger menu */
.topnav a.icon { background: #ddd; display: block; position: absolute; right: 0; top: 0; }

/* Add a grey background color on mouse-over */
.topnav a:hover { background-color: #ddd; color: black; }

/* Style the active link (or home/logo) */
.active { background-color: #F37B65; color: white; }

@media (max-width: 660px) { .site-nav { display: none; } .topnav { background-color: #333; position: absolute; right: 5%; display: block; z-index: 100; } }

.header-bar { left: 0px; top: 0px; position: relative; font-size: 20px; display: block; opacity: 0.75; text-align: center; padding-top: 25px; line-height: 3em; z-index: 25; }

.header-bar h1 { color: #F37B65; font-size: 75px; }

.header-bar h2 { font-size: 25px; }

/** Site footer  ********************************************************** */
.site-footer { font-size: 14px; text-align: center; padding: 2px; background-color: #FFF; color: #111; left: 0px; bottom: 0px; }

.site-footer p { margin-bottom: 0; }

.site-footer-below { height: 64px; background-color: #EEE; }

/** Pagination   ********************************************************** */
.pagination { max-width: -webkit-calc(800px - (50px * 2)); text-align: center; width: 100%; height: 100%; margin: 12px; position: relative; font-size: 32px; }

.paginationicon { font-size: 50px; }

.paginationicon a { color: #F37B65; }

/** Page content   ********************************************************** */
.page-content { padding: 0; /* VERTICAL PADDING FOR TITLE ON EVERY PAGE */ width: 100%; }

.page-heading { font-size: 20px; }

.post-list { margin: 0px 0; list-style: none; }

.post-list > li { margin-bottom: 40px; }

.contacticon { font-size: 60px; display: block; margin: 10px; }

.center { text-align: center; max-width: 100%; }

/** Posts  ********************************************************** */
.post-header { margin-bottom: 40px; }

.post-title { font-size: 42px; letter-spacing: -1px; line-height: 1; }

@media screen and (max-width: 800px) { .post-title { font-size: 36px; } }

@media screen and (max-width: 600px) { .post-title { font-size: 56px; } }

.post-content h2 { font-size: 42px; }

@media screen and (max-width: 800px) { .post-content h2 { font-size: 28px; } }

@media screen and (max-width: 600px) { .post-content h2 { font-size: 56px; } }

.post-content h3 { font-size: 30px; }

@media screen and (max-width: 800px) { .post-content h3 { font-size: 22px; } }

@media screen and (max-width: 600px) { .post-content h3 { font-size: 42px; } }

.post-content h4 { font-size: 20px; }

@media screen and (max-width: 800px) { .post-content h4 { font-size: 18px; } }

@media screen and (max-width: 600px) { .post-content h4 { font-size: 30px; } }

.post-meta { font-size: 17.5px; color: #828282; margin-bottom: 0px; }

.post-link { display: block; font-size: 42px; }

/**  Portfolio grid ********************************************************** */
.portfolio-content { font-size: 20px; line-height: 2; color: #111; }

@media screen and (max-width: 600px) { .portfolio-content { font-size: 24px; } }

.portfolio-table { width: 100%; height: 100%; display: inline-block; }

.portfolio-cover-cell { padding: 0%; width: 60%; }

.side-crop { max-width: 767px; height: 62%; overflow: hidden; }

.side-crop img { max-width: initial; width: 100%; }

.portfolio-info-cell { padding: 2%; vertical-align: top; width: 30%; }

.portfolio-cover-break { line-height: 3; }

@media (max-width: 1700px) { .side-crop img { width: 100%; } .portfolio-cover-cell { padding: 0%; width: 100%; display: inline-block; } .portfolio-info-cell { padding: 2%; vertical-align: top; width: 100%; } }

.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

.feature_project { width: 100%; height: 30%; vertical-align: middle; box-sizing: border-box; padding: 10px; }

.feature_img a span { display: inline-block; position: absolute; left: 0; bottom: 0; height: auto; width: auto; background: rgba(0, 0, 0, 0.4); color: #e8e8e8; padding: 16px; padding-bottom: 0%; text-align: left; font-size: 60%; font-weight: 600; line-height: 16px; }

.feature_img { overflow: hidden; position: relative; width: 100%; display: block; padding-top: 0%; }

.feature_img_desktop { width: 100%; max-width: 100%; max-height: 100%; display: block; padding-top: 0%; position: relative; }

.feature_img_mobile { width: 100%; max-width: 100%; max-height: 100%; display: block; padding-top: 0%; position: relative; }

.project { border: 0; float: left; width: 30%; margin-left: 1%; margin-right: 2%; margin-bottom: 32px; }

.project.left { clear: left; }

.project.mid { clear: none; margin-left: 2%; margin-right: 0%; }

.project.right { clear: right; margin-right: 1%; }

@media (max-width: 720px) { .project { width: 99%; display: inline-block; vertical-align: middle; box-sizing: border-box; padding: 10px; } .feature_img_desktop { display: none; } }

@media (min-width: 721px) { .feature_img_mobile { display: none; } }

.thumbnail { width: 100%; overflow: hidden; }

.thumbnail img { width: 100%; height: 75%; padding-top: 0%; position: relative; }

.thumbnail a { float: left; position: relative; width: 100%; height: auto; text-align: center; font-size: 8px; }

@media (min-width: 600px) { .thumbnail a { font-size: 8px; } }

@media (min-width: 720px) { .thumbnail a { font-size: 8px; } }

@media (min-width: 1070px) { .thumbnail a { font-size: 8px; } }

@media (min-width: 1330px) { .thumbnail a { font-size: 8px; } }

.overlay_parent { position: relative; width: 100%; height: 100%; }

.feature_overlay { width: 40%; height: 40%; position: absolute; display: inline-block; bottom: 0; left: 0; z-index: 9; text-align: left; font-size: 24px; background: rgba(0, 0, 0, 0.4); }

.thumnail_overlay { width: 100%; height: 95%; position: absolute; top: 0; left: 0; z-index: 9; }

.thumnail_overlay img { position: absolute; width: 20%; height: auto; }

.thumnail_overlay_bottomright { right: 2%; bottom: 2%; }

.thumnail_overlay_topleft { left: 2%; top: 2%; }

.thumnail_overlay_topleft_banner { left: 0; top: 0; max-width: 14%; }

/* Check boxes */
.check-containing-table-top { display: table; margin-left: 1.5%; margin-right: 1.5%; width: 97%; height: 24px; margin-bottom: -24px; }

.check-label { display: inline-block; font-size: 16px; margin-bottom: -24px; }

.check-containing-table { display: table; margin-left: 1.5%; margin-right: 1.5%; width: 97%; height: 24px; margin-top: -8px; margin-bottom: 0px; }

.check-containing-table-bottom { display: table; margin-left: 1.5%; margin-right: 1.5%; width: 97%; height: 24px; }

.check-center-align { padding: 0px; width: 100%; text-align: center; vertical-align: middle; font-size: 16px; }

.check-right-align { padding: 0px; width: 100%; text-align: right; vertical-align: middle; font-size: 16px; }

@media (max-width: 1400px) { .check-containing-table-top { margin-bottom: 0px; } .check-containing-table { margin-bottom: 0px; } }

@media (max-width: 720px) { .check-containing-table-top { display: none; } .check-containing-table { display: none; } .check-containing-table-bottom { display: none; } }

/**  Portfolio pages ********************************************************** */
.blankbox { background: #F37B65; }

.img_row { height: 275px; width: 100%; overflow: hidden; box-sizing: border-box; padding: 5px; }

.col { width: 100%; height: 100%; float: left; object-fit: cover; box-sizing: border-box; padding: 5px; }

.right { float: right; }

.one { width: 33.33%; }

.two { width: 66.66%; }

.three { width: 100%; }

.caption { height: 100%; color: #aaa; text-align: center; vertical-align: middle; font-size: 12px; }

#CharityPie { background-color: #FFF; color: #111; width: 100%; height: 384px; }

/** Syntax highlighting styles */
.highlight { background: #fff; }

.highlight .c { color: #998; font-style: italic; }

.highlight .err { color: #a61717; background-color: #e3d2d2; }

.highlight .k { font-weight: bold; }

.highlight .o { font-weight: bold; }

.highlight .cm { color: #998; font-style: italic; }

.highlight .cp { color: #999; font-weight: bold; }

.highlight .c1 { color: #998; font-style: italic; }

.highlight .cs { color: #999; font-weight: bold; font-style: italic; }

.highlight .gd { color: #000; background-color: #fdd; }

.highlight .gd .x { color: #000; background-color: #faa; }

.highlight .ge { font-style: italic; }

.highlight .gr { color: #a00; }

.highlight .gh { color: #999; }

.highlight .gi { color: #000; background-color: #dfd; }

.highlight .gi .x { color: #000; background-color: #afa; }

.highlight .go { color: #888; }

.highlight .gp { color: #555; }

.highlight .gs { font-weight: bold; }

.highlight .gu { color: #aaa; }

.highlight .gt { color: #a00; }

.highlight .kc { font-weight: bold; }

.highlight .kd { font-weight: bold; }

.highlight .kp { font-weight: bold; }

.highlight .kr { font-weight: bold; }

.highlight .kt { color: #458; font-weight: bold; }

.highlight .m { color: #099; }

.highlight .s { color: #d14; }

.highlight .na { color: #008080; }

.highlight .nb { color: #0086B3; }

.highlight .nc { color: #458; font-weight: bold; }

.highlight .no { color: #008080; }

.highlight .ni { color: #800080; }

.highlight .ne { color: #900; font-weight: bold; }

.highlight .nf { color: #900; font-weight: bold; }

.highlight .nn { color: #555; }

.highlight .nt { color: #000080; }

.highlight .nv { color: #008080; }

.highlight .ow { font-weight: bold; }

.highlight .w { color: #bbb; }

.highlight .mf { color: #099; }

.highlight .mh { color: #099; }

.highlight .mi { color: #099; }

.highlight .mo { color: #099; }

.highlight .sb { color: #d14; }

.highlight .sc { color: #d14; }

.highlight .sd { color: #d14; }

.highlight .s2 { color: #d14; }

.highlight .se { color: #d14; }

.highlight .sh { color: #d14; }

.highlight .si { color: #d14; }

.highlight .sx { color: #d14; }

.highlight .sr { color: #009926; }

.highlight .s1 { color: #d14; }

.highlight .ss { color: #990073; }

.highlight .bp { color: #999; }

.highlight .vc { color: #008080; }

.highlight .vg { color: #008080; }

.highlight .vi { color: #008080; }

.highlight .il { color: #099; }

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