/*
Theme Name: Think Driving Southampton
Description: PHP 8.4 compatible replacement retaining the established Think Driving Southampton design.
Version: 1.0.2
Author: DSW
Text Domain: think-driving-southampton
*/

* { box-sizing: border-box; }
html { overflow-x: hidden; }
body { margin: 0; color: #000; background: #dbdbdb; font: 13px/1.25 Verdana, Geneva, Arial, Helvetica, sans-serif; }
body::before { position: fixed; z-index: -1; inset: 0; background: url('assets/pageglare.png') left top no-repeat; content: ''; }
a { color: #bd3622; }
a:hover { color: #781c10; }
img { max-width: 100%; height: auto; }

.site-page { min-height: 100vh; padding-top: 10px; }
.site-sheet { width: 1000px; max-width: calc(100% - 24px); margin: 0 auto; padding: 2px; border: 1px solid #aaa; border-radius: 11px 11px 0 0; background: #f5f5f5; box-shadow: 0 0 4px 3px rgba(0,0,0,.35); overflow: hidden; }
.site-header { height: 150px; background: url('assets/object639726492.png') no-repeat calc(100% - 18px) 4px, url('assets/header.jpg') left top / cover no-repeat; }
.header-inner { position: relative; height: 150px; }
.site-title { position: absolute; top: 34px; left: 13px; margin: 0; font: 700 42px/1 'Trebuchet MS', Arial, Helvetica, sans-serif; }
.site-title a { color: #000; text-decoration: none; }
.site-tagline { position: absolute; top: 80px; left: 15px; margin: 0; color: #f2f2f2; font: 17px/1 Verdana, Geneva, Arial, Helvetica, sans-serif; }

.site-nav { position: relative; z-index: 20; min-height: 43px; padding: 12px 6px 0; background: linear-gradient(#696969 0, #424242 100%); }
.nav-inner { min-height: 30px; }
.menu-toggle { display: none; }
.primary-menu, .primary-menu ul { margin: 0; padding: 0; list-style: none; }
.primary-menu { display: flex; width: 100%; gap: 4px; }
.primary-menu > li { position: relative; flex: 0 0 auto; }
.primary-menu > li > a { display: block; height: 30px; padding: 0 22px; border: 1px solid #642b25; color: #b2b2b2; background: linear-gradient(#e01522 0, #9f0f18 100%); text-decoration: none; white-space: nowrap; font: 13px/28px Verdana, Geneva, Arial, Helvetica, sans-serif; }
.primary-menu > li.current-menu-item > a, .primary-menu > li.current-menu-ancestor > a, .primary-menu > li:hover > a, .primary-menu > li:focus-within > a { border-color: #a8a8a8; color: #000; background: linear-gradient(#fff 0, #d1d1d1 100%); }
.primary-menu .sub-menu { display: none; position: absolute; z-index: 99; top: 100%; left: 0; min-width: 190px; border: 1px solid #666; background: #b31520; box-shadow: 0 5px 10px rgba(0,0,0,.3); }
.primary-menu li:hover > .sub-menu, .primary-menu li:focus-within > .sub-menu { display: block; }
.primary-menu .sub-menu .sub-menu { top: 0; left: 100%; }
.primary-menu .sub-menu a { display: block; padding: 8px 14px; color: #ddd; text-decoration: none; white-space: nowrap; }
.primary-menu .sub-menu a:hover, .primary-menu .sub-menu a:focus { color: #000; background: #eee; }

.site-content { min-height: 420px; }
.entry, .archive-list { margin: 7px; padding: 10px; }
.entry-title { margin: 0 0 10px; padding: 5px 2px 4px; border: 1px solid #c9c9c9; color: #210305; background: #ddd; font: 26px/1.2 'Trebuchet MS', Arial, Helvetica, sans-serif; }
.entry-content { min-height: 1px; }
.entry-content::after { display: block; clear: both; content: ''; }
.entry-content a, .entry-content a:link { color: #790b13; text-decoration: none; }
.entry-content a:visited { color: #3d3d3d; text-decoration: none; }
.entry-content a:hover, .entry-content a:focus { color: #545454; text-decoration: underline; }
.entry-content p { margin: 12px 0; }
.entry-content h1, .entry-content h2, .entry-content h3, .post-title { color: #bd3b27; font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif; line-height: 1.2; }
.entry-content h1 { font-size: 26px; }
.entry-content h2 { font-size: 24px; }
.entry-content h3 { font-size: 20px; }
.post-entry { margin-bottom: 18px; border-bottom: 1px solid #ccc; }
.archive-title { margin: 6px 0 12px; padding: 0; border: 0; color: #210305; background: transparent; font: 26px/1.2 'Trebuchet MS', Arial, Helvetica, sans-serif; }
.post-heading-bar { position: relative; z-index: 1; width: 100%; margin: 0 0 5px; padding: 1px; border: 1px solid #ccc; background: #dbdbdb; }
.post-title { margin: 6px 0; color: #210305; font: normal 26px/1.2 'Trebuchet MS', Arial, Helvetica, sans-serif; }
.post-title a, .post-title a:link { color: #700a11; text-decoration: none; }
.post-title a:visited { color: #000; text-decoration: none; }
.post-title a:hover, .post-title a:focus { color: #424242; text-decoration: none; }
.entry-content blockquote { clear: both; overflow: auto; margin: 10px 10px 10px 50px; padding: 0 0 0 26px; color: #111; background: #ddd url('assets/postquote.png') no-repeat left top; }
.entry-content blockquote p { margin: 14px; }
.entry-content ul { list-style-image: url('assets/postbullets.png'); }
.alignleft { float: left; margin: 0 1em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1em; }
.aligncenter { display: block; margin: 1em auto; }
.alignnone { margin: 0 0 1em; }
.wp-caption { max-width: 100%; }
.wp-caption-text { margin-top: 4px; color: #555; font-size: 11px; text-align: center; }
.gallery { display: flex; flex-wrap: wrap; gap: 10px; }
.gallery-item { margin: 0; }
.entry-content iframe, .entry-content table { max-width: 100%; }
.entry-content td, .entry-content th { padding: 2px; text-align: left; vertical-align: top; }
.navigation.pagination { clear: both; margin: 12px 0; }
.page-numbers { display: inline-block; padding: 4px 7px; border: 1px solid #aaa; background: #eee; text-decoration: none; }

.site-footer { position: relative; min-height: 41px; padding: 8px; color: #000; background: linear-gradient(#a8a8a8 0, #c7c7c7 40%, #c9c9c9 50%, #c7c7c7 60%, #a8a8a8 100%); }
.footer-inner { position: relative; min-height: 23px; text-align: center; }
.footer-inner p { margin: 4px 44px; }
.rss-link { position: absolute; top: -4px; left: 0; width: 32px; height: 32px; overflow: hidden; background: url('assets/footerrssicon.png') center no-repeat; text-indent: -9999px; }
.designer { width: 1000px; max-width: calc(100% - 24px); margin: 10px auto 25px; color: #555; text-align: right; font-size: 11px; }
.designer a { color: #555; }

@media (max-width: 1000px) {
  .site-title { font-size: clamp(30px, 4.4vw, 42px); }
  .primary-menu { display: none; padding: 6px 0; }
  .primary-menu.is-open { display: block; }
  .menu-toggle { display: block; width: 100%; height: 36px; padding: 0 12px; border: 1px solid #642b25; color: #eee; background: linear-gradient(#e01522,#9f0f18); text-align: left; font: bold 15px/34px Verdana, sans-serif; }
  .site-nav { padding: 6px; }
  .primary-menu > li > a { height: auto; padding: 8px 12px; white-space: normal; line-height: 1.3; }
  .primary-menu .sub-menu { display: block; position: static; min-width: 0; padding-left: 18px; border: 0; box-shadow: none; background: transparent; }
  .primary-menu .sub-menu a { white-space: normal; }
}

@media (max-width: 640px) {
  .site-page { padding-top: 0; }
  .site-sheet { max-width: 100%; border-width: 0; border-radius: 0; box-shadow: none; }
  .site-header { height: 155px; background-position: calc(100% - 5px) 4px, center top; background-size: 125px auto, cover; }
  .header-inner { height: 155px; }
  .site-title { top: 18px; right: 105px; left: 10px; font-size: clamp(25px, 8vw, 34px); line-height: 1.04; }
  .site-tagline { top: auto; right: 10px; bottom: 14px; left: 10px; font-size: 14px; line-height: 1.2; }
  .entry, .archive-list { margin: 4px; padding: 7px; }
  .entry-title { font-size: 23px; }
  .entry-content h2 { font-size: 21px; }
  .entry-content blockquote { margin-left: 15px; }
  .footer-inner p { margin-right: 5px; margin-left: 38px; }
  .designer { max-width: calc(100% - 16px); }
}