/* Dunnegan Rural Fire Department - hand-written replacement for the old Website Builder theme.
   Desktop (>= 980px) reproduces the builder's fixed 960px layout; below that the builder's mobile layout. */
@font-face{font-family:"Open Sans";src:url(/assets/fonts/open-sans-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Open Sans Condensed Light";src:url(/assets/fonts/open-sans-condensed-light.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
/* Only the regular faces are loaded on purpose: the old site rendered bold/italic by synthesizing them from these files. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:#fff;color:#4a4a4a;font:16px/1.2 "Open Sans",Arial,sans-serif;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #b3121b;outline-offset:2px}
h1,h2,h3,p,ul{margin:0}
ul{padding:0;list-style:none}
button{font:inherit;cursor:pointer}
.ico{display:block;width:100%;height:100%;fill:currentColor}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;background:#181818;color:#fff;padding:8px 12px;z-index:100}
.skip:focus{left:8px;top:8px}
.page{position:relative;transition:transform .3s ease}

/* ---------- header ---------- */
.hdr-in{position:relative}
.logo{position:absolute;display:block}
.logo img{width:100%;height:100%}
.site-title{position:absolute;margin:0;font-weight:400}
.site-title a:hover{text-decoration:none}
.call{margin:0;color:#181818;font-size:20px;line-height:24px}
.call-label,.call-num{display:block}
.call-num{color:#181818}
.call-icon{position:absolute;display:block;color:#4a4a4a}
.vline{position:absolute;display:block;background:#4a4a4a}
.burger{position:absolute;display:none;padding:0;border:0;background:none;color:#4a4a4a}
.nav ul{display:flex;justify-content:center}
.nav li{width:112px}
.nav a{display:flex;align-items:center;justify-content:center;height:46px;padding:0 4px;text-align:center;font-size:16px;line-height:19.2px;color:#4a4a4a}
.nav a:hover,.nav a[aria-current]{color:#c2c2c2;text-decoration:none}

/* ---------- footer ---------- */
.ftr-in{position:relative}
.ftr p{margin:0}
.ftr-email{position:absolute;font-size:15px;line-height:24px;color:#262626}
.ftr-box{position:absolute}
.follow{position:absolute;font-size:20px;line-height:24px;color:#181818;white-space:nowrap}
.chat,.fb{position:absolute;display:block;width:32px;height:32px;color:#4a4a4a}
.copy{position:absolute;font-size:15px;line-height:18px;font-weight:700;font-style:italic;color:#4a4a4a;white-space:nowrap}

/* ---------- shared content ---------- */
.title{font-weight:400;text-align:center}
.rule{border:0;height:1px;background:#ccccbb;margin:0}
.about-img{border:1px solid #e8e8e8;border-radius:36px;overflow:hidden}
.about-img picture,.about-img img{width:100%;height:100%}
.about-img img{object-fit:cover}
.lead{font-size:26px;line-height:31.2px;font-weight:700;color:#4a4a4a}
.meets{font-family:"Open Sans Condensed Light","Open Sans",Arial,sans-serif;font-style:italic;color:#181818}
.events-h{color:#181818}
.event{position:relative;background:#fffffc}
.ev-date{position:absolute;display:flex;align-items:center;justify-content:center;background:#8a8a8a;color:#f6f6f6;font-size:23px;line-height:27.6px}
.ev-title{position:absolute;display:flex;align-items:center;justify-content:center;text-align:center;font:400 25px/30px Arial,Helvetica,sans-serif;color:#181818}
.ev-desc{position:absolute;display:flex;align-items:center;color:#181818}
.ev-desc .ar{display:inline-block;text-align:right}
.video-frame{position:relative;border:8px solid #262626;border-radius:12px;overflow:hidden;background:#000}
.video-poster{display:block;width:100%;height:100%;padding:0;border:0;background:#000;position:relative}
.video-poster picture,.video-poster img,.video-frame iframe{display:block;width:100%;height:100%;border:0}
.video-poster img{object-fit:contain}
.yt-play{position:absolute;left:50%;top:50%;width:42px;height:29px;margin:-14px 0 0 -21px;border-radius:7px;background:rgba(33,33,33,.85)}
.yt-play::after{content:"";position:absolute;left:17px;top:9px;border-style:solid;border-width:5.5px 0 5.5px 10px;border-color:transparent transparent transparent #fff}
.video-poster:hover .yt-play{background:#e00}
.video-ctl{display:flex}
.video-ctl button{width:50px;height:50px;padding:15px;border:0;border-radius:3px;background:#7d7d7d;color:#f6f6f6}
.video-ctl button:hover{background:#6a6a6a}
.video-alt{position:absolute;left:-9999px}
.no-js .video-alt{position:static;text-align:center;margin-top:8px}
.tips-h{font-size:25px;line-height:30px;font-weight:700;color:#4a4a4a;text-align:center}
.tip h2{font-size:16px;line-height:19.2px;font-weight:700;font-style:italic;color:#4a4a4a}
.tip p{font-size:14px;line-height:19.6px;text-align:justify;color:#4a4a4a}
.c-info{color:#4a4a4a;font-size:16px;line-height:27.2px}
.c-info p{margin-top:23.8px}
.c-info .c-head{font-size:18px;line-height:30.6px;margin:0}
.c-info .c-head strong,.c-info .c-head2 strong{font-style:italic}
.c-info .c-head + p{margin-top:0}
.c-info .c-head2 + p{margin-top:0}
.c-info a:hover{text-decoration:underline}
.c-form label{display:block;font:14px/16.8px "Open Sans Condensed Light","Open Sans",Arial,sans-serif;color:#7d7d7d;margin:0 0 7px}
.c-form input,.c-form textarea{display:block;width:100%;margin:0;padding:4px 9px;border:1px solid #7d7d7d;border-radius:0;background:transparent;font:16px/1.2 "Open Sans",Arial,sans-serif;color:#181818}
.c-form textarea{resize:none}
.c-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.submit{display:block;width:117px;margin-left:auto;padding:0;border:0;border-radius:0;background:#575757;color:#f6f6f6;font:16px/19.2px "Open Sans Condensed Light","Open Sans",Arial,sans-serif}
.submit:hover{background:#444}
.form-status{margin:0 0 10px;padding:8px 10px;font-size:14px;line-height:1.4}
.form-status.ok{background:#e9f6ec;color:#185c2a}
.form-status.err{background:#fbeaea;color:#8a1414}
.tiles{position:relative}
.tile{position:absolute;display:block;background:#8a8a8a;border-radius:49px;color:#f6f6f6}
a.tile:hover{background:#7a7a7a;text-decoration:none}
.tile-ico{position:absolute;left:-22px;top:50%;width:50px;height:50px;margin-top:-25px;border-radius:50%;background:#a8a8a8;padding:11.5px;color:#f6f6f6}
.tile-label{position:absolute;top:50%;transform:translateY(-50%);font:24px/28.8px "Open Sans Condensed Light","Open Sans",Arial,sans-serif;color:#f6f6f6;white-space:nowrap}
.tile-label small{display:block;font-size:16px;line-height:20px}
.m-intro{text-align:center;font-size:16px;line-height:27.2px;color:#4a4a4a}
.m-empty{text-align:center;margin-top:30px;font-size:16px;color:#4a4a4a}
.m-year h2{font-size:25px;line-height:30px;font-weight:700;color:#4a4a4a;margin:0 0 12px}
.m-list li{margin:0 0 10px}
.m-list a{display:flex;align-items:center;min-height:64px;background:#fffffc;border:1px solid #eeeee6;color:#181818}
.m-list a:hover{text-decoration:none;background:#f6f6f0}
.m-mon{flex:0 0 90px;align-self:stretch;display:flex;align-items:center;justify-content:center;background:#8a8a8a;color:#f6f6f6;font-size:20px}
.m-title{flex:1;padding:8px 18px;font-size:18px;line-height:24px}
.m-list a:hover .m-title{text-decoration:underline}
.m-size{padding:0 18px;font-size:14px;color:#7d7d7d;white-space:nowrap}
.m-back{margin-top:30px;text-align:center;font-size:16px}
.m-back a{text-decoration:underline}
.menu{position:fixed;top:0;right:0;bottom:0;width:235px;background:#fff;z-index:50;overflow-y:auto}
.menu[hidden]{display:none}
.menu ul{padding:40px 0 0}
.menu li{margin:0 0 1px}
.menu a{display:block;height:47px;padding:14px 0 0 60px;font-size:16px;line-height:19.2px;color:#181818}
.menu-close{position:absolute;top:8px;right:12px;width:34px;height:34px;padding:0;border:0;background:none;color:#181818;font:700 34px/34px Arial,sans-serif}
body.menu-open{overflow:hidden}
body.menu-open .page{transform:translateX(-235px)}

/* ================= DESKTOP (builder desktop layout, 960px) ================= */
@media (min-width:980px){
  .wrap{width:960px;margin:0 auto}
  .hdr-in{height:332px}
  .logo{left:9px;top:47px;width:237px;height:237px}
  .site-title{left:270px;top:70px;width:290px;font-size:48px;line-height:57.6px;color:#181818}
  .call{position:absolute;left:712px;top:165px;width:180px;text-align:center}
  .call-num{margin-top:9px;padding-left:4px}
  .call-label{padding-right:4px}
  .nav ul{padding-left:2px}
  .call-icon{left:884px;top:182px;width:26px;height:26px}
  .vline{left:960px;top:20px;width:1px;height:119px}
  .nav{border-top:1px solid #4a4a4a;border-bottom:1px solid #4a4a4a;height:48px}
  .main{position:relative;margin-top:28px}
  .menu{display:none!important}

  .ftr-in{height:265px}
  .ftr-email{left:681px;top:54px}
  .ftr-box{left:681px;top:88px;width:249px;height:119px;border-left:1px solid #4a4a4a;border-right:1px solid #4a4a4a}
  .follow{left:59px;top:24.6px}
  .chat{left:64px;top:63px}
  .fb{left:120px;top:63px}
  .copy{left:0;top:196.8px}

  .p-home .main{min-height:634px}
  .about-h{padding:34px 0 0 14px;font-size:48px;line-height:57.6px;color:#4a4a4a}
  .p-home .rule{margin:8px 44px 0 57px}
  .about{position:relative;margin-top:25px;height:409px}
  .about-img{position:absolute;left:22px;top:0;width:564px;height:409px}
  .about-txt{position:absolute;left:617px;top:5px;width:312px}
  .meets{margin-top:31px;font-size:26px;line-height:31.2px}

  .p-calendar .main{min-height:623px}
  .events-h{padding-top:33px;font-size:50px;line-height:60px}
  .events{margin-top:39px}
  .event{margin:0 0 40px 9px;width:942px;height:126px}
  .ev-date{left:0;top:0;width:139px;height:126px}
  .ev-title{left:157px;top:0;width:218px;height:126px}
  .ev-desc{left:404px;top:0;width:506px;height:126px;padding-top:13px;font-size:18px;line-height:21.6px}

  .p-fire .main{min-height:1229px}
  .video{padding-top:93px}
  .video-frame{margin-left:117px;width:716px;height:446px;border:9px solid #000}
  .video-poster img{position:absolute;left:50%;top:50%;width:100%;height:122.43%;max-width:none;object-fit:fill;transform:translate(-50%,-50%)}
  .video-ctl{margin:20px 0 0 420px;gap:10px}
  .tips-h{margin-top:23px}
  .tips{display:grid;grid-template-columns:290px 290px 290px;column-gap:45px;grid-template-rows:184px 167px auto;margin-top:50px}
  .tip h2{margin-bottom:14px}

  .p-contact .main{min-height:731px}
  .contact{position:relative}
  .c-form{position:absolute;left:43px;top:93px;width:423px}
  .c-form input{height:35px;margin-bottom:17px}
  .c-form textarea{height:109px}
  .submit{height:33px;margin-top:109px}
  .c-info{position:absolute;left:594px;top:37px;width:340px}
  .c-info .c-head,.c-info .c-head + p{padding-left:3px}
  .c-info .c-head2{margin-top:45px}

  .p-notices .main{min-height:656px}
  .tiles{display:grid;grid-template-columns:302px 302px;column-gap:219px;row-gap:60px;padding:99px 0 0 56px;align-items:start}
  .tile{position:relative;width:302px;height:242px}
  .tile:nth-child(odd){margin-top:6px}
  .tile-label{left:38px}

  .p-minutes .main,.p-404 .main{min-height:640px;padding-bottom:40px}
  .p-minutes .m-intro{margin:16px 60px 30px}
  .m-year{margin:0 60px 26px}
}

/* ================= MOBILE (builder mobile layout) ================= */
@media (max-width:979.98px){
  .page{max-width:100%}
  .hdr-in{height:322px;max-width:600px;margin:0 auto}
  .logo{left:26px;top:25px;width:103px;height:103px}
  .site-title{left:186px;top:32.9px;width:150px;font-size:24px;line-height:28.8px;color:#000}
  .call-label{position:absolute;left:48px;top:218.6px}
  .call-num{position:absolute;left:0;right:0;top:272.6px;text-align:center}
  .call-icon{right:82px;top:214px;width:32px;height:32px}
  .vline{display:none}
  .burger{display:block;right:21px;top:153px;width:29px;height:29px}
  .nav{display:none}
  .no-js .burger{display:none}
  .no-js .nav{display:block;border-top:1px solid #4a4a4a;border-bottom:1px solid #4a4a4a;margin:0 15px}
  .no-js .nav ul{flex-wrap:wrap}
  .main{position:relative;max-width:600px;margin:0 auto}

  .ftr-in{height:250px;max-width:600px;margin:0 auto}
  .ftr-email{left:0;right:0;top:163.2px;text-align:center}
  .ftr-box{left:0;right:0;top:0;height:120px}
  .follow{left:0;right:0;top:29.6px;text-align:center}
  .chat{display:none}
  .fb{left:50%;margin-left:-16px;top:75px}
  .copy{left:30px;top:204.8px}

  .p-home .main{min-height:997px}
  .about-h{padding-top:25px;font-size:36px;line-height:43.2px;color:#4a4a4a}
  .p-home .rule{margin:0 15px}
  .about-img{margin:20px 15px 0;aspect-ratio:360/377}
  .about-txt{padding:48px 15px 0}
  .meets{margin-top:23px;font-size:36px;line-height:43.2px}

  .p-calendar .main{min-height:963px}
  .events-h{padding-top:25px;font-size:35px;line-height:42px;color:#7d7d7d}
  .events{margin-top:20px}
  .event{margin:0 15px 10px;height:277px}
  .ev-date{left:10px;right:10px;top:10px;height:64px}
  .ev-title{left:10px;right:10px;top:74px;height:100px}
  .ev-desc{left:20px;right:20px;top:160px;display:block;text-align:center;font-size:15px;line-height:18px}
  .ev-desc .ar{display:block;text-align:center}

  .p-fire .main{min-height:1484px}
  .video{padding:25px 15px 0}
  .video-frame{border-width:7px;border-radius:10px;aspect-ratio:360/215}
  .video-ctl{justify-content:space-around;margin:20px -15px 0}
  .tips-h{margin-top:50px}
  .tips{padding:19px 15px 0}
  .tip h2{margin-bottom:20px}
  .tip p{margin-bottom:20px}
  .tip:nth-child(7){margin-top:49px}

  .p-contact .main{min-height:1122px}
  .c-info{padding:25px 30px 0}
  .c-info .c-head2{margin-top:19px}
  .c-form{padding:38px 25px 0}
  .c-form input{height:34px;margin-bottom:16px}
  .c-form textarea{height:115px}
  .submit{height:32px;margin-top:110px}

  .p-notices .main{min-height:634px}
  .tiles{padding-top:87px}
  .tile{position:relative;margin:0 15px 38px 37px;height:142px}
  .tile-label{left:38px}

  .p-minutes .main,.p-404 .main{min-height:500px;padding:0 15px 40px}
  .p-minutes .m-intro{margin:12px 0 24px}
  .m-year{margin-bottom:22px}
  .m-mon{flex-basis:64px;font-size:17px}
  .m-title{padding:8px 12px;font-size:16px;line-height:21px}
  .m-size{display:none}
}
@media (prefers-reduced-motion:reduce){.page{transition:none}}
.meets .up{font-style:normal}

/* ---------- volunteer upload page (/admin/) ---------- */
.p-admin .main{padding:0 15px 40px;min-height:600px}
.a-msg{max-width:640px;margin:16px auto 0;padding:12px 14px;font-size:17px;line-height:1.4;border-radius:4px}
.a-msg.ok{background:#e9f6ec;color:#185c2a;border:1px solid #9fd3ad}
.a-msg.err{background:#fbeaea;color:#8a1414;border:1px solid #e3a3a3}
.a-box{max-width:640px;margin:20px auto 0;padding:18px 20px;border:1px solid #ddd;background:#fffffc;font-size:17px;line-height:1.4;color:#262626}
.a-box h2{font-size:20px;line-height:1.3;font-weight:700;margin:14px 0 8px;color:#4a4a4a}
.a-box h2:first-of-type{margin-top:0}
.a-box h3{font-size:18px;margin:14px 0 6px;color:#4a4a4a}
.a-box label{display:block;margin:10px 0 4px;font-weight:700}
.a-box input[type=password],.a-box select,.a-box input[type=file]{display:block;width:100%;max-width:100%;padding:9px 10px;border:1px solid #7d7d7d;border-radius:3px;background:#fff;font:17px/1.3 "Open Sans",Arial,sans-serif;color:#181818}
.a-row{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:8px 10px;align-items:center}
.a-row label{margin:0}
.a-box .a-check{display:flex;gap:8px;align-items:flex-start;font-weight:400;font-size:15px;margin-top:12px}
.a-check input{margin-top:4px}
.a-help{font-size:15px;color:#555;margin-top:6px}
.a-help a,.a-box a{text-decoration:underline;color:#1a4d8f}
.a-btn{display:inline-block;margin-top:12px;padding:10px 22px;border:0;border-radius:3px;background:#575757;color:#fff;font:17px/1.2 "Open Sans",Arial,sans-serif}
.a-btn:hover{background:#3d3d3d}
.a-btn-del{margin:0;padding:6px 14px;background:#a32020;font-size:15px}
.a-btn-del:hover{background:#7d1515}
.a-btn-plain{background:none;color:#1a4d8f;text-decoration:underline;padding:0}
.a-btn-plain:hover{background:none}
.a-list li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:8px 0;border-bottom:1px solid #eee}
.a-list li > a{flex:1 1 220px}
.a-size{font-size:14px;color:#777}
.a-del{margin:0}
.a-box summary{cursor:pointer;font-weight:700;color:#4a4a4a}
.a-logout{max-width:640px;margin:16px auto 0;text-align:right}
@media (max-width:520px){.a-row{grid-template-columns:auto 1fr}}
