/****************************************************************************************************************/
/**** nalcbranch25.com ... Desktop CSS **************************************************************************/
/**** Copyright (c) 2026 ... Shields Web Services ***************************************************************/
/****************************************************************************************************************/

/**** BASICS ****************************************************************************************************/

html, body {
  width:100%;
  height:100% important!;
  margin:0;
  padding:0;
  background:url(../imgs/nalcBG.jpg) repeat;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:100%;
  box-sizing:border-box;
  overflow-x:hidden;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, section {display:block}
a {color:#00F; text-decoration:none}
a:hover {color:#F00}
a.creditEmail {color:#ADD8E6; text-decoration:none}
a.creditEmail:hover {color:#F00}
a.link {color:#00F; text-decoration:none}
a.link:hover {color:#F00}
a.PC {
  color:#FFF;
  text-decoration:none;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.800em;
}
a.PC:hover {color:#B1B1D5}
a.weather {color:#FFF}
.fluidWidth {width:100%}
img.maxWidthDesktop {width:850px}
hr {width:99%; height:2px; margin-bottom:3%; background:#23408F}
hr.pix {width:99%; height:2px; margin-bottom:.5em; background:#23408F}
hr.redBar {background:#FE0000; width:99%; height:0.40em; border:#FFF double; opacity:0.7}
h1.hideAway {display:none}
i {color:#00F; font-size:0.950em; font-style:oblique}
img.floatLeft {float:left; padding-bottom:20px; padding-right:25px}
img.vAlign {vertical-align:top}
img.centerCalLogo {display:block; margin-left:auto; margin-right:auto}  
.loggedIn {color:#00F; font-size:1.00em; font-style:oblique}
.rightAligned {float:right}
table.grid {width:100%; background-color:#000}
td {width:25%}
table.officers td.name {text-align:left}
table.officers td.title {text-align:right}
table.weatherData {                /*   full  */
  position:relative;
  width:800px;
  margin-left:auto;
  margin-right:auto;
}
td.townLink {                     /*   full  */
  width:265px;
  height:45px;
  background:#23408F;
  color:#FFF;
  text-align:center;
}
ul.photoLinks {
  text-align:center;
  padding-left:0;
  margin-left:auto;
  margin-right:auto;
  list-style-type:none;
}
ul.leftAlignedList {text-align:left; list-style-type:none}


/**** CLASSES ***************************************************************************************************/

.bannerHead {
  color:#000; 
  font-size:200%; 
  font-family:geneva, helvetica, arial, sans-serif; 
  font-weight:bold; 
  font-style:oblique;
}
.bannerWelcome {
  color:#000; 
  font-size:150%; 
  font-family:"Gill Sans", helvetica, arial, sans-serif; 
  font-weight:bold; 
  font-style:oblique;
}
.black {color:#000}
.calEmoji {font-size:140%}
.cBlock3_index {
  float:right;
  width:16.875em;
  height:1.250em;
  padding:1.000em 0 0.850em 0;
  text-align:center; 
  margin-right:1.000em;  
}
/**.cBlockFooter {
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.00em;
  color:#FFF;
}**/

.cellA {
  display:table-cell;
  width:25%;
  height:138px;
  background:#FE0000;
  border:1px solid #000;
  vertical-align:middle;
  text-align:center;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.500em;
  letter-spacing:0.115em;
  color:#FFF;
}
.cellA:hover {background-color:#003470}
.cellB {
  display:table-cell;
  width:24.875%;
  height:276px;
  background:#FE0000;
  border:1px solid #000;
  vertical-align:middle;
  text-align:center;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.500em;
  letter-spacing:0.115em;
  color:#FFF;
}
.cellB:hover {background-color:#003470}
.cellCal {
  display:table-cell;
  width:25%;
  height:276px;
  background:#FE0000;
  border:1px solid #000;
}
.cellCal:hover {background:#FE0000}
.centerText {text-align:center; margin-left:auto; margin-right:auto}
.centerAsters {display:flex; justify-content:center}
.centerPC {width:100%; text-align:center; margin-left:auto; margin-right:auto}
.contact {font-family:arial, sans-serif; font-size:0.850em; color:#000}
.contentCorral {width:85%; margin-left:auto; margin-right:auto}
.contentText {width:85%; text-align:justify; margin-left:auto; margin-right:auto}
.dateRight {width:100%; text-align:center; margin:0 auto}
.dateText {
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.850em;
  color:#FFF;
}
.dBarbuzzi_2025 {display:flex; justify-content:center}
div.game {display:flex; flex-direction:row; justify-content:center; align-items:center}
.dkBlue {color:#23408F}
.drop {
  border:1px solid #000;
  -webkit-box-shadow:3px 3px 3px #585858;
  -moz-box-shadow:3px 3px 3px #585858;
  -ms-box-shadow:3px 3px 3px #585858;
  -o-box-shadow:3px 3px 3px #585858;
  box-shadow:3px 3px 3px #585858;
}
.finePrint {
  color:#000;
  font-family:"Gill Sans", helvetica, arial, sans-serif; 
  font-size:0.800em;
}
.flexContainer {display:none}
.flexTable {display:table; width:99.75%; padding:3px 0 3px 3px; background:#000}
.floatRight {float:right}
.floatLeft {float:left}
.floatLeftLinks {float:left; text-align:left; list-style-type:none}
.full {width:100%; max-width:268px}
.headingBlock {width:80%; text-align:center; margin-left:auto; margin-right:auto}
.hRule75 {width:75%}
.idLeft {width:100%; text-align:center; margin:0 auto}
.indexEmoji {font-size:200%}
.invisible {display:none}
.justifyText {text-align:justify}
.leftText {text-align:left}
.marTop {margin-top:4px}
.marginTop {margin-top:10px}
.marginTopFive {margin-top:5px}
.myCount {
  display:inline-block;
  width:6.000em;
  text-align:center;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.975em;
  font-weight:bold;
  letter-spacing:3px;
  color:#003470;
  background:#B1B1D5;
  border:2px solid #003470;
  padding-top:2px;
}
.noBreak {white-space:nowrap}
.noDisplay {display:none}
.noJavaScript {
  width:90%; 
  background:#FFF; 
  color:#23408F; 
  font-family:geneva, helvetica, arial, sans-serif; 
  font-size:1.00em; 
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  padding:10px 10px;
  margin-top:10px;
  border:3px solid #23408F;
}
.padBottom20 {padding-bottom:20px}
.padBottom20Img {padding:0}
.pageHeading {
  color:#23408F;
  /*text-align:center;
  margin-left:auto;
  margin-right:auto;*/
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.50em;
  font-weight:700;
  text-shadow:1px 1px #000;
}
.pageBold5 {
  color:#003470;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.85em;
  font-weight:700;
}
.photoPix {
  display:inline-block;
  width:8.00em;
  padding:3px;
  text-align:center;
}
.photoPix2 {
  display:inline-block;
  width:210px;
  padding:5px 15px 5px 0;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.photoPix3 {
  display:inline-block;
  width:8.45em;
  padding:3px;
  text-align:center;
}
.photoPixLCPF {float:left; width:180px; margin:8px; padding:3px; text-align:center}
.photoPixHC {float:left; text-align:center; width:150px; margin-bottom:10px}
.pushCenter {text-align:center; margin-left:auto; margin-right:auto}
.row {display:table-row}
.stewNew {
  color:#FF0000;
  font-family:"Monaco", monospace;
  font-size:1.10em;
  font-weight:bold;
}
.subHeadCenter {
  color:#FE0000;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  padding:10px 0;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.100em;
  text-shadow:1px 1px #000;
}
.text {display:inline-block}
.text_vAlign {vertical-align:middle}
.titleOverBar {
  position:relative;
  top:-1.325em;
  color:#23408F;
  background:transparent;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:3.30em;
  font-weight:700;
  text-shadow:2px 2px 3px #A9A9A9;
}
.titleBox {width:100%; height:1.50em; padding:1.5em 0; border:1px dashed green}
.triggerA {display:none}
.triviaPara70 {display:block; width:70%; margin-left:auto; margin-right:auto}
.typicalParagraph {
  color:#000;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.00em;
}
.typicalParagraph2 {
  position:relative;
  top:-50px;
  height:40px;
  color:#000;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.00em;
}
.white {color:#FFF}

/**** HTML 5 SEMANTICS (footer) ****************************************************************************************************/

footer {
  display:inline-block;
  width:100%;
  height:auto;
  background:#23408F;
  padding:2.00em 0 1.25em 0;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.towns {width:80%; margin-left:auto; margin-right:auto}
.towns1 {
  background:#23408F;
  width:100%;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.30em;
  color:#FFF;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  text-shadow:2px 2px #000;
}
.towns2 {
  background:#23408F;
  width:80%;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.859m;
  color:#FFF;
  text-align:justify;
  margin-left:auto;
  margin-right:auto;
  line-height:1.2;
}
.noBreak {white-space:nowrap}
.credits {
  width:100%;
  padding:1.00em 0;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.85em;
  color:#FFF;
}
/**.creditText {
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.75em;
  color:#FFF;
}
.cBlockFooter {
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.00em;
  color:#FFF;
}**/

/**** HTML 5 SEMANTICS (main, header) ***************************************************************************/

main {
  display:block;
  width:100%;
  max-width:1000px;
  height:auto;
  min-height:100%;
  padding:0;
  margin-left:auto;
  margin-right:auto;
  background:#FFF;
  border-left:2px solid #23408F;
  border-right:2px solid #23408F;
}
header {
  position:relative;
  width:100%;
  height:200px;
  background:#FFF;
  padding:0;
}

/**** IDS *******************************************************************************************************/

#br25Officers {width:65%; text-align:center; margin-left:auto; margin-right:auto}
#contentCorral {width:100%; height:auto; text-align:center; margin-left:auto; margin-right:auto}
#credits1 {width:98%; text-align:center; margin:10px auto 0 auto}
#credits1-SP {display:none}
#credits2 {width:98%; text-align:center; margin:10px auto 0 auto}
#fadeGallery {
  position:relative;
  width:420px; 
  height:279px; 
  text-align:center; 
  margin-left:auto; 
  margin-right:auto; 
  border:2px solid #003470; 
  z-index:5000;
}

#indexCenter {
  width:100%;
  height:auto;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  background:#FFF;
  overflow:hidden;
}

#leftContent {
  width:66%;
  height:100%;
  float:left;
  text-align:center;
  margin-left:auto;
  margin-right:auto; 
  margin-bottom:10px;
  background:#FFF;
}

#mainInsertPage {
  position:relative;
  top:0;
  left:0;
  background:#FFF;
  width:41.125em;
  height:48.000em;
  padding:10px 15px;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  border-left:1px solid #FFF;
  border-right:1px solid #FFF;
  overflow-y:scroll;
  overflow-x:hidden;
}
#mainInsertPage p {text-align:left}
#messageDiv{
  width:85%;
  background:#7DF9FF;
  color:#000;
  font-family:geneva, helvetica, arial, sans-serif;
  font-weight:600;
  text-align:center;
  margin-left:auto; 
  margin-right:auto;
  padding:0.70em 1.00em;
  border:3px ridge #FE0000;
  z-index:5000;
}
#myMap {width:60%; height:22em; margin:25px auto; border:3px black solid}
#pageCenter {
  padding-top:2.00em;
  text-align:justify;
  margin-left:auto;
  margin-right:auto;
}

#rightContent {
  width:32%;
  height:100%;
  float:right;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:10px;
}

#sectionCenterPgs {
  width:92%;
  overflow:auto;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  padding:3% 4% 0 4%;
}
#slideShow {width:420px; height:279px; margin:0; padding:0}
#slideShow IMG {position:absolute; top:0; left:0; z-index:8; opacity:0.0}
#slideShow IMG.active {z-index:10; opacity:1.0}
#slideShow IMG.last-active {z-index:9}
#theMessage {width:80%; height:20%; text-align:center; margin:15% auto}
#whyNotCenterHC {width:750px; height:161px; text-align:center; margin-left:auto; margin-right:auto}
::-webkit-scrollbar {width:7px}
::-webkit-scrollbar-track {-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3)}
::-webkit-scrollbar-thumb {background-color:#B1B1D5; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5)}

/**** NAVIGATION ************************************************************************************************/

.menuBar {display:none}
.mobileText {display:none}
.trigger {display:none} 

/**** (LINK CONTAINER ... The Blue Bar) ****/

nav {
  display:block;
  position:relative;
  top:0;
  height:65px;
  margin-bottom:20px;
}
nav ul#panel {
  position:relative;
  top:0;
  width:100%;
  height:65px;
  display:inline-flex;
  justify-content:center;
  margin:0 auto;
  list-style:none;
  padding:0 1.75em;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:1.00em;
  color:#003470;
  background:#23408F;
  box-sizing:border-box;
} 

/**** (FIRST LEVEL ... The 6 Text Links) ****/

nav ul#panel li {
  display:inline-block;
  position:relative;
  top:-8px;
  padding:1.00em;
  list-style:none;
  text-align:left; 
  margin:0 auto;
}
nav ul li a {
  position:relative;
  top:0;
  padding:1.00em 1.30em 1.50em 1.00em;
  color:#FFF;
  text-decoration:none;
}
nav ul li a:hover {color:#FE0000}  

/**** (SECOND LEVEL ... The Drop Down) ****/

nav ul li:hover > ul {display:block}
nav ul li > ul {
  display:none;
  position:absolute;
  top:82px;
  left:-40px;
  width:225px;
  list-style:none;
  text-align:left;
  padding:0;
  z-index:1000;
}
nav ul li > ul li {
  position:relative;
  top:2px;
  left:0;
  float:left;
  list-style:none;
  width:100%;
  padding:0.625em 0;
  white-space:nowrap;
  font-size:1.00em;
  background:#23408F;
  border-bottom:1px solid #FFF;
  -webkit-box-shadow:2px 2px 3px #FFF;
  -moz-box-shadow:2px 2px 3px #FFF;
  -ms-box-shadow:2px 2px 3px #FFF;
  -o-box-shadow:2px 2px 3px #FFF;
  box-shadow:2px 2px 3px #FFF;
}

/**** PAGES: BILL TRACKING ****************************************************************************************/

#accordionPix {width:85%; text-align:left; margin-left:auto; margin-right:auto}
.contained {background:#FFF; padding:5px auto 5px auto}
.contained p {text-align:justify; color:#000}
.contained a {color:#00F}
.contained a:hover {color:#F00} 

/**** PAGES: PHOTOS ***********************************************************************************************/

#description {text-align:center; margin:2% auto}
.desc {font-family:geneva, helvetica, arial, sans-serif; font-size:1.2em; font-weight:600}
img.logo {vertical-align:middle}
img.lower {vertical-align:bottom}
  display:block;
  width:98%;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:10%;
  overflow:auto;
}
/**
#photoMain {
  position:relative;
  top:65px;
  width:73%;
  height:auto;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
**/
#photoMain {
  position:relative;
  top:5px;
  width:80%;
  height:auto;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.photoPixPhotos {
  display:inline-block;
  width:125px;
  height:94px;
  border:2px solid blue;
  margin:2px;
  text-align:center;
}   
#fBoxCredit {width:450px; text-align:center; margin-left:auto; margin-right:auto; margin-bottom:3%}   
.fBoxText {font-family:geneva, helvetica, arial, sans-serif; font-size:.7em; color:black}
a.fBox {
  text-decoration:none;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.95em;
  color:#A0B8F4;
}
a.fBox:hover {
  text-decoration:none;
  font-family:geneva, helvetica, arial, sans-serif;
  font-size:0.95em;
  color:blue;
}

/**** PAGES: RETIREMENT *******************************************************************************************/

ul.retLinks {text-align:center; margin-left:auto; margin-right:auto; list-style-type:none}
table.retLinks {width:80%; margin-left:auto; margin-right:auto; font-size:.925em}
table.vetLinks {width:80%; margin-left:auto; margin-right:auto; font-size:.925em}
.rlLt {width:15%}
.rlRt {width:85%; text-align:left}
td.rlRtVets {width:85%; text-align:right}