/* ==========================================================================
   Reveal Retro WP - Grid/Flex Clean CSS
   Purpose: keep original Reveal dimensions, but use modern flex/grid for
   consistent gap, spacing, responsive behavior.
   ========================================================================== */

:root {
  --site-width: 950px;
  --main-width: 625px;
  --main-inner-width: 608px;
  --sidebar-width: 307px;
  --gap: 15px;

  --bg-page: #000;
  --bg-wrap: #F6F6F6;
  --bg-card: #fff;
  --border-soft: #E3E3DB;
  --border-card: #d9e0e7;

  --text: #424242;
  --text-muted: #636464;
  --text-soft: #64748b;
  --heading: #334155;
  --accent: #DB3702;
  --accent-hover: #FF6F40;
  --dark: #252524;
}

/* Base
----------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: #ededed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  position: relative;
  min-height: 100%;
  margin: 0;
  padding: 0;
  background: #ededed;
  color: #424242;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.6;
  overflow-x: hidden;
}

/* JS animated background canvas */
#reveal-animated-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  background: #ededed;
}

#body-wrapper {
  position: relative;
  z-index: 1;
  background: transparent;
}



/* html {
  min-height: 100%;
  background: var(--bg-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  min-height: 100%;
  margin: 0;
  padding: 0;
  background:
    radial-gradient(ellipse 120% 80% at 70% 20%, rgba(255, 20, 147, 0.15), transparent 50%),
    radial-gradient(ellipse 100% 60% at 30% 10%, rgba(0, 255, 255, 0.12), transparent 60%),
    radial-gradient(ellipse 90% 70% at 50% 0%, rgba(138, 43, 226, 0.18), transparent 65%),
    radial-gradient(ellipse 110% 50% at 80% 30%, rgba(255, 215, 0, 0.08), transparent 40%),
    #000;
  background-attachment: fixed;
  color: var(--text);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.6;
} */

a:link,
a:visited {
  color: var(--accent);
  text-decoration: underline;
  outline: none;
}

a:hover {
  color: var(--accent-hover);
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  border: 0;
}

p {
  margin: 0 0 12px;
}

blockquote {
  overflow: hidden;
  margin: 0 0 14px;
  padding-left: 10px;
  border-left: 3px solid #CADAE7;
  color: var(--text-soft);
  font-style: italic;
}

.clear,
.clearfix,
.clerfix {
  clear: both;
}

.screen-reader-text {
  position: absolute;
  left: -9999px;
}

/* Main layout: original sizes, modern grid/flex
----------------------------------------------- */
/* #body-wrapper {
  background: transparent;
} */

#body-wrapper {
  position: relative;
  z-index: 1;
  background: transparent;
}

#outer-wrapper {
  width: var(--site-width);
  margin: 0 auto;
  padding: 0;
  background: var(--bg-wrap);
}

#wrap2 {
  width: var(--site-width);
  margin: 0;
  padding: 0;
  background: var(--bg-wrap);
}

#content-wrapper {
  width: var(--site-width);
  display: grid;
  grid-template-columns: var(--main-width) var(--sidebar-width);
  column-gap: var(--gap);
  align-items: start;
  padding: 0;
  background: var(--bg-wrap);
  overflow: hidden;
}

/* Keep original width behavior, but use grid for vertical rhythm */
#main-wrapper {
  width: var(--main-width);
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr;
  row-gap: var(--gap);
  align-content: start;
  padding: 10px 0 0 15px;
  margin: 0;
  overflow: hidden;
  word-wrap: break-word;
}

#rsidebar-wrapper {
  width: var(--sidebar-width);
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 10px 0 15px;
  margin: 0 5px 0 0;
  overflow: hidden;
  word-wrap: break-word;
}

/* post loop wrapper */
.blog-posts,
.blog-posts.hfeed {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  row-gap: var(--gap);
}

/* grid gap handles vertical spacing */
#main-wrapper > *,
.blog-posts > *,
#rsidebar-wrapper > * {
  margin-top: 0;
  margin-bottom: 0;
}

/* legacy span classes kept for existing markup */
.span-24 {
  width: var(--site-width);
  margin: 0;
}

.span-16 {
  width: 630px;
  margin: 0;
}

.span-8 {
  width: 310px;
  margin: 0;
}

.last {
  margin-right: 0;
  padding-right: 0;
}

/* Header
----------------------------------------------- */
#header-wrapper {
  width: var(--site-width);
  min-height: 102px;
  display: grid;
  grid-template-columns: minmax(0, 47%) minmax(0, 51%);
  column-gap: 2%;
  align-items: center;
  margin: 0 auto;
  padding: 21px 0;
  overflow: hidden;
}

#header,
#header2 {
  min-width: 0;
  overflow: hidden;
}

#header2 {
  display: flex;
  justify-content: flex-end;
}

#header2 .widget {
  padding: 0 10px;
}

#header h1,
#header .title {
  margin: 0 5px 0 0;
  padding: 0 0 0 10px;
  color: #3B3C3B;
  font: 700 40px/40px Arial, Helvetica, sans-serif;
  letter-spacing: -1px;
}

#header h1 a,
#header .title a {
  color: #3B3C3B;
  text-decoration: none;
}

#header .description,
#header .site-description {
  margin: 5px 0 0;
  padding-left: 17px;
  color: #3B3C3B;
  font-size: 14px;
  line-height: 14px;
}

.reveal-text-logo {
  min-height: 60px;
  padding-left: 10px;
}

.reveal-text-logo a {
  display: inline-flex;
  align-items: center;
  color: #3B3C3B;
  text-decoration: none;
}

.reveal-mark {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 52px;
  margin-right: 8px;
}

.reveal-mark::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 2px;
  width: 14px;
  height: 14px;
  background: var(--accent);
  border: 2px solid #f47c1b;
  border-radius: 50%;
  box-shadow: 0 1px 1px rgba(0,0,0,0.35);
}

.reveal-mark::after {
  content: "";
  position: absolute;
  left: 0;
  top: 18px;
  width: 0;
  height: 0;
  border-left: 22px solid transparent;
  border-right: 22px solid transparent;
  border-bottom: 36px solid #ff5a00;
  filter: drop-shadow(0 2px 1px rgba(0,0,0,0.35));
}

.reveal-word {
  color: #333;
  font: 700 48px/54px Arial, Helvetica, sans-serif;
  letter-spacing: -4px;
}

.site-logo.reveal-logo img {
  display: block;
  width: auto;
  max-height: 40px;
  padding-left: 10px;
}

.header-ad-placeholder {
  width: 468px;
  height: 60px;
  margin: 0 10px 0 0;
  border: 3px solid #bdbdbd;
  background: #eee;
  color: #999;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
}

.header-ad-placeholder span {
  display: block;
  padding-top: 6px;
  font-size: 30px;
  line-height: 30px;
  font-weight: 700;
}

.header-ad-placeholder small {
  display: block;
  margin-top: -2px;
  font-size: 15px;
  line-height: 15px;
  font-weight: 700;
}

/* Primary top row: modern grid with original dimensions
----------------------------------------------- */
.top-menu-row {
  width: var(--site-width);
  min-height: 38px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: var(--gap);
  align-items: start;
}

.top-menu-row .span-16,
.top-menu-row .span-8 {
  width: auto;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0;
}

/* Menus
----------------------------------------------- */
.menus,
.menus * {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 1;
}

.menus {
  display: flex;
  flex-wrap: nowrap;
}

.menus li {
  position: relative;
  flex: 0 0 auto;
}

.menus a {
  display: block;
  position: relative;
}

.menus ul {
  position: absolute;
  top: -999em;
  width: 160px;
  z-index: 99;
  display: block;
}

.menus li:hover > ul,
.menus li.sfHover > ul {
  left: 0;
  top: 100%;
}

.menus li li:hover > ul,
.menus li li.sfHover > ul {
  left: 100%;
  top: 0;
}

.menus ul li {
  width: 100%;
}

/* Primary menu */
.menu-primary-wrap {
  width: 100%;
  height: 38px;
  position: relative;
  z-index: 400;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  background: url("http://2.bp.blogspot.com/-E1Eew1cnfHE/Vquh1A1T1PI/AAAAAAAAAC0/S7YyeR3WyRA/s000/menu-primary-bg.png") left top repeat-x;
}

.menu-primary {
  width: max-content;
  min-width: 100%;
  height: 38px;
  background: transparent;
}

.menu-primary li {
  background: transparent;
}

.menu-primary li a {
  height: 38px;
  padding: 14px 15px;
  color: #242423;
  background: transparent;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  font: 400 11px Arial, Helvetica, sans-serif;
}

.menu-primary li a:hover,
.menu-primary li.current-menu-item > a,
.menu-primary li.current_page_item > a {
  color: #5B5B59;
  background: url("http://2.bp.blogspot.com/-E1Eew1cnfHE/Vquh1A1T1PI/AAAAAAAAAC0/S7YyeR3WyRA/s000/menu-primary-bg.png") left -138px repeat-x;
}

.menu-primary li li a {
  height: auto;
  padding: 6px 15px;
  background: #EDEDE6;
  color: #666464;
  text-transform: none;
  line-height: 14px;
}

.menu-primary li li a:hover {
  background: #D8D8D5;
}

/* Secondary menu */
.secondary-menu-toggle {
  display: none;
}

.secondary-menu-row {
  width: var(--site-width);
}

.menu-secondary-wrap {
  width: 100%;
  height: 38px;
  position: relative;
  z-index: 300;
  background: var(--dark);
  overflow: visible;
}

.menu-secondary {
  width: 100%;
  height: 38px;
  background: var(--dark);
}

.menu-secondary li {
  background: var(--dark);
  border-right: 1px solid #3b3b3a;
}

.menu-secondary li a {
  height: 38px;
  padding: 12px 18px 0;
  color: #fff;
  background: transparent;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  font: 700 11px Arial, Helvetica, sans-serif;
}

.menu-secondary li a:hover,
.menu-secondary li.current-menu-item > a,
.menu-secondary li.current_page_item > a {
  color: #fff;
  background: #111;
}

.menu-secondary li li {
  border-right: 0;
  background: none;
}

.menu-secondary li li a {
  height: auto;
  padding: 10px 15px;
  background: var(--accent);
  text-transform: none;
  font-weight: 400;
  line-height: 14px;
}

.menu-secondary li li a:hover {
  background: #E74C1A;
}

/* Search
----------------------------------------------- */
.topsearch {
  width: 100%;
  margin: 8px 0 0;
  padding: 0;
}

#search {
  width: 100%;
  height: 30px;
  overflow: hidden;
  border: 1px solid #D8D8D5;
  background: #fff;
  text-align: left;
}

#searchform {
  display: flex;
  width: 100%;
  height: 30px;
  margin: 0;
  padding: 0;
}

#search #s,
#search .search-field {
  width: calc(100% - 34px);
  height: 28px;
  margin: 0;
  padding: 4px 6px;
  border: 0;
  background: none;
  color: #707070;
  font: 12px Arial, Verdana, sans-serif;
  outline: none;
}

#search .search-submit {
  width: 34px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

#search .search-image {
  width: 16px;
  height: 16px;
  margin: 6px 4px 0 2px;
}

/* Featured slider
----------------------------------------------- */
.featuredposts {
  width: 100%;
  max-width: var(--main-inner-width);
  height: 426px;
  overflow: hidden;
  position: relative;
  border: 1px solid var(--border-soft);
  background: #fff;
}

.fp-slides {
  position: relative;
  width: 100%;
  height: 389px;
  overflow: hidden;
}

.fp-post {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 389px;
  padding: 13px;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  transition: opacity 600ms ease;
}

.fp-post.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

.fp-thumbnail {
  width: 100%;
  height: 300px;
  margin-bottom: 10px;
  overflow: hidden;
  background: #f5f5f5;
}

.fp-thumbnail img {
  display: block;
  width: 100%;
  height: 300px;
  max-width: none;
  object-fit: cover;
  padding: 0;
  border: 0;
  background: transparent;
}

.fp-title {
  margin: 0 0 10px;
  color: #444545;
  font: 700 21px/1.15 Arial, Helvetica, sans-serif;
}

.fp-title a {
  color: #444545;
  text-decoration: none;
}

.fp-title a:hover {
  color: var(--accent);
}

.fp-post p {
  height: 32px;
  overflow: hidden;
  margin: 0;
  padding: 0;
  color: var(--text);
  font: 12px/16px Arial, Helvetica, sans-serif;
}

.fp-nav {
  width: 100%;
  height: 35px;
  padding: 8px 10px;
  background: #fff;
}

.fp-pager {
  float: left;
}

.fp-pager a {
  display: block;
  float: left;
  width: 10px;
  height: 10px;
  margin: 3px 6px 0 0;
  overflow: hidden;
  text-indent: -999px;
  background: url("http://3.bp.blogspot.com/-788PlBF8ax8/Vquh3F251_I/AAAAAAAAADg/72BSXA012fw/s000/featured-pager.png") 0 0 no-repeat;
}

.fp-pager a:hover,
.fp-pager a.activeSlide {
  background-position: 0 -110px;
}

.fp-prev,
.fp-next {
  float: right;
  width: 15px;
  height: 17px;
  overflow: hidden;
  opacity: 0.7;
  text-indent: -999px;
}

.fp-prev {
  margin-right: 4px;
  background: url("http://3.bp.blogspot.com/-S42wLZiDvCg/Vquh3cUgt7I/AAAAAAAAADo/urhRz1x0QAw/s000/featured-prev.png") top left no-repeat;
}

.fp-next {
  margin-left: 4px;
  background: url("http://2.bp.blogspot.com/-v8IlezS7-4g/Vquh35aXscI/AAAAAAAAADw/9hTlI8IF-Ik/s000/featured-next.png") top left no-repeat;
}

.fp-prev:hover,
.fp-next:hover {
  opacity: 1;
}

/* Cards and posts
----------------------------------------------- */
.post,
.entry-card {
  width: 100%;
  max-width: var(--main-inner-width);
  overflow: hidden;
  border: 1px solid var(--border-soft);
  background: #fff;
}

.blog-card-modern {
  display: flex;
  align-items: stretch;
  padding: 0;
  border-color: var(--border-card);
  border-radius: 3px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.blog-card-image {
  width: 245px;
  min-width: 245px;
  align-self: stretch;
  overflow: hidden;
  background: #f3f4f6;
}

.blog-card-image a,
.blog-card-image img {
  display: block;
  width: 100%;
  height: 100%;
}

.blog-card-image img {
  min-height: 100%;
  object-fit: cover;
  object-position: center;
  padding: 0;
  border: 0;
  background: transparent;
}

.blog-card-image-placeholder {
  width: 100%;
  height: 100%;
  min-height: 180px;
  background: #f3f4f6;
}

.blog-card-content {
  flex: 1;
  min-width: 0;
  padding: 22px 24px 18px;
  background: #fff;
}

.blog-card-category {
  margin: 0 0 10px;
  color: var(--accent);
  font: 700 13px/1.2 Arial, Helvetica, sans-serif;
}

.blog-card-category a {
  color: var(--accent);
  text-decoration: none;
}

.blog-card-category a:hover {
  color: #059669;
}

.blog-card-title,
.post-title,
.entry-title {
  margin: 0 0 10px;
  padding: 0;
  color: var(--heading);
  font: 700 21px/1.3 Arial, Helvetica, sans-serif;
  letter-spacing: -0.02em;
}

.blog-card-title a,
.post-title a,
.entry-title a {
  display: block;
  color: var(--text);
  text-decoration: none;
}

.blog-card-title a:hover,
.post-title a:hover,
.entry-title a:hover {
  color: var(--accent);
}

.blog-card-excerpt,
.blog-card-excerpt p,
.entry-content,
.entry-content p,
.entry-summary,
.entry-summary p,
.post-body,
.post-body p {
  color: var(--text);
  font-size: 13px;
  line-height: 1.6;
  font-weight: 400;
}

.blog-card-excerpt {
  margin: 0 0 14px;
  padding: 0 0 14px;
  border-bottom: 1px dashed #cbd5e1;
}

.blog-card-excerpt p {
  margin: 0;
  padding: 0;
}

.blog-card-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-soft);
  font: 600 12px/1.2 Arial, Helvetica, sans-serif;
}

.blog-card-author,
.blog-card-date {
  display: inline-flex;
  align-items: center;
}

.blog-card-author::before {
  content: "✎";
  margin-right: 5px;
  color: var(--text-soft);
  font-size: 11px;
  line-height: 1;
}

.blog-card-date::before {
  content: "□";
  margin-right: 5px;
  color: var(--text-soft);
  font-size: 9px;
  line-height: 1;
}

.blog-card-dot {
  color: var(--text-soft);
  font-weight: 700;
}

/* Old Reveal post fallback */
.post:not(.blog-card-modern) {
  padding: 10px 10px 0;
}

.postmeta-primary,
.entry-meta,
.postmeta-secondary {
  padding: 0 0 15px;
  color: var(--text-soft);
  font: 500 11px/1.45 Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.post-body img,
.entry-content img,
.entry-summary img {
  padding: 6px;
  border: 1px solid #E7E9E7;
  background: #fff;
}

.post-thumbnail {
  float: left;
  width: 220px;
  padding: 0 10px 5px 0;
}

.post-thumbnail img {
  display: block;
  width: 200px;
  height: 150px;
  max-width: none;
  object-fit: cover;
}

.readmore-wrap {
  float: right;
  margin-bottom: 15px;
}

a.readmore {
  display: block;
  padding: 6px 14px 6px 20px;
  background: #C0C2C0;
  color: #545454;
  font-size: 12px;
  line-height: 12px;
  text-decoration: none;
}

a.readmore:hover {
  background: var(--accent);
  color: #fff;
}

/* Content typography
----------------------------------------------- */
.entry-content h2,
.entry-summary h2,
.post-body h2 {
  margin: 18px 0 10px;
  color: var(--heading);
  font: 700 21px/1.3 Arial, Helvetica, sans-serif;
}

.entry-content h3,
.entry-summary h3,
.post-body h3 {
  margin: 16px 0 8px;
  color: var(--heading);
  font: 700 16px/1.35 Arial, Helvetica, sans-serif;
}

.entry-content h4 {
  font-size: 15px;
  line-height: 1.4;
}

.entry-content h5 {
  font-size: 13px;
  line-height: 1.45;
}

.entry-content h6 {
  font-size: 12px;
  line-height: 1.5;
}

.entry-content ul,
.entry-content ol {
  margin: 0 0 15px 25px;
  padding: 0;
}

.entry-content li {
  margin: 0 0 5px;
}

.entry-content table {
  width: 100%;
  margin: 0 0 15px;
  border-collapse: collapse;
}

.entry-content th,
.entry-content td {
  padding: 6px;
  border: 1px solid var(--border-soft);
}

.entry-content th {
  background: var(--bg-wrap);
}

/* Sidebar
----------------------------------------------- */
.sidebar,
#rsidebar-wrapper {
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.55;
}

.sidebar a,
#rsidebar-wrapper a {
  color: var(--text-muted);
  text-decoration: none;
}

.sidebar a:hover,
#rsidebar-wrapper a:hover {
  color: var(--accent);
}

.sidebar .widget,
.sidebar-widget,
#rsidebar-wrapper .widget {
  padding: 0;
}

.sidebar h2,
.sidebar .widget-title,
.sidebar-widget .widget-title,
#rsidebar-wrapper .widget-title,
#footer-column-container h2,
#footer-column-container .widget-title {
  margin: 0 0 10px;
  padding: 8px 0 8px 4px;
  background: var(--dark);
  color: #fff;
  font: 700 16px/16px Arial, Helvetica, sans-serif;
  text-transform: uppercase;
}

.sidebar ul,
.sidebar-widget ul,
#rsidebar-wrapper ul,
#footer-column-container ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sidebar li,
.sidebar-widget li,
#rsidebar-wrapper li,
#footer-column-container li {
  margin: 0;
  padding: 6px 0;
  background: url("http://4.bp.blogspot.com/-7KpzOH8zYdk/Vquh4HWEGzI/AAAAAAAAAD0/FCCDtugjMck/s000/widget-line.png") left bottom repeat-x;
  font-size: 13px;
  line-height: 17px;
}

.sidebar p,
.sidebar-widget p,
#rsidebar-wrapper p {
  margin: 0 0 10px;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.55;
}

#rsidebar-wrapper .search-field,
.sidebar-widget .search-field {
  width: calc(100% - 86px);
  height: 30px;
  padding: 5px;
  border: 1px solid #999;
  background: #fff;
  font-size: 13px;
}

#rsidebar-wrapper .search-submit,
.sidebar-widget .search-submit {
  width: 80px;
  height: 30px;
  border: 0;
  background: #292D31;
  color: #fff;
  font: 700 13px Arial, Verdana, sans-serif;
  cursor: pointer;
}

/* Social widget
----------------------------------------------- */
.reveal-social-widget {
  padding: 0;
  background: transparent;
}

.social-connect-widget {
  min-height: 46px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid #DCE1DC;
  background: #fff;
}

.social-connect-widget:hover {
  border-color: #EDEDE6;
  background: #D9D9D0;
}

.social-connect-widget a {
  display: flex;
  align-items: center;
  color: var(--text-muted);
  text-decoration: none;
  font: 600 12px/1.45 Arial, Helvetica, sans-serif;
}

.social-connect-widget a:hover {
  color: var(--accent);
  text-decoration: underline;
}

.reveal-social-icon,
.mini-social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  border-radius: 3px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  text-decoration: none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.35),
    0 1px 1px rgba(0,0,0,0.12);
}

.reveal-social-icon {
  width: 26px;
  height: 26px;
  min-width: 26px;
  margin-right: 8px;
  font-size: 10px;
}

.reveal-social-rss,
.mini-rss { background: #ff8a00; }
.reveal-social-twitter,
.mini-twitter { background: #55acee; }
.reveal-social-facebook,
.mini-facebook { background: #3b5998; }
.mini-digg { background: #4b6f9f; }
.mini-stumble { background: #45bf55; }
.mini-star { background: #f7c948; }
.mini-plus { background: #58b947; font-size: 15px; }

.reveal-social-icons-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  padding: 8px 8px 7px;
  border: 1px solid #DCE1DC;
  background: #fff;
}

.reveal-social-icons-row:hover {
  border-color: #EDEDE6;
  background: #f7f7f2;
}

.mini-social {
  width: 24px;
  height: 24px;
  overflow: hidden;
  font-size: 10px;
}

.mini-social:hover {
  opacity: 0.85;
  color: #fff;
}

/* Comments, pagination, forms
----------------------------------------------- */
#comments {
  padding: 10px;
  border: 1px solid var(--border-soft);
  background: #fff;
}

.comment-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.comment-list li {
  margin: 0 0 10px;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 8px;
  background: #efefef;
}

.comment-form label {
  display: block;
  margin: 0 0 4px;
  font-weight: 700;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea,
input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
textarea {
  border: 1px solid #ccc;
  background: #fff;
  color: #494848;
  font-family: Arial, Verdana, sans-serif;
}

.comment-form input[type="submit"] {
  padding: 6px 14px;
  border: 0;
  background: #C0C2C0;
  color: #545454;
  cursor: pointer;
}

.comment-form input[type="submit"]:hover {
  background: var(--accent);
  color: #fff;
}

#blog-pager,
.navigation.pagination {
  width: 100%;
  max-width: var(--main-inner-width);
  clear: both;
  padding: 6px 10px;
  text-align: center;
}

.page-numbers {
  display: inline-block;
  margin: 0 4px;
  padding: 5px 9px;
  color: #232323;
  text-decoration: none;
  font: 15px Arial, Verdana, sans-serif;
}

.page-numbers.current {
  background: #756857;
  color: #fff;
  font-weight: 700;
}

.page-numbers:hover {
  background: #d05043;
  color: #fff;
}

/* Footer: modern grid, original width
----------------------------------------------- */
#footer-wrap {
  width: var(--site-width);
}

#footer {
  margin-top: var(--gap);
}

#footer-column-container {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--gap);
  padding: 0 10px 10px;
  border-top: 4px solid #ccc;
  background: #f6f6f6;
  color: var(--text-muted);
  overflow: hidden;
}

#footer-column-container .span-8,
#footer-column-container .footer-column,
#footer-column-container .widget {
  width: auto;
  float: none;
  margin: 0;
}

.footer-column {
  padding: 4px 0;
}

#footer-column-container a {
  color: var(--text-muted);
  text-decoration: none;
}

#footer-column-container a:hover {
  color: var(--accent);
}

#copyrights {
  padding: 20px 0;
  background: #252524;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 0 #fff;
  font-size: 12px;
}

#credits {
  padding: 10px 0;
  color: #666;
  text-align: center;
  text-shadow: 0 1px 0 #fff;
  font-size: 11px;
}

/* WordPress classic content
----------------------------------------------- */
.alignleft { float: left; margin: 0 10px 10px 0; }
.alignright { float: right; margin: 0 0 10px 10px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; padding: 6px; border: 1px solid #E7E9E7; background: #fff; }
.wp-caption img { padding: 0; border: 0; }
.wp-caption-text { margin: 5px 0 0; color: #666; text-align: center; font-size: 11px; }
.gallery { margin: 0 0 15px; }
.gallery-item { display: inline-block; width: 33.333%; text-align: center; vertical-align: top; }
.sticky { border-color: var(--accent); }
.bypostauthor { display: block; }

/* Tablet
----------------------------------------------- */
@media (min-width: 701px) and (max-width: 980px) {
  html,
  body {
    overflow-x: hidden;
  }

  #outer-wrapper,
  #wrap2,
  #content-wrapper,
  #header-wrapper,
  #footer-wrap,
  .top-menu-row,
  .secondary-menu-row,
  .span-24 {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
    margin-left: auto;
    margin-right: auto;
  }

  #content-wrapper {
    grid-template-columns: minmax(0, 1fr) 292px;
    column-gap: var(--gap);
  }

  #main-wrapper {
    width: 100%;
    padding: 10px 0 0 12px;
  }

  #rsidebar-wrapper {
    width: 292px;
    margin: 0 8px 0 0;
  }

  .top-menu-row {
    grid-template-columns: minmax(0, 1fr) minmax(240px, 310px);
  }

  #header-wrapper {
    grid-template-columns: minmax(0, 45%) minmax(0, 53%);
    column-gap: 2%;
    height: auto;
    padding: 18px 0;
  }

  .reveal-word {
    font-size: 42px;
    line-height: 48px;
  }

  .header-ad-placeholder {
    width: 100%;
    max-width: 420px;
  }

  .menu-secondary-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
  }

  .menu-secondary {
    width: max-content;
    min-width: 100%;
  }

  .featuredposts {
    height: 390px;
  }

  .fp-slides,
  .fp-post {
    height: 354px;
  }

  .fp-thumbnail,
  .fp-thumbnail img {
    height: 250px;
  }

  .fp-title {
    font-size: 21px;
    line-height: 1.15;
  }

  .blog-card-image {
    width: 38%;
    min-width: 38%;
  }

  .blog-card-content {
    padding: 18px 18px 15px;
  }

  .blog-card-title {
    font-size: 19px;
    line-height: 1.25;
  }

  .blog-card-excerpt {
    font-size: 13px;
    line-height: 1.5;
  }

  .blog-card-meta {
    font-size: 11px;
  }
}

/* Mobile
----------------------------------------------- */
@media (max-width: 700px) {
  html,
  body {
    width: 100%;
    overflow-x: hidden;
  }

  body {
    background-attachment: scroll;
  }

  #outer-wrapper,
  #header-wrapper,
  #footer-wrap,
  .top-menu-row,
  .secondary-menu-row,
  .span-24,
  .span-16,
  .span-8 {
    width: calc(100vw - 20px);
    max-width: calc(100vw - 20px);
    margin-left: auto;
    margin-right: auto;
  }

  #outer-wrapper {
    margin-top: var(--gap);
  }

  #wrap2,
  #content-wrapper {
    width: 100%;
    max-width: 100%;
  }

  #content-wrapper {
    grid-template-columns: 1fr;
    row-gap: var(--gap);
  }

  #main-wrapper,
  #rsidebar-wrapper {
    width: 100%;
    padding: var(--gap);
    margin: 0;
  }

  .top-menu-row {
    grid-template-columns: 1fr;
    gap: var(--gap);
    height: auto;
  }

  .top-menu-row .span-16,
  .top-menu-row .span-8 {
    width: 100%;
    max-width: 100%;
  }

  .menu-primary-wrap {
    height: 38px;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .menu-primary {
    width: max-content;
    min-width: 100%;
    height: 38px;
  }

  .menu-primary li a {
    height: 38px;
    padding: 14px 12px;
  }

  #header-wrapper {
    grid-template-columns: 1fr;
    row-gap: 14px;
    height: auto;
    padding: 16px 0;
  }

  #header,
  #header2 {
    width: 100%;
  }

  #header2 {
    justify-content: flex-start;
  }

  .reveal-text-logo {
    height: auto;
    padding: 0 10px;
  }

  .reveal-text-logo a {
    display: flex;
    align-items: center;
  }

  .reveal-mark {
    width: 34px;
    height: 44px;
    margin-right: 7px;
  }

  .reveal-mark::before {
    left: 8px;
    width: 11px;
    height: 11px;
  }

  .reveal-mark::after {
    top: 16px;
    border-left-width: 18px;
    border-right-width: 18px;
    border-bottom-width: 28px;
  }

  .reveal-word {
    font-size: 36px;
    line-height: 40px;
    letter-spacing: -3px;
  }

  .site-logo.reveal-logo img {
    max-width: 220px;
    max-height: 54px;
    padding-left: 10px;
  }

  .header-ad-placeholder {
    width: calc(100% - 20px);
    max-width: none;
    height: 54px;
    margin: 0 10px;
  }

  .header-ad-placeholder span {
    font-size: 24px;
    line-height: 26px;
    padding-top: 5px;
  }

  .header-ad-placeholder small {
    font-size: 12px;
  }

  /* Secondary menu: hamburger */
  .secondary-menu-toggle {
    width: 100%;
    height: 38px;
    display: flex;
    align-items: center;
    gap: var(--gap);
    padding: 0 12px;
    border: 0;
    background: var(--dark);
    color: #fff;
    font: 700 12px Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    cursor: pointer;
  }

  .secondary-menu-toggle-lines {
    width: 18px;
    display: grid;
    gap: 4px;
  }

  .secondary-menu-toggle-lines span {
    display: block;
    height: 2px;
    background: #fff;
  }

  .secondary-menu-toggle-text {
    line-height: 1;
  }

  .menu-secondary-wrap {
    display: none;
    width: 100%;
    height: auto;
    overflow: hidden;
    background: var(--dark);
  }

  .menu-secondary-wrap.is-open {
    display: block;
  }

  .menu-secondary {
    width: 100%;
    height: auto;
    flex-direction: column;
  }

  .menu-secondary li {
    width: 100%;
    border-right: 0;
    border-top: 1px solid #3b3b3a;
  }

  .menu-secondary li a {
    width: 100%;
    height: auto;
    padding: 11px 12px;
  }

  .menu-secondary ul {
    position: static;
    display: none;
    width: 100%;
  }

  .menu-secondary li:hover > ul,
  .menu-secondary li.sfHover > ul {
    display: block;
  }

  .menu-secondary li li a {
    padding-left: 24px;
    background: var(--accent);
  }

  /* Featured slider mobile */
  .featuredposts {
    height: 326px;
  }

  .fp-slides,
  .fp-post {
    height: 290px;
  }

  .fp-post {
    padding: 10px;
  }

  .fp-thumbnail,
  .fp-thumbnail img {
    height: 185px;
  }

  .fp-title {
    margin-bottom: 5px;
    font-size: 15px;
    line-height: 18px;
  }

  .fp-post p {
    height: 34px;
    font-size: 12px;
    line-height: 17px;
  }

  .fp-nav {
    height: 34px;
    padding: 8px 10px;
  }

  .blog-card-modern {
    display: block;
  }

  .blog-card-image,
  .blog-card-image a,
  .blog-card-image img {
    width: 100%;
    min-width: 100%;
    height: 210px;
  }

  .blog-card-content {
    padding: 16px 16px 14px;
  }

  .blog-card-category {
    font-size: 12px;
    margin-bottom: 8px;
  }

  .blog-card-title {
    font-size: 19px;
    line-height: 1.25;
    margin-bottom: 9px;
  }

  .blog-card-excerpt {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 12px;
    padding-bottom: 12px;
  }

  .blog-card-meta {
    flex-wrap: wrap;
    gap: 7px;
    font-size: 11px;
  }

  #footer-column-container {
    grid-template-columns: 1fr;
    padding: 0 10px 10px;
  }
}

/* Small mobile
----------------------------------------------- */
@media (max-width: 420px) {
  #outer-wrapper,
  #header-wrapper,
  #footer-wrap,
  .top-menu-row,
  .secondary-menu-row,
  .span-24,
  .span-16,
  .span-8 {
    width: calc(100vw - 14px);
    max-width: calc(100vw - 14px);
  }

  #main-wrapper,
  #rsidebar-wrapper {
    padding: 8px;
  }

  .reveal-word {
    font-size: 31px;
    line-height: 36px;
    letter-spacing: -2.5px;
  }

  .featuredposts {
    height: 304px;
  }

  .fp-slides,
  .fp-post {
    height: 268px;
  }

  .fp-thumbnail,
  .fp-thumbnail img {
    height: 170px;
  }

  .blog-card-image,
  .blog-card-image a,
  .blog-card-image img {
    height: 190px;
  }

  .blog-card-content {
    padding: 14px;
  }

  .blog-card-title {
    font-size: 18px;
  }
}
