/**
 * Styling for elements *around* embedded content from WordPress.
 */

.bg-gray {
  background: #e5e5e5;
}

.header-container {
  text-align: center;
  margin: 1.5rem auto;
}

.header-container p,
.header-container h2.title {
  margin: 0;
  text-transform: uppercase;
}

.site-header .site-logo { 
  margin-left: 0; 
}

.post-container {
  margin-top: 1rem;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.category-container {
  text-align: center;
}

.tag-container {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.sidebar .tagcloud a,
.tag {
  text-transform: capitalize;
  position: relative;
  overflow: hidden;
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
  margin: 0 0.50rem 0.25rem 0;
}

.sidebar .tagcloud a {
  padding: .25rem .5rem;
  background-color: #e5e5e5;
  color: #333;
  border-radius: 3px;
  display: inline-block;
  line-height: 1.5rem;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Helvetica, Arial, sans-serif;
  font-weight: 400;
  margin: 0 0.25rem 0.25rem 0;
}

.tag > * {
  position: relative;
  z-index: 1;
}

.tag:hover {
  text-decoration: none;
  border: 0;
}

.sidebar .tagcloud a:focus, 
.sidebar .tagcloud a:hover { 
  color: #222; /* IE11 */
  color: initial;
  text-decoration: none;
}

.sidebar .tagcloud a:before, 
.tag:before {
  content: ' ';
  background: rgba(0, 0, 0, 0.15);
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0; 
  transition-duration: 150ms;
}

.sidebar .tagcloud a:hover:before, 
.tag:hover:before {
  opacity: 1;
}

.breadcrumbs {
  display: inline-block;
  background-color: inherit;
  border: none;
  padding: .5625rem 0;
}

.breadcrumbs a {
  line-height: 1.4;
}

.breadcrumbs a:hover {
  border: 0;
}

.breadcrumbs > * {
  float: none;
  display: inline;
}

main {
  margin-top: 1rem;
}

main article {
  overflow: hidden;
  margin-bottom: 1rem;
}

main article * {
  max-width: 100%;
}

main ul {
  padding-left: 1.1rem;
}

main .bg-gray { 
  margin-top: -1rem; 
  margin-bottom: 1rem;
}

h1.title {
  text-align: center;
  margin-top: 0;
}

main a:focus,
main a:active,
main a:hover,
main button:focus,
main button:active,
main button:hover {
  /* IE11 fixes for no 'initial' support. */
  color: #222; 
  border: 0;    
  color: initial;
  border: initial;
}

.date-container {
  margin-top: 1rem;
  margin-bottom: 2rem;
  text-align: center;
}

.date-container .date {
  display: inline-block; 
  position: relative;
}

.date-container time {
  display: block;
  font-style: italic;
  font-size: 0.85rem;
  color: rgba(0, 0, 0, 0.3);
}

.date-container a {
  position: absolute; 
  top: 50%;
  right: -50px;
  transform: translateY(-50%);
  /* Match `.breadcrumbs>* a` font styling. */
  text-transform: uppercase;
  font-size: 11px;
  font-size: .6875rem;
  line-height: 11px;
  line-height: .6875rem;
}

main article.wp hr.wp-block-separator,
.date-container hr {
  margin: auto;
  margin-top: 0.5rem;
  width: 120px;
  max-width: 90%;
  background: rgba(0, 0, 0, 0.1);
  border: 0;
  border-radius: 2px;
  height: 1px;
}

.standard-container, .row {
  max-width: 1190px; /* 1140px + 0.9375rem * 2 + 0.625rem * 2 (slider width + padding) */
}

@media only screen and (min-width: 48em) {
  .site-header .site-search, 
  .site-header .site-quick-links {
    right: 1.5625rem;
  }

  .site-header .standard-container { 
    padding-left: 1.5625rem;
    padding-right: 1.5625rem;
  }
}

@media only screen and (max-width: 820px) { 
  .site-header .header-social-icons { 
    display: none; 
  }
}

body nav#top-menu {
  margin-top: 1rem;
}

.sidebar li {
  list-style: none;
  margin: 1rem 0 2rem;
  border-width: 1px;
  border-style: solid;
  padding: .5625rem .875rem;
  background-color: #f3f3f3;
  border-color: #dbdbdb;
  border-radius: 3px;
}

.sidebar h2 {
  font-size: 1.4rem;
  border-bottom: solid 1px rgba(0, 0, 0, 0.1);
  margin-bottom: 1rem;
  padding-bottom: 1rem;
}

.sidebar .widgettitle {
  font-weight: 300;
  text-align: center;
}

.sidebar .widget .strong-view.wpmtst-modern .wpmtst-testimonial-inner {
  padding: 0;
}

.sidebar .strong-view.wpmtst-modern.nav-position-inside .wpmtst-testimonial-inner {
  padding-bottom: 60px;
}

.sidebar .widget .strong-view.wpmtst-modern .wpmtst-testimonial-content {
  margin: 0;
}

.sidebar .display-posts-listing {
  margin: 0;
  padding: 0;
}

.sidebar .listing-item {
  border: 0;
  padding: 0;
  margin: 0 0 1rem;
}

.sidebar .listing-item:last-of-type {
  margin-bottom: 0; 
}

.sidebar .listing-item .title {
  opacity: 0.9;
  color: #222;
  margin: 0;
  padding: 0;
}

.sidebar .listing-item .title:hover {
  opacity: 1;
  text-decoration: underline;
}

.sidebar .listing-item span.date {
  display: block;
  color: rgba(0, 0, 0, 0.5);
  font-style: italic;
  font-size: .75rem;
}

.sidebar .small-block-grid-7 {
  display: flex;
  jusify-content: space-around;
  text-align: center;
  padding: 0 1rem;
}

.sidebar .social-icon {
  padding: 0;
  margin: 0;
  border: 0;
  font-size: 1rem;
  color: #222;
}

/* About Chief Architect. */ 
.sidebar > li:nth-of-type(1) img {
  max-width: 200px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media (min-width: 650px) and (max-width: 1024px) {
  .sidebar {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 2rem;
  }

  .sidebar .textwidget {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 1024px) {
  /* Connect With Us. */
  .sidebar > li:nth-of-type(2) {
    display: none;
  }
}

.media-container {
  background: #f3f3f3;
  border-radius: 3px;
  overflow: hidden;
  margin: 1rem 0;
}

.media-container .media {
  background-position: center center;
  background-size: cover;
  width: 100%;
}

.wp .blocks-gallery-item,
.wp figure, 
.wp img { 
  border-radius: 3px;
}

.button-container {
  text-align: center;
  margin: 2rem 0;
}

.button-container a {
  margin-bottom: 0;
}

.action-container {
  display: flex;
  justify-content: space-between;
  margin: 2rem 0;
}

.share-container, .respond-container a {
  transition-duration: 250ms;
  font-size: 0.8rem;
  color: #8e9da5;
}

.share-container:hover, .respond-container a:hover {
  color: #000000;
}

/* Only show hover share options if use has no-touch. */
.no-touch .share-container a[href] {
  opacity: 0;
  transition-duration: 250ms;
}

.no-touch .share-container:hover a[href] {
  opacity: 1;
}

.share-container span, 
.share-container a[href] {
  margin-left: 0.5rem;
}

@media (max-width: 748px) {
  .top-bar-section ul.header-social-icons {
    display: none;
  }
}

@media (min-width: 748px) {
  /* On desktop line up margins with left of navigation and article text. */
  .menu-item-first { 
    margin-left: -0.91667rem;
  }
}

.tags-container {
  margin: 2rem 0;
}

.tags-container .radius.secondary.label {
  font-size: 1rem;
  transition-duration: 250ms;
  margin: 0 0.5rem 0.5rem 0;
}

.tags-container .radius.secondary.label:hover {
  background: #b7b7b7;
}

.direction-container {
  width: 100%;
  margin: 2rem 0;
  border: 0;
}

.direction-container .next {
  text-align: right;
}

.reply-container {
  margin: 2rem 0;
}

.reply-container hr { 
  margin-top: 0;
}

.reply-container h3 {
  text-align: center;
  margin-bottom: 2rem;
}

.reply-item {
  border: solid #ddd;
  border-width: 1px 0 0;
  padding: 2rem 0 0;
}

main .reply-item a.reply-url {
    color: #80a030;
}

main .reply-item a.reply-url:hover {
  text-decoration: underline;
}

.reply-content {
  display: flex;
}

.reply-content .img-container {
  flex-shrink: 0;
  margin-right: 2rem;
  margin-bottom: 2rem;
  overflow: hidden;
}

.reply-content .img-container img {
  width: 70px;
  height: 70px;
  border-radius: 50%;
}

.reply-item:before {
  content: ' ';
  clear: both;
}

.reply-item .reply-item {
  padding-left: 40px;
}

.reply-text {
  margin-top: 1rem;
}

.reply-container input[type=submit], .reply-btn, .edit-btn {
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
}

.reply-btn,
.edit-btn {
  float: right;
  margin: 0 0 1.25rem 1.25rem;
}

.reply-item .date-container {
  text-align: left;
  margin: 0;
}

#reply-form {
  margin-top: 1rem;
}

#reply-form textarea {
  min-height: 125px;
}

.reply-create-container h3 {
  margin-top: 2rem;
}

.reply-inner {
  flex: 1;
  max-width: calc(100% - 56px);
  margin-bottom: 2rem;
}

@media (min-width: 640px) { 
  .related-container .row { 
    display: flex;
    justify-content: center;
  }
}

.reply-username, 
.reply-url,
.reply-text,
.reply-text * { 
  text-overflow: ellipsis;
  overflow: hidden;
}

.reply-username { 
  color: #222; /* IE11 */
  color: initial;
}

.reply-username, 
.reply-date {
  margin-right: 75px;
}

.reply-url .reply-username { 
  color: #80a030;
}

@media (min-width: 760px) {
  .reply-inner {
    flex: 1;
    max-width: calc(100% - 102px);
  }

  .reply-username, 
  .reply-url {
    margin-right: 100px;
  }
}

@media (max-width: 760px) {
  .reply-content .img-container img {
    width: 40px;
    height: 40px;
  }

  .reply-item .reply-item {
    padding-left: 10px;
  }

  .reply-content .img-container {
    margin-right: 1rem;
    margin-bottom: 1rem;
  }
}

.related-container {
  margin: 2rem 0;
}

@media (min-width: 640px) {
  .related-container h3 {
    text-align: center;
  }
}

.related-container a:hover h4 {
  text-decoration: underline;
}

.related-container time {
  display: block;
  color: rgba(0, 0, 0, 0.5);
  font-style: italic;
  font-size: .75rem;
}

/* Closer img/button for lightbox. */
.nivo-lightbox-theme-default .nivo-lightbox-close {
  background: url(../png/close-2.png) no-repeat 5px 5px;
  border: 0;
}

/* Proper link/hover styling. */
main a h1 {
  transition-duration: 250ms;
}

main a h1:hover {
  opacity: 0.5;
}

.site-footer-nav-column-head:hover {
  border-bottom: 2px solid #484848;
}

.accordion {
  margin-bottom: 1rem;
}

.accordion li {
  display: inline-block;
  font-size: .75rem;
  margin: 1rem;
}

.accordion.site-footer-nav {
  margin-bottom: 1.75rem;
}

.accordion.site-footer-nav li {
  margin-bottom: 0;
}

@media (max-width: 550px) {
  .accordion {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }

  .accordion li {
    margin: .75rem;
  }
}

@media (max-width: 400px) {
  .hide-for-xsmall {
    display: none !important;
  }
}

/* Fixing default link hover behavior on IE11. */
.border-0 {
  border: 0;
}

.border-0:hover {
  border: 0;
}

.top-bar-section ul.header-social-icons li:not(.has-form) a:not(.button) {
  font-family: caicon;
  padding: 0 0.5rem;
}

.top-bar-section ul.header-social-icons li:not(.has-form) a:not(.button).last { 
  padding-right: 0; 
}

.top-bar .mobile-social-icon-container { 
  display: flex;
  justify-content: space-around;
  align-items: center;
  color: #222;
  width: 200px;
  max-width: 75%;
  margin-left: 5px;
}

.mobile-social-icon-container a { 
  color: #222;
}

.top-bar-section ul.header-social-icons li.social-icon:hover,
.top-bar-section ul.header-social-icons li.social-icon:hover:not(.has-form) a {
  background: none; 
}

/* Fix width of figure. */
.wp figure {
  margin-left: 0;
  margin-right: 0;
}

/* Delimiters. */
.breadcrumbs>:before {
  display: none;
}

.breadcrumbs>:not(:last-of-type):after {
  color: #aaa;
  content: "/";
  margin: 0 12px;
  margin: 0 .75rem;
  position: relative;
  top: 1px;
}

.breadcrumbs>* { 
  display: inline-block;
}

@media (max-width: 768px) {
  .site-quick-links li+li:before { 
    display: none;
  }
  
  .site-header .site-quick-links>li:first-of-type, 
  .site-quick-links>li {
    margin-left: 0 !important;
  }
  
  .site-header .site-quick-links { 
    margin-left: 15px;
  }
  
  .site-quick-links li:not(:last-of-type) a:after { 
    content: "|";
    color: #bcbcbc;
    margin: 0 0.5rem; 
  }
}

/* IE11 fix. Sidebar slider buttons were not clickable. */
.strong-view.nav-position-inside:not(.controls-type-sides) .wpmslider-controls { 
  z-index: 50;
}

.preview-warning {
    background: #eed202; /* safety yellow */
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: #333;
}

.preview-warning .fa {
    padding-right: 0.75rem;
    font-size: 1.5rem;
}