/*
 Theme Name:   jvl.org
 Theme URI:    http://themify.me/themes/flat
 Description:  Flat Child Theme
 Author:       James Lindsay
 Author URI:   http://jamesvlindsay.com
 Template:     flat
 Version:      1.0.0
 Tags: themify, featured-images, translation-ready, custom-menu, sidebar,child-theme

*/
@import url("./../flat/style.css");
/* Variables =================================================== */
/*rgb(206,225,226);*/
/*rgb(80, 115, 158);*/
/*field borders and other basic settings*/
/*medium blue used mostly for border colors or offsets from dark backgrounds*/
/* buttons and such*/
/* bright blue for shoebox meter & links */
/* Mixins =================================================== */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-o-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.clearfix,
div.control {
  *zoom: 1;
}
.clearfix:before,
div.control:before,
.clearfix:after,
div.control:after {
  display: table;
  content: "";
}
.clearfix:after,
div.control:after {
  clear: both;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  position: static;
  clip: auto;
  height: auto;
  width: auto;
  margin: 0;
  overflow: visible;
}
/* =Theme customization starts here
-------------------------------------------------------------- */
body {
  color: #333;
}
big,
h1,
h2,
h3,
h4,
h5,
h6,
input,
textarea,
select,
input[type=search],
button,
#site-description,
#main-nav a,
.progress-bar,
.timeline .timeline-date,
.timeline .timeline-content-wrap,
.testimonial .post-content,
.pagenav,
.post-meta,
.post-date,
.author-box .author-name,
.post-nav span span,
.comment-title,
#reply-title,
.commentlist cite,
.commentlist .comment-reply-link,
#respond #cancel-comment-reply-link,
.post .carousel-prev,
.post .carousel-next,
.slider .carousel-prev,
.slider .carousel-next,
.single .post-nav a,
.widgettitle,
.widgettitle a,
.widget #wp-calendar caption,
a.shortcode.button,
.shortcode.post-slider .carousel-prev,
.shortcode.slider .carousel-prev,
.shortcode.post-slider .carousel-next,
.shortcode.slider .carousel-next,
.module-menu ul li,
.module-tab .tab-nav > li > a,
.module-accordion .accordion-title,
.col-full .module-image .image-title {
  font-family: 'Carrois Gothic', sans-serif;
}
#site-logo {
  font-family: 'Economica', 'Carrois Gothic', sans-serif;
  text-transform: none;
  font-size: 3em !important;
  padding-top: 4em;
  -webkit-animation-name: fadeIn;
  -moz-animation-name: fadeIn;
  -o-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  -ms-animation-duration: 1.2s;
  -o-animation-duration: 1.2s;
  animation-duration: 1.2s;
  -webkit-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
  -ms-animation-delay: 0.2s;
  -o-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
#site-logo a {
  color: #ffffff;
}
#site-description {
  color: #ffffff;
  font-size: 1.5em;
  -webkit-animation-name: fadeIn;
  -moz-animation-name: fadeIn;
  -o-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  -ms-animation-duration: 1.2s;
  -o-animation-duration: 1.2s;
  animation-duration: 1.2s;
  -webkit-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
  -ms-animation-delay: 0.2s;
  -o-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
#headerwrap {
  color: #ffffff;
  background: url(./../../uploads/2014/01/Profile_new.png), url(./../../uploads/2014/02/drive_bg.png);
  background-color: #5c9dd5;
  background-repeat: no-repeat;
  background-size: 150px 150px, cover;
  background-position: center 30px,top center;
  background-attachment: scroll,fixed;
}
#headerwrap.fixed-header {
  background-image: url(./../../uploads/2014/01/Profile_new.png);
  background-repeat: no-repeat;
  background-size: 50px 50px;
  background-position: calc(98%) 7px;
  -webkit-animation-name: fadeIn;
  -moz-animation-name: fadeIn;
  -o-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  -ms-animation-duration: 1.2s;
  -o-animation-duration: 1.2s;
  animation-duration: 1.2s;
  -webkit-animation-delay: 0.3s;
  -moz-animation-delay: 0.3s;
  -ms-animation-delay: 0.3s;
  -o-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
#headerwrap .social-widget {
  height: 0;
}
#main-nav {
  padding-top: 1em;
}
#main-nav a {
  color: #ffffff;
}
#main-nav a:hover {
  color: #eeeeee;
}
#main-nav .current_page_item a,
#main-nav .current-menu-item a {
  background-color: #c13f1b;
}
.home #main-nav {
  -webkit-animation-name: fadeIn;
  -moz-animation-name: fadeIn;
  -o-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  -ms-animation-duration: 1.2s;
  -o-animation-duration: 1.2s;
  animation-duration: 1.2s;
  -webkit-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
  -ms-animation-delay: 0.2s;
  -o-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.home #main-nav li#menu-item-204 {
  display: none;
}
.smaller {
  font-size: 14px;
}
/*SITE DESCRIPTION
================================================ */
#site-description {
  font-family: 'Carrois Gothic', sans-serif;
}
.social-link-item img {
  -webkit-border-top-right-radius: 100%;
  -webkit-border-bottom-right-radius: 100%;
  -webkit-border-bottom-left-radius: 100%;
  -webkit-border-top-left-radius: 100%;
  -moz-border-radius-topright: 100%;
  -moz-border-radius-bottomright: 100%;
  -moz-border-radius-bottomleft: 100%;
  -moz-border-radius-topleft: 100%;
  border-top-right-radius: 100%;
  border-bottom-right-radius: 100%;
  border-bottom-left-radius: 100%;
  border-top-left-radius: 100%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}
/*WORK SECTION
================================================ */
#work h1 {
  color: #ffffff;
}
#work h1.section-title {
  font-size: 300%;
  line-height: auto;
  margin-bottom: 1em;
}
#work h1 a {
  color: #ffffff;
}
/*BLURB SECTION
================================================ */
#blurb {
  background: url(./../../uploads/2014/02/drive_bg.png);
  background-repeat: no-repeat;
  background-color: #c13f1b;
  background-size: cover;
  background-position: top center;
  background-attachment: fixed;
}
#blurb p {
  text-align: center;
  line-height: 1.75em;
}
/*WHAT I KNOW SECTION
================================================ */
#what-i-know h1 {
  font-size: 130%;
  line-height: auto;
  text-transform: uppercase;
  margin-bottom: 0.5em;
}
#what-i-know p {
  line-height: 1.5em;
  margin-bottom: 1em;
}
/*CONTACT SECTION
================================================ */
#contact {
  background: url(./../../uploads/2014/02/drive_bg.png);
  background-repeat: no-repeat;
  background-color: #fafa5a;
  background-size: cover;
  background-position: bottom;
  background-attachment: fixed;
}
input.wpcf7-form-control.wpcf7-submit {
  background: #FF7F5E !important;
  border-radius: 10px !important;
  padding: 15px 30px 12px !important;
  -webkit-appearance: none !important;
}
/*CONTACT PAGE
================================================ */
.page-id-19 #pagewrap,
.page-id-19 #body,
.page-id-19 #layout {
  background-color: #c1a077;
  color: #ffffff;
}
.page-id-19 .type-page h1.page-title {
  color: #ffffff;
}
/*PORTFOLIO PAGE
================================================ */
.page-id-17 #pagewrap,
.page-id-17 #body,
.page-id-17 #layout {
  background-color: #21578e;
  color: #ffffff;
}
.page-id-17 .type-page h1.page-title,
.page-id-17 .post-title a {
  color: #ffffff;
}
/*SINGLE PORTFOLIO PAGES
================================================ */
.single-portfolio #menu-item-206,
.single-portfolio #menu-item-207,
.single-portfolio #menu-item-266 {
  overflow: hidden;
  position: absolute;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
.single-portfolio #pagewrap,
.single-portfolio #body,
.single-portfolio #layout {
  background-color: #21578e;
  color: #ffffff;
}
.single-portfolio .post-content h1,
.single-portfolio .post-title a,
.single-portfolio .post-nav a {
  color: #ffffff;
}
.single-portfolio.sidebar-none.mobile-body .post .post-content {
  text-align: left;
}
.single-portfolio.sidebar-none.mobile-body .post .post-content h1 {
  font-size: 1.5em;
}
.single-portfolio.sidebar-none.mobile-body .post-nav a {
  font-size: 1em;
}
.single-portfolio.sidebar-none.mobile-body .post-nav .prev,
.single-portfolio.sidebar-none.mobile-body .post-nav .next {
  margin-bottom: 0px;
}
.single-portfolio.sidebar-none.mobile-body .post-nav span span {
  font-size: 100% !important;
}
/*SMALL HEADER ON SUB PAGES
================================================ */
.page-id-17 #body,
.page-id-19 #body,
.single-portfolio #body {
  margin-top: 4% !important;
}
.page-id-17 #site-logo,
.page-id-19 #site-logo,
.single-portfolio #site-logo,
.page-id-17 #site-description,
.page-id-19 #site-description,
.single-portfolio #site-description {
  overflow: hidden;
  position: absolute;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
.page-id-17 #headerwrap,
.page-id-19 #headerwrap,
.single-portfolio #headerwrap {
  padding-top: 6em;
  background-size: 75px 75px,cover;
}
.page-id-17 #headerwrap.fixed-header,
.page-id-19 #headerwrap.fixed-header,
.single-portfolio #headerwrap.fixed-header {
  padding-top: 0px;
  background-size: 50px 50px;
}
/*FOOTER
================================================ */
footer#footer {
  padding-bottom: 0;
  margin-bottom: 0;
  padding-top: 0;
}
footer#footer .footer-widgets img {
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}
footer#footer p.back-top {
  display: none;
}
footer#footer .col3-1 {
  padding-top: 2%;
  margin-left: 2.95%;
}
footer#footer .col3-1.first {
  border-right: 1px solid #292929;
}
footer#footer .col3-1:last-child {
  border-left: 1px solid #292929;
  margin-left: 0;
  width: 30%;
}
footer#footer .widget.themify-social-links {
  border-bottom: 1px solid #292929;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
footer#footer .widget.themify-social-links li {
  display: inline;
  padding-right: 3px;
}
footer#footer .widget.themify-social-links li::after {
  display: inline;
}
footer#footer .widget.twitter {
  padding-right: 20px;
  margin-bottom: 45px;
}
footer#footer .widget.twitter #twitter-block-1 {
  border: 3px solid #aaaaaa;
  padding: 1em;
  color: #808080;
  -webkit-border-top-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -webkit-border-bottom-left-radius: 10px;
  -webkit-border-top-left-radius: 10px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-bottomright: 10px;
  -moz-border-radius-bottomleft: 10px;
  -moz-border-radius-topleft: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  border-top-left-radius: 10px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  position: relative;
}
footer#footer .widget.twitter #twitter-block-1:after {
  content: '';
  position: absolute;
  border-style: solid;
  border-width: 18px 18px 0;
  border-color: #000 transparent;
  display: block;
  width: 0;
  z-index: 1;
  margin-left: -18px;
  bottom: -18px;
  left: 20%;
}
footer#footer .widget.twitter #twitter-block-1:before {
  content: '';
  position: absolute;
  border-style: solid;
  border-width: 20px 20px 0;
  border-color: #aaaaaa transparent;
  display: block;
  width: 0;
  z-index: 0;
  margin-left: -20px;
  bottom: -23px;
  left: 20%;
}
footer#footer .widget.twitter #twitter-block-1 .twitter-timestamp {
  display: block;
  text-align: right;
}
footer#footer .widget.twitter #twitter-block-1 .twitter-timestamp small {
  font-size: 80%;
  color: #404040;
}
footer#footer .widget.twitter .follow-user {
  margin-top: 40px;
}
footer#footer .widget.twitter .follow-user a {
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 90px;
  background: url(./../../uploads/2014/01/headsplotch-new.png);
  background-size: 70px;
  background-repeat: no-repeat;
  background-position: 10px 20px;
}
footer#footer .widget.flickr {
  padding-left: 16px;
  border-bottom: 1px solid #292929;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
footer#footer .widget.flickr .flickr_badge_image img {
  width: 75px;
  height: 75px;
  margin-right: 20px;
}
footer#footer .widget.Tumblr .widgettitle {
  margin-bottom: 5px;
}
footer#footer .widget.Tumblr li {
  display: inline-block;
  margin: 0 2px;
}
footer#footer .widget.Tumblr li.tumblr_post.quote,
footer#footer .widget.Tumblr li.tumblr_post.link {
  font-family: "futura-pt-1", "futura-pt-2", Arial, sans-serif;
  font-size: 1.23em;
  color: #f2f2f2;
  padding: 1em;
  width: 90%;
}
footer#footer .widget.Tumblr li.tumblr_post.photo {
  width: 90%;
}
footer#footer .widget.Tumblr li p {
  display: none;
}
footer#footer .widget.Tumblr li img {
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  vertical-align: top;
  max-width: 100%;
  max-height: 250px;
}
footer#footer .widget.widget_super_rss_reader {
  padding-left: 16px;
  margin-bottom: 0px;
}
footer#footer .widget.widget_super_rss_reader .widgettitle {
  margin-bottom: 0px;
}
footer#footer .widget.widget_super_rss_reader .srr-title {
  width: 100%;
}
footer#footer .widget.widget_super_rss_reader .srr-wrap .srr-item {
  padding-left: 0px;
  position: relative;
}
footer#footer .widget.widget_super_rss_reader p {
  margin: 0 auto;
}
footer#footer .widget.widget_super_rss_reader img {
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  height: 200px;
  margin-left: 25%;
  border: 1px solid #fff;
}
footer#footer .widget.null-instagram-feed {
  padding: 0 0 0 0;
}
footer#footer .widget.null-instagram-feed ul.instagram-pics li {
  border: none;
  display: inline;
  width: 80%;
}
footer#footer .footer-text {
  margin-top: 20px;
  border-top: 1px solid #292929;
}
@media screen and (max-width: 768px) {
  footer#footer .widget.widget_super_rss_reader div {
    float: none;
  }
  footer#footer .widget.widget_super_rss_reader div .srr-title {
    width: 100%;
  }
  footer#footer .widget.widget_super_rss_reader img {
    float: none;
    margin-top: auto;
  }
}
@media screen and (max-width: 600px) {
  footer#footer .col3-1.first {
    border-right: none;
  }
  footer#footer .col3-1:last-child {
    border-left: none;
  }
  footer#footer .widget.Tumblr {
    border-bottom: 1px solid #292929;
  }
  footer#footer .widget.twitter {
    border-bottom: 1px solid #292929;
    margin-bottom: 20px;
  }
  footer#footer .widget.widget_super_rss_reader {
    border-top: 1px solid #292929;
    margin-top: 20px;
    padding-top: 10px;
  }
}