/* Base overrides
------------------------------------------------------- */
.blog .prose blockquote {
  color: rgba(0,0,0,.5);
  padding: 0 0 0 30px;
  background: transparent;
  position: relative;
}

.blog .dark blockquote,
.dark .prose blockquote {
  color: rgba(255,255,255,.5);
}

.blog .prose blockquote::after {
  content: '';
  position: absolute;
  width: 4px;
  left: 0;
  bottom: 0;
  top: 35px;
  background-color: rgba(0,0,0,.1);
}

.blog .dark blockquote::after,
.dark.blog blockquote::after {
  background-color: rgba(255,255,255,.05);
}

.blog .prose blockquote::before {
  content: '\201C';
  padding-top: 15px;
  font-family: Georgia, serif;
  font-size: 60px;
  font-weight: bold;
  color: rgba(0,0,0,.1);
  position: absolute;
  left: -20px;
  top: 0px;
  height: 35px;
}

.blog .dark blockquote::before,
.dark.blog blockquote::before {
  color: rgba(255,255,255,.1);
}


#contact .half {
  z-index: -10;
  position: absolute;
  width: 50%;
  height: 320px;
}

.second-half {
  left: 50%;
}


.fill-notice {
  background: #f0f8fc;
}

.center-x { text-align: center; left: 0; right: 0; margin-left: auto; margin-right: auto;}

/* Blog: Shared
------------------------------------------------------- */

.blog .masthead { background-color: #50667f;}

[class*='blog-fixed-'] {
  position: fixed;
  top: 0;
  bottom: 0;
  margin: auto;
}

.blog-fixed-prev {
  left: 0;
}

.blog-fixed-next {
  right: 0;
}

/* Blog General
------------------------------------------------------- */

/* Supress `err` styling rouge applies from
 * mapbox.com/base/ to favor shorthand documentation
 * that doesn't always support formal syntax */
pre .err {
  background-color:transparent;
  color:inherit;
  }

.blog-item .dark { color: white; }

.blog-item-image {
  display: block;
  position: absolute;
  height: 100%;
  background-size: cover;
  background-position: 50%;
}

p.summary  {
  color: #adadad;
}

small.tag {
  display: inline-block;
  padding: 3px 10px 2px 10px;
  border-radius: 44px;
  color: rgba(116, 116, 116, 0.51);
  background-color: rgba(236, 236, 236, 0.47);
  margin-bottom: 5px;
}

small.tag.custom {
  color: rgba(120, 120, 120, 0.7);
  background-color: rgba(228, 228, 228, 0.73);
}

.tag:empty {
  display: none;
}

small.tag.micro:empty {
 display: none;
}

.tags-overview .tag {
  display: inline;
  float: left;
  margin-left: 0;
  margin-bottom: 3px;
}

span.category span {
  width: 10px;
  height: 10px;
  display: block;
  float: left;
  margin-right: 10px;
  margin-top: 6px;
}

span.category {
  color: #adadad;
  text-transform: uppercase;
}
span.category-dot {
  height: 10px;
  width: 10px;
  display: inline-block;
  margin-right: 5px;
}

.blog-item.featured {
  margin-top: 60px;
}

.blog-item.featured .blog-item-image {
  position: relative;
  height: 0;
  padding-bottom: 35%;
  background-size: cover;
  background-position: 50%;
}

.blog-item-image.footer-featured {
  position: relative;
  height: 0;
  padding-bottom: 70%;
  background-size: cover;
  background-position: 50%;
}

a h2.blog-title {
  color: #51616C;
  font-size: 28px;
  line-height: 35px;
}

.js-show-ad {
  display: none;
}

.footer-featured a h2.blog-title {
  font-size: 17px;
  line-height: 24px;
}

.footer-item-featured .post-info {
  min-height: 220px;
}

.footer-item-featured {
  display: none;
}

.footer-item-featured.active {
  display: block;
}

.dark small.tag {
  display: inline-block;
  padding: 3px 10px 2px 10px;
  border-radius: 44px;
  color: rgba(255, 255, 255, 0.75);
  background-color: rgba(0, 0, 0, 0.18);
  margin-bottom: 5px;
}

span.tag {
  display: inline-block;
  padding: 5px 15px 5px 15px;
  border-radius: 44px;
  color: rgba(53, 50, 50, 0.81);
  background-color: rgba(236, 236, 236, 0.47);
  margin-bottom: 5px;
  margin-left: 10px;
  font-size: 14px;
}

.blog-image-small {
  position: absolute;
  background-size: cover;
  background-position: 50%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 3px 0px 0px 3px;
}


/* Pagination */

ul.pagination {
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 40px;
}

ul.pagination li {
  display: block;
  float: left;
}

ul.pagination li a,
ul.pagination li strong  {
  position: relative;
  display: block;
  float: left;
  padding: 10px;
  padding-left: 20px;
  border-left: 1px solid rgba(255, 255, 255, 0.14);
  padding-right: 20px;
}

.pager-spacer {
  background: #50667f;
}

.next .disabled,
.inactive .next {
  padding: 10px;
  padding-left: 20px;
  display: block;
}

.prev .disabled,
.inactive .prev {
  padding: 10px;
  padding-right: 20px;
  display: block;
}

.pages .prev a {
  border-left: none;
}

ul.pagination li.active,
.pages .current-page {
  color: white;
  font-weight: bold;
  background-color: rgba(59, 76, 88, 0.49);
}

ul.pagination li.inactive {
  color: rgba(255, 255, 255, 0.3);
}

ul.pagination li:first-of-type a {
  border-left: none;
}


/* Blog: Single Post
------------------------------------------------------- */
.blog .map-legends {
  display:none;
}

.blog .thumb {
  height:25px;
  width:25px;
  background-size:100%;
  background-position:50% 50%;
  background-repeat:no-repeat;
  vertical-align:middle;
  margin:0 5px;
}

.prose p > img,
.prose p a > img,
.prose li > img,
.prose li a > img {
  max-height:700px;
}

/* Video embeds */
.prose .video {
  height: 0;
  position: relative;
}

.prose .video iframe {
  position: absolute;
}

h1.single-post-title {
  color: rgb(43, 63, 86);
  line-height: 35px;
  font-size: 25px;
}

a.prev-post, a.next-post {
  display: inline-block;
  position: absolute;
  top: 40%;
  padding: 7px;
  background: rgba(0, 0, 0, 0.1);
  color:white;
}

a.prev-post.custom, a.next-post.custom {
  z-index: 200;
}

a.prev-post { left: 0px;}
a.next-post {  right: 0px; }
a.prev-post:hover, a.next-post:hover {
  background: rgb(80, 102, 127);
  cursor: pointer;
}

.bleed-header:after {
  content: "";
  position: absolute;
  display: block;
  top:0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.15);
}

.bleed-header h2.custom-title {
  padding-top: 0px;
}

  h1.fancy.custom-title {
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 3px;
    text-transform: uppercase;
    padding-top: 0px;
  }


/* Blog: footer grid
------------------------------------------------------- */
.blog-posts-block {
  position: absolute;
  top: 160px;
  bottom: 0px;
  right: 0;
}

.blog-author-block .med-graphic {
  height: 120px;
  width: 120px;
  margin-left: auto;
  margin-right: auto;
}

.center-v {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%);
}

.center-h {
  left: 0;
  right: 0;
}

.blog-footer .blog-tweet-contents {
  margin-left: 30px;
  padding-left: 40px;
  padding-right: 20px;
}

.blog-footer .blog-tweet-contents .med-graphic {
  height: 80px;
  width: 80px;
}

.blog-twitter-block, .blog-posts-block  {
  padding-left: 20px;
}

.blog-posts-block  {
  padding-bottom: 20px;
}

.blog-posts-block > div:first-of-type  {
  height: 100%;
  overflow-y: auto;
}

.blog-author-block > div:first-of-type {
  min-height: 400px;
}

/* Making sure there is still padding bottom when div becomes scrollable */
.blog-posts-block::after {
  display: block;
  width: 90%;
  background-color: #f8f8f8;
  height: 30px;
  z-index: 70;
  content: '';
  bottom: 20px;
  position: absolute;
  right: 0px;
  color: rgba(0,0,0,.5);
  background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(248,248,248,0.06) 4%, rgba(248,248,248,1) 65%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(4%,rgba(248,248,248,0.06)), color-stop(65%,rgba(248,248,248,1)));
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(248,248,248,0.06) 4%,rgba(248,248,248,1) 65%);
  background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(248,248,248,0.06) 4%,rgba(248,248,248,1) 65%);
  background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(248,248,248,0.06) 4%,rgba(248,248,248,1) 65%);
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(248,248,248,0.06) 4%,rgba(248,248,248,1) 65%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#f8f8f8',GradientType=0 );
}

.blog-posts-block::before {
  display: block;
  width: 90%;
  background-color: #f8f8f8;
  height: 50px;
  z-index: 30;
  content: '';
  top: 0px;
  position: absolute;
  right: 0px;
  background: -moz-linear-gradient(top,  rgba(248,248,248,1) 0%, rgba(255,255,255,0.01) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(248,248,248,1)), color-stop(100%,rgba(255,255,255,0.01))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(255,255,255,0.01) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(255,255,255,0.01) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(248,248,248,1) 0%,rgba(255,255,255,0.01) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(248,248,248,1) 0%,rgba(255,255,255,0.01) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#03ffffff',GradientType=0 ); /* IE6-9 */
}

.blog-twitter-block a {
  color: #fff;
  transition: all .3s;
}

.blog-twitter-block a:hover {
  background-color: #2e94b2;
}

 .blog-twitter-block > a:first-of-type {
    min-height: 140px; /* because twitter */
}

.blog-author-block .med-graphic {
  background-size: cover;
}

.blog-footer .med-graphic { padding: 20px 0;}
.pill > a:only-of-type {
  border-radius: 3px;
}

.blog-footer-columns ul li {
  list-style: none;
  margin-bottom: 0px;
}
.blog-footer-columns ul {
  margin-left: 0px;
}

.fill-turf {
  background-color: #2ecc71;
}
/* Industry and other ads at the bottom
------------------------------------------------------- */
.industry-ad.industry-ad-realestate { background: url(img/realestate.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-transportation { background: url(img/transportation.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-agriculture { background: url(img/agriculture.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-government { background: url(img/government.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-social { background: url(img/social.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-security { background: url(img/security.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-outdoors { background: url(img/outdoors.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-media { background: url(img/media.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-health { background: url(img/health.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-naturalresources { background: url(img/naturalresources.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-insurance { background: url(img/insurance.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-finance { background: url(img/finance.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: center center;}
.industry-ad.industry-ad-developers { background: url(img/developers.jpg), rgba(59, 76, 88, 0.910);  background-size: cover; background-position: right bottom;}
.industry-ad.industry-ad-turf { background-image: url(img/turf.png);  background-size: cover; background-position: right bottom;}
.industry-ad.industry-ad-education { background-image: url(img/education.jpg);  background-size: cover; background-position: right bottom;}
.industry-ad.industry-ad-studio { background-image: url(img/studio-new.jpg);  background-size: cover; background-position: right top;}
.industry-ad.industry-ad-bengaluru { background-image: url(img/bengaluru.jpg);  background-size: cover; background-position: right top;}
.industry-ad.industry-ad-tableau { background-image: url(img/tableau.jpg);  background-size: cover; background-position: right top;}
.industry-ad.industry-ad-bi { background-image: url(img/bi.jpg);  background-size: cover; background-position: right top;}

.industry-ad-copy, .footer-ad-copy  {
  z-index: 2;
}

.coupon {
  z-index: 3;
  position: absolute;
}

.studiocoupon {
  top: 0;
  bottom: 0;
  background: url(img/studiocoupon.png) right center no-repeat;
  background-size: auto 100%;
}

.coupon a.quiet {
  opacity: .5;
}

.studio-ad {
  min-height: 250px;
  max-height: 330px;
}

.studio-ad h3.fancy {
  margin-bottom: 0px;
}

.studio-ad-graphic {
  position: absolute;
}

.studio-editor {
  background:url(img/studio-editor-1.jpg) 50% 50% no-repeat;
  background-size:cover;
}


/* If you set class:bleed-section on an element
-------------------------------------------------- */

/* Hide overflow to account for imperfect margin
calculations for bleed section that cause vertical scrollbars */
body { overflow-x: hidden; }


.bleed-section {
  margin-left:-20px;
  margin-right:-20px;
  max-width:none;
}

@media only screen and (min-width:640px) {
  .bleed-section {
    margin-left:calc(-10% - 20px);
    margin-right:calc(-10% - 20px);
  }
}

@media only screen and (min-width:900px) {
  .bleed-section {
    margin-left:-22%;
    margin-right:-22%;
  }
}

@media only screen and (min-width:1200px) {
  .bleed-section {
    /* fallback for browsers that don't support vw in calc */
    margin-left:-15%;
    margin-right:-15%;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
}

/* Blog header with search and dropdown
-------------------------------------------------- */

.category-filter .pad2y {
  padding-top: 25px;
  padding-bottom: 20px;
}

.category-filter-dot, .dd-placeholder {
  text-transform: uppercase;
  color: #adadad;
  font-size: 12px;
  margin-bottom: 6px;
}

.category-filter-dot::before {
  display: block;
  content: '';
  background-color: red;
  width: 10px;
  height: 10px;
  float: left;
  border-radius: 50%;
  margin-right: 4px;
  margin-top: 4px;
}

span.dd-placeholder::before {
  margin-top: -1px;
}

.category-filter-dot.dot-purple::before { background-color: #8a8acb;}
.category-filter-dot.dot-orange::before { background-color: #f9886c;}
.category-filter-dot.dot-blue::before { background-color: #3887be;}
.category-filter-dot.dot-green::before { background-color: #56b881;}
.category-filter-dot.dot-cyan::before { background-color: #3bb2d0;}
.category-filter-dot.dot-pink::before { background-color: #ed6498;}
.category-filter-dot.dot-mustard::before { background-color: #fbb03b;}
.category-filter-dot.dot-grey::before { background-color: rgb(180, 180, 180);}

.icon.point.dot-purple::before { color: #8a8acb;}
.icon.point.dot-orange::before { color: #f9886c;}
.icon.point.dot-blue::before { color: #3887be;}
.icon.point.dot-green::before { color: #56b881;}
.icon.point.dot-cyan::before { color: #3bb2d0;}
.icon.point.dot-pink::before { color: #ed6498;}
.icon.point.dot-mustard::before { color: #fbb03b;}
.icon.point.dot-grey::before { color: rgb(180, 180, 180);}

.input-pill .search-input {
  padding-left: 20px;
  padding-right: 20px;
}

.search-show { display: none; }

.keyline-all.filter {
    border: 2px solid rgba(255, 255, 255, 1);
}

.filter {
   position: relative;
  width: 95%;
  float: left;
}
.filter-small {
  width: 5%;
}

.filter-container,
.filter-item {
  cursor: pointer;
}

.filter-container.active .filter-items {
  display: block;
}

.filter-items {
  display: none;
  position: absolute;
  top: calc(100% - 1px);
  width: calc( 4px + 100%);
  left: -2px;
  z-index: 100;
  border-left: 2px solid rgba(255, 255, 255, 1);
  border-right: 2px solid rgba(255, 255, 255, 1);
  border-bottom: 2px solid rgba(255, 255, 255, 1);
  border-radius: 0 0 3px 3px;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
}

.dd-placeholder.keyline-all {
  border: 2px solid rgba(255, 255, 255, 1);
}

.filter-item {
}

.filter-item:hover {
  background: rgb(103, 127, 156);
}


div.dd-menu-slide {
  color: #495d77;
}

.blog-header h2 {
}

.dd-placeholder {
  margin-left: 10px;
  padding-top: 1px;
}

.dd-options {

}

/* hiding the actual select element */
select.dd-select.dd-menu-slide {
  display: none;
}

div.dd-menu-slide::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0s;
  -moz-transition: -webkit-transform 0s;
  -o-transition: -webkit-transform 0s;
  -ms-transition: -webkit-transform 0s;
  transition: transform 0s;
}

/* animating active category to the left */
.dd-menu-slide > span {
  width: 100%;
  -webkit-transition: text-indent 0.2s, opacity 0.2s;
  -moz-transition: text-indent 0.2s, opacity 0.2s;
  -o-transition: text-indent 0.2s, opacity 0.2s;
  -ms-transition: text-indent 0.2s, opacity 0.2s;
  transition: text-indent 0.2s, opacity 0.2s;
}

.dd-menu-slide.dd-active > span {
  text-indent: -50px;
  opacity: 0;
}

.dd-options {
  z-index: -1;
}
.dd-active .dd-options {
  z-index: 1;
}

.dd-menu-slide.dd-active > span::after {
  -webkit-transform: translate3d(0,-20%,0);
  -ms-transform: translate3d(0,-20%,0);
  -moz-transform: translate3d(0,-20%,0);
  -o-transform: translate3d(0,-20%,0);
  transform: translate3d(0,-20%,0);
}

.dd-menu-slide .dd-options {
  width: 100%;
  left: 0;
  position: absolute;
}


.dd-menu-slide .dd-options li {
  float: left;
  width: 25%;
  opacity: 0;
  -webkit-transform: translate3d(30%,0,0);
  -moz-transform: translate3d(30%,0,0);
  -ms-transform: translate3d(30%,0,0);
  -o-transform: translate3d(30%,0,0);
  transform: translate3d(30%,0,0);
  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  -ms-transition: -ms-transform 0.3s, opacity 0.3s;
  -o-transition: -o-transform 0.3s, opacity 0.3s;
  -moz-transition: -moz-transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s;
}

.dd-menu-slide .dd-options li.pad0y {
  padding-top: 2px;
  padding-bottom: 2px;
}

.dd-menu-slide.dd-active .dd-options li {
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  opacity: 1;
}

.dd-menu-slide.dd-active .dd-options li:first-child {
  -webkit-transition-delay: 0.02s;
  -moz-transition-delay: 0.02s;
  -ms-transition-delay: 0.02s;
  -o-transition-delay: 0.02s;
  transition-delay: 0.02s;
}

.dd-menu-slide.dd-active .dd-options li:nth-child(2) {
  -webkit-transition-delay: 0.08s;
  -moz-transition-delay: 0.08s;
  -o-transition-delay: 0.08s;
  -ms-transition-delay: 0.08s;
  transition-delay: 0.08s;
}

.dd-menu-slide.dd-active .dd-options li:nth-child(3) {
  -webkit-transition-delay: 0.12s;
  -moz-transition-delay: 0.12s;
  -o-transition-delay: 0.12s;
  -ms-transition-delay: 0.12s;
  transition-delay: 0.12s;
}

.dd-menu-slide.dd-active .dd-options li:nth-child(4) {
  -webkit-transition-delay: 0.18s;
  -moz-transition-delay: 0.18s;
  -o-transition-delay: 0.18s;
  -ms-transition-delay: 0.18s;
  transition-delay: 0.18s;
}

.dd-menu-slide.dd-active .dd-options li:nth-child(5) {
  -webkit-transition-delay: 0.22s;
  -moz-transition-delay: 0.22s;
  -o-transition-delay: 0.22s;
  -ms-transition-delay: 0.22s;
  transition-delay: 0.22s;
}

.dd-menu-slide.dd-active .dd-options li:nth-child(6) {
  -webkit-transition-delay: 0.26s;
  -moz-transition-delay: 0.26s;
  -ms-transition-delay: 0.26s;
  -o-transition-delay: 0.26s;
  transition-delay: 0.26s;
}
.dd-menu-slide.dd-active .dd-options li:nth-child(7) {
  -webkit-transition-delay: 0.30s;
  -moz-transition-delay: 0.30s;
  -ms-transition-delay: 0.30s;
  -o-transition-delay: 0.30s;
  transition-delay: 0.30s;
}
.dd-menu-slide.dd-active .dd-options li:nth-child(8) {
  -webkit-transition-delay: 0.34s;
  -moz-transition-delay: 0.34s;
  -ms-transition-delay: 0.34s;
  -o-transition-delay: 0.34s;
  transition-delay: 0.34s;
} /* more options need more delay declaration */

.dd-menu-slide .dd-options li span {
  padding: 3px;
}

.dd-select.dd-menu-slide {
  -webkit-transition: all 0.3s;
  -moz-transition:    all 0.3s;
  -o-transition:      all 0.3s;
  -ms-transition:     all 0.3s;
  transition:         all 0.3s;
}

 .dd-select.dd-menu-slide.dd-active {
    padding-bottom: 55px;
  }


.dd-menu-slide.dd-active .dd-options li:nth-child(5) {
  clear: both;
}

.dd-menu-slide .dd-options li span:hover,
.dd-menu-slide .dd-options li.dd-focus span,
.dd-menu-slide .dd-options li.dd-selected span {
  background: transparent;
  color: #495d77;
}

.dd-menu-slide .dd-selected span::after {
  content: '';
}


/* Swifttype autocomplete
-------------------------------------------------- */
form input.st-search-input {
  font-size: 12px;
  padding: 5px 9px 5px 27px;
  height: 18px;
  width: 200px;
  color: #666;
  border: 1px solid #ccc;
  outline: none;
  background: #fcfcfc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAUFJREFUeNqU0j0oRWEcx/Hj3ifvlMHL7C1lY7mDwUBKkoksBjKJxWIQu7xlOybDLVGukhhMZDFbxGBS8nIjKR3E96nf0dPjuuVfn+6tc35P//P8/yYMw8CpbgygGQlcYw8H+Ai8MvotxQImgt81hk1M4cEPF2IV43jCGo7wjk5MYhhlGMKbG+7BKO4wiGPn8DO1vIN+jGA9fpjQaUksecG4zjGPL3VQ5IZb9OAw+LtO1FkjatxwUuEoTzjSbRu9/xO+0W97nnArqvXuoxve1/9p1OUIlmNGU7EX9+KGt3GKNuyiC5WoQAe2NJFP3PpzzmoR0khpxle6h3pnkeKJPCPjbtglerVFfWhSVxfqJtK4qrChTMY4XdjVm9O21aIA92LrFcv6HHtAsclxQVnxa0WfsqgDUib4X9muStCA2W8BBgDJ0EeGeFZ8WAAAAABJRU5ErkJggg==) no-repeat 7px 7px;
}

.swiftype-widget .autocomplete {
  font-family: 'Open Sans', sans-serif !important;
  box-shadow: none;
  border-left: 1px solid rgba(0,0,0,0.1);
  border-right: 1px solid rgba(0,0,0,0.1);
  border-radius: 0;
  background-color: #fff;
  display: block;
  list-style-type: none;
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: left;
}

.swiftype-widget .autocomplete ul {
  border-bottom: 1px solid rgba(0,0,0,0.1);
  max-height: 400px;
  overflow: auto;
  border-radius: 0 !important;
  font-family: 'Open Sans', sans-serif !important;
  background-color: #fff;
  display: block;
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: left;
}

.autocomplete li:empty {
  display: none;
}

.swiftype-widget .autocomplete li {
  border-bottom: 1px solid rgba(0,0,0,0.1);
  cursor: pointer;
  padding: 10px 8px 10px 20px;
  font-size: 13px;
  list-style-type: none;
  background-image: none;
  margin: 0;
}


.swiftype-widget .autocomplete li.active {
  border-bottom: 1px solid rgba(0,0,0,0.1);
  background: rgba(0,0,0,0.05);
  border-top: none;
}


.swiftype-widget .autocomplete li p {
  font-size: 13px;
  line-height: 16px;
  color: #888888;
}

.swiftype-widget .autocomplete li p.title {
  font-size: 15px;
  line-height: 20px;
  font-weight: bold;
  color: #3f526d;
}

.featured-navigation {
   color: #3f526d;
   height: auto;
}
.featured-navigation:hover {
  color: #3784ba;
  background: #fff;
  border: none;
}
.featured-navigation:disabled:hover {
  color: rgba(0,0,0,0.25);
}
.featured-navigation:focus {
  box-shadow: none;
}

.swiftype-widget .autocomplete li p.title em {
  color: #0b2644;
  font-style: normal;
  font-weight: bold;
}

.swiftype-widget .autocomplete li.active p.title {
  color: #1c6cb5;
}

.swiftype-widget .autocomplete li.active p.title em {
  color: #1c6cb5;
  font-style: normal;
}


.swiftype-widget .autocomplete li .sections {
  margin-top: 5px;
  color: inherit;
  font-size: 11px;
}

.swiftype-widget .autocomplete li .sections em {
  color: inherit;
  text-decoration: none;
  font-family: 'Open Sans Bold', sans-serif;
  font-style: normal;
}

.swiftype-widget .autocomplete li .sections .section {
  display: inline;
}

.swiftype-widget .autocomplete li.active .sections {
  color: #1c6cb5;
}

.swiftype-widget .autocomplete li.active .sections em {
  color: inherit;
  font-family: 'Open Sans Bold', sans-serif;
  font-style: normal;
}

.autocomplete img {
  max-height: 50px;
}

.autocomplete-img {
  width: 60px;
  height: 60px;
  display: block;
  background-size: cover !important;
  background-position: 50%;
  border-radius: 5px;
}

div.search-result-item:first-of-type {
  margin-top: 40px;
}
.st-page a.button:first-of-type {
  margin-right: 10px;
}


/* Responsive
-------------------------------------------------- */

@media only screen and (max-width: 1024px){
  .blog-posts-block.col6, .blog-twitter-block.col6, .blog-author-block.col6 {
    width: 100%;
    max-width: none;
  }

  .blog-posts-block {
    position: relative;
    top: 0;
    bottom: none;
    right: none;
  }

  .blog-twitter-block, .blog-posts-block {
    padding-left: 0px;
    padding-bottom: 0px;
  }

  .blog-twitter-block {
    padding-bottom: 20px;
  }

  .blog-author-block  > div:first-of-type {
    min-height: 100px;
  }

  .blog-posts-block::after, .blog-posts-block::before {
    display: none
  }

  .blog-author-description {
    float: left;
    width: 60%;
    margin-left: 50px;
  }
  .blog-author-block .med-graphic {
    float: left;
  }

  .footer-item-featured {
    width: 100%;
    float: none;
    max-width: none;
  }

  .footer-item-featured .post-info {
    width: 70%;
    float: left;
    height: 200px;
    min-height: 0px;
  }

  .footer-item-featured .blog-item-image.footer-featured {
    width: 30%;
    float: left;
    height: 200px;
    padding-bottom: 0;
  }
  .category-filter-dot, .dd-placeholder {
    text-transform: uppercase;
    padding-left: 5px;
    padding-right: 5px;
    color: #adadad;
    font-size: 12px;
  }

}

.is--loading, #current-feed {
  min-height: 2600px;
  position: relative;
}




@media only screen and (max-width: 950px) {

   .dd-menu-slide.dd-active .dd-options li {
    width: 33%;
   }
   .dd-menu-slide.dd-active .dd-options li:nth-child(4),  .dd-menu-slide.dd-active .dd-options li:nth-child(7) {
    clear: both;
   }
  .dd-menu-slide.dd-active .dd-options li:nth-child(5) {
    clear: none;
    float: left;
  }

 .dd-select.dd-menu-slide.dd-active {
    padding-bottom: 85px;
  }
}

@media only screen and (max-width: 900px) {
  a.prev-post {
    left: 10px;
  }

  a.next-post {
    right: 10px;
  }
  #search {
    margin-right: 20px;
  }

}

@media only screen and (max-width: 800px) {
  .dark-overlay::after {
    content: '';
    display: block;
    width: 100%;
    background-color: rgba(21, 29, 35, 0.64);
    position: absolute;
    top: 0;
    z-index: 1;
    height: 100%;
    visibility: visible;
  }
  #current-feed .blog-item a.row8 {
    min-height: 0px;
    max-height: none;
    height: inherit;
  }
}

@media only screen and (max-width: 640px) {
  .blog-footer .blog-author-block p,
  .blog-footer .blog-twitter-block div.tweet-contents {
    padding-right: 0;
  }
  .industry-ad .col6,  .industry-ad .col4,  .industry-ad .col5 {
    width: 80%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
  }
  .blog-twitter-block > a:first-of-type {
    min-height: 180px;
  }
  .industry-ad.row5, .footer-ad.row5 {
    height: auto;
    min-height: 200px;
  }
  .industry-ad::after, .footer-ad::after   {
    content: '';
    display: block;
    height: 0;
    clear: both;
    width: 100%;
    height: inherit;
    background-color: rgba(21, 29, 35, 0.62);
    position: absolute;
    top: 0;
    z-index: 1;
    height: 100%;
  }
  .blog-author-description,
  .blog-author-block .med-graphic {
    float: none;
  }
  .blog-author-block .med-graphic {
    height: 120px;
    width: 120px;
    margin-left: auto;
    margin-right: auto;
  }
  .blog-author-description {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
  }
  .studio-ad {
    min-height: 0px;
  }

  .blog-item-image.not-featured {
    display: none;
  }
  #search {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    top: 20px;
  }
  .sortBy {
    float: none;
  }
  .blog-header {
    height: 100px;
  }
  /* Hiding pagination numbers on mobile */
  ul.pagination div.pagination li,
  .pages ul.pagination .pagination-page-numbers {
    display: none;
  }
  ul.pagination div.pagination li:first-of-type,
  ul.pagination div.pagination li:last-of-type {
    display: block;
  }

  span.blog-date {
    display: block;
    font-size: 12px;
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .blog-single-category {
   border-left: none;
   display: block;
  }
  .post .col6.keyline-right {
    border-right: none;
  }
  .tweet-page {
   right: 10px;
   margin-top: 0px;
  }
  .tag-page span.tag.tag-list {
    margin-bottom: 20px;
    margin-left: 0px;
  }

  .category-page .category-list {
    display: block;
    margin-bottom: 20px;
  }
  .tag-page h2.inline {
    display: block;
  }

}

@media only screen and  (max-width: 400px){
  .blog-twitter-block > a:first-of-type {
    min-height: 230px;
  }
}


/* Preloader */

#loader.is--loading {
  position: absolute;
  left: 45%;
  right:0;
  top: 140px;
}

#loader.is--loading .preloader {
  width: 25px;
  height: 25px;
  transform:rotate(45deg);
  -webkit-animation:  preloader-ani1 2.7s ease-in-out infinite;
  -moz-animation:     preloader-ani1 2.7s ease-in-out infinite;
  -ms-animation:      preloader-ani1 2.7s ease-in-out infinite;
  -o-animation:       preloader-ani1 2.7s ease-in-out infinite;
  animation:          preloader-ani1 2.7s ease-in-out infinite;
}

#loader.is--loading  .preloader i{
  width: 25px;
  height: 25px;
  display: inline-block;
  border-radius: 50%;
  position:absolute;

}
#loader.is--loading  .preloader i:nth-child(1){
  background: #39abc7;
  transform:translate(0,30px);
  -webkit-animation:  preloader-ani2 2.7s ease-in-out infinite;
  -moz-animation:     preloader-ani2 2.7s ease-in-out infinite;
  -ms-animation:      preloader-ani2 2.7s ease-in-out infinite;
  -o-animation:       preloader-ani2 2.7s ease-in-out infinite;
  animation:          preloader-ani2 2.7s ease-in-out infinite;
}
#loader.is--loading  .preloader i:nth-child(2){
  background: #3784ba;
  transform:rotate(90deg) translate(0,30px);
  -webkit-animation:  preloader-ani3 2.7s ease-in-out infinite;
  -moz-animation:     preloader-ani3 2.7s ease-in-out infinite;
  -ms-animation:      preloader-ani3 2.7s ease-in-out infinite;
  -o-animation:       preloader-ani3 2.7s ease-in-out infinite;
  animation:          preloader-ani3 2.7s ease-in-out infinite;
}
#loader.is--loading  .preloader i:nth-child(3){
  background: #8586c5;
  transform:rotate(180deg) translate(0,30px);
  -webkit-animation:  preloader-ani4 2.7s ease-in-out infinite;
  -moz-animation:     preloader-ani4 2.7s ease-in-out infinite;
  -ms-animation:      preloader-ani4 2.7s ease-in-out infinite;
  -o-animation:       preloader-ani4 2.7s ease-in-out infinite;
  animation:          preloader-ani4 2.7s ease-in-out infinite;
}
#loader.is--loading  .preloader i:nth-child(4){
  background: #495d77  ;
  transform:rotate(270deg) translate(0,30px);
  -webkit-animation:  preloader-ani5 2.7s ease-in-out infinite;
  -moz-animation:     preloader-ani5 2.7s ease-in-out infinite;
  -ms-animation:      preloader-ani5 2.7s ease-in-out infinite;
  -o-animation:       preloader-ani5 2.7s ease-in-out infinite;
  animation:          preloader-ani5 2.7s ease-in-out infinite;
}

@-webkit-keyframes preloader-ani1{
  25%{
    -webkit-transform:rotate(135deg);
  }
  50%{
    -webkit-transform:rotate(225deg);
  }
  75%{
    -webkit-transform:rotate(315deg);
  }
  100%{
    -webkit-transform:rotate(405deg);
  }
}

@-moz-keyframes preloader-ani1{
  25%{
    -moz-transform:rotate(135deg);
  }
  50%{
    -moz-transform:rotate(225deg);
  }
  75%{
    -moz-transform:rotate(315deg);
  }
  100%{
    -moz-transform:rotate(405deg);
  }
}

@-ms-keyframes preloader-ani1{
  25%{
    -ms-transform:rotate(135deg);
  }
  50%{
    -ms-transform:rotate(225deg);
  }
  75%{
    -ms-transform:rotate(315deg);
  }
  100%{
    -ms-transform:rotate(405deg);
  }
}

@-o-keyframes preloader-ani1{
  25%{
    -o-transform:rotate(135deg);
  }
  50%{
    -o-transform:rotate(225deg);
  }
  75%{
    -o-transform:rotate(315deg);
  }
  100%{
    -o-transform:rotate(405deg);
  }
}

@keyframes preloader-ani1{
  25%{
    transform:rotate(135deg);
  }
  50%{
    transform:rotate(225deg);
  }
  75%{
    transform:rotate(315deg);
  }
  100%{
    transform:rotate(405deg);
  }
}


@-webkit-keyframes preloader-ani2{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -webkit-transform:translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -webkit-transform:translate(0,25px);
  }
}
@-moz-keyframes preloader-ani2{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -moz-transform:translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -moz-transform:translate(0,25px);
  }
}
@-o-keyframes preloader-ani2{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -o-transform:translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -o-transform:translate(0,25px);
  }
}
@-ms-keyframes preloader-ani2{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -ms-transform:translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -ms-transform:translate(0,25px);
  }
}
@keyframes preloader-ani2{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    transform:translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    transform:translate(0,25px);
  }
}


@-webkit-keyframes preloader-ani3{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -webkit-transform:rotate(90deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -webkit-transform:rotate(90deg) translate(0,25px);
  }
}
@-moz-keyframes preloader-ani3{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -moz-transform:rotate(90deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -moz-transform:rotate(90deg) translate(0,25px);
  }
}
@-ms-keyframes preloader-ani3{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -ms-transform:rotate(90deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -ms-transform:rotate(90deg) translate(0,25px);
  }
}
@-o-keyframes preloader-ani3{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -o-transform:rotate(90deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -o-transform:rotate(90deg) translate(0,25px);
  }
}
@keyframes preloader-ani3{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    transform:rotate(90deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    transform:rotate(90deg) translate(0,25px);
  }
}


@-webkit-keyframes preloader-ani4{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -webkit-transform:rotate(180deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -webkit-transform:rotate(180deg) translate(0,25px);
  }
}
@-moz-keyframes preloader-ani4{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -moz-transform:rotate(180deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -moz-transform:rotate(180deg) translate(0,25px);
  }
}
@-ms-keyframes preloader-ani4{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -ms-transform:rotate(180deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -ms-transform:rotate(180deg) translate(0,25px);
  }
}
@-o-keyframes preloader-ani4{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -o-transform:rotate(180deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -o-transform:rotate(180deg) translate(0,25px);
  }
}
@keyframes preloader-ani4{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    transform:rotate(180deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    transform:rotate(180deg) translate(0,25px);
  }
}



@-webkit-keyframes preloader-ani5{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -webkit-transform:rotate(270deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -webkit-transform:rotate(270deg) translate(0,25px);
  }
}
@-moz-keyframes preloader-ani5{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -moz-transform:rotate(270deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -moz-transform:rotate(270deg) translate(0,25px);
  }
}
@-o-keyframes preloader-ani5{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -o-transform:rotate(270deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -o-transform:rotate(270deg) translate(0,25px);
  }
}
@-ms-keyframes preloader-ani5{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    -ms-transform:rotate(270deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    -ms-transform:rotate(270deg) translate(0,25px);
  }
}
@keyframes preloader-ani5{
  17.5%,25%,42.5%,50%,67.5%,75%,92.5%,100%{
    transform:rotate(270deg) translate(0,30px);
  }
  12.5%,37.5%,62.5%,87.5%{
    transform:rotate(270deg) translate(0,25px);
  }
}