
/* Halloween & Thanksgiving theme color change 
   9AA22B - normal (green)
   C46F37 - seasonal (orange #2)
   */



body { margin: 0px; padding: 0px; font-family: 'Open Sans', sans-serif; }
section { width: 100%; max-width: 95%; margin: 0px auto; display: table; position: relative; }
h1 { margin: 0px auto; display: table; font-size: 26px; padding: 40px 0px; color: #ff00ff; text-align: center; }
h1 span { font-weight: 500; }

header { width: 100%; display: table; background-color: #9AA22B; margin-bottom: 50px; margin: 0px; }
#logo     { font-size: 18.0px; padding: 10px 4px 0px 4px; float: left; font-family: Arial;  text-decoration: none; font-weight: 500; }   
#logo-sub { font-size: 15.4px; padding:  1px 4px 4px 4px; }
nav.hamburger { width: auto; float: right; border-radius: 30px; }
nav.hamburger ul { display:table; float:right; }
nav.hamburger ul li { float:left; text-decoration:none; list-style:none; margin: 0px; padding: 0px; outline: none; }
nav.hamburger ul li:last-child { padding-left: 0px; padding-right: 0px; }
nav.hamburger ul li a          { color: #F8F8F8; font-family: Arial; text-decoration: none; font-size: 18px; font-weight: 400; padding: 20px 20px; display: inline-block; transition: all 0.5s ease 0s; border-radius: 30px; }
nav.hamburger ul li a:hover    { color: #C9C9C9; background-color: #9AA22B;  transition: all 0.5s ease 0s; }
nav.hamburger ul li a       i  { color: #F8F8F8; transition: all 0.5s ease 0s; padding-right: 9px; }
nav.hamburger ul li a:hover i  { color: #C9C9C9; transition: all 0.5s ease 0s; }

nav.hamburger-logo         { width: auto; float: left; padding-left: 10px; }    /* padding-left __px added 2/2/2024 */
nav.hamburger-logo ul      { display: table; float: left; }
nav.hamburger-logo ul li   { float: left; text-decoration: none; list-style: none; margin: 0px; padding: 0px; outline: none; border-radius: 30px; }
nav.hamburger-logo ul li a { color: #F8F8F8; font-size: 18px; padding: 20px 20px; display: inline-block; transition: all 0.5s ease 0s; border-radius: 30px; }
nav.hamburger-logo ul li a:hover   { color: #C9C9C9; background-color: #9AA22B;  transition: all 0.5s ease 0s; }
nav.hamburger-logo ul li a       i { color: #F8F8F8; transition: all 0.5s ease 0s; padding-right: 10px; } 
nav.hamburger-logo ul li a:hover i { color: #C9C9C9; transition: all 0.5s ease 0s; }

.toggle-menu ul { display: table; width: 0px; margin-right: 10px; }  /* added margin-right __px on 2/2/2024 */
.toggle-menu ul li { width: 100%; height: 1.1vw; background-color: #F8F8F8; margin-bottom: 1.0vw; margin-left: 0px;}
.toggle-menu ul li:last-child { margin-bottom: 0px; }

input[type=checkbox], label { display: none; }

.content    { display: table; margin-bottom: 60px; width: 900px; }
.content h2 { font-size: 18px; font-weight: 500; color: #ff00ff; border-bottom: 1px solid #ff00ff; display: table; padding-bottom: 10px; margin-bottom: 10px; }
.content p  { font-size: 14px; line-height: 22px; color: #F8F8F8; text-align: justify; }

footer { display: table; padding-bottom:30px; width:100%; }
.social { margin: 0px auto; display: table; display: table; }
.social li { float: left; padding: 0px 10px; }
.social li a { color:#002e5b; transition: all 0.5s ease 0s; }
.social li a:hover { color:#ff00ff; transition: all 0.5s ease 0s; }


@media only screen and (min-width: 1601px) {
   section { width: 1540px; }  
}

@media only screen and (max-width: 1600px) {
   section { max-width: 95%; }
}

@media only screen and (max-width: 1150px) {
   #logo     { font-size: 18.0px; padding:  6px 4px 0px 4px; }
   #logo-sub { font-size: 15.4px; padding:  1px 4px 4px 4px; }
   label { float: right; padding: 7px 0px 7px 0px; display: inline-block; cursor: pointer; }
   .toggle-menu ul li { width: 54px; height: 7px; background-color: #F8F8F8; margin-bottom: 7px; }

   header { padding: 5px 0px; }

   input[type=checkbox] { position: absolute; top: -9999px; left: -9999px; background: none; }
   input[type=checkbox]:focus { background: none; }

   input[type=checkbox]:checked ~ nav { display: block; }

   nav.hamburger { display: none; position: absolute; right:0px; top:53px; background-color: #9AA22B; padding: 0px; z-index: 99; border: 2px solid #c9c9c9; }
   nav.hamburger ul { width: auto; }
   nav.hamburger ul li { float: none; padding: 0px; width: 100%; display: table; }
   nav.hamburger ul li a         { color: #F8F8F8; font-size: 6vh; padding: 2.3vh 2.5vh; display: block; }  
   nav.hamburger ul li a:hover   { color: #C9C9C9;                                                       } 
   nav.hamburger ul li a i       { color: #F8F8F8; padding-right: 13px;                                  }
   nav.hamburger ul li a:hover i { color: #C9C9C9;                                                       }

   .content { width: 90%; }
}

@media only screen and (max-width: 1024px) {
   #logo     { font-size: 18.0px; padding: 6px 4px 0px 4px; }
   #logo-sub { font-size: 15.4px; padding: 1px 4px 4px 4px; }
   label { padding: 7px 0px 7px 0px; }
   .toggle-menu ul li { width: 50px; height: 7px; margin-bottom: 7px; }
   nav.hamburger ul li a         { color: #F8F8F8; font-size: 5vh; padding: 2.1vh 2.3vh; display: block; }  
   h1 { padding: 25px 0px; }
   h1 span { display: block; }
}

@media only screen and (max-width: 800px) {
   #logo     { font-size: 18.0px; padding: 6px 4px 0px 4px; }
   #logo-sub { font-size: 15.4px; padding: 1px 4px 4px 4px; }
   label { padding: 7px 0px 7px 0px; }
   .toggle-menu ul li { width: 46px; height: 7px; margin-bottom: 7px; }
   nav.hamburger ul li a         { color: #F8F8F8; font-size: 4.3vh; padding: 1.7vh 2.3vh; display: block; }  
   h1 { padding: 25px 0px; }
   h1 span { display: block; }
}

@media only screen and (max-width: 600px) {
   #logo     { font-size: 18.0px; padding: 6px 4px 0px 4px; }
   #logo-sub { font-size: 15.4px; padding: 1px 4px 4px 4px;}
   label { padding: 7px 0px 7px 0px; }
   .toggle-menu ul li { width: 46px; height: 7px; margin-bottom: 7px; }
   nav.hamburger ul li a         { color: #F8F8F8; font-size: 4.3vh; padding: 1.7vh 2.3vh; display: block; }  
   h1 { padding: 25px 0px; }
   h1 span { display: block; }
}

@media only screen and (max-width: 414px) {
   #logo     { font-size: 18.0px; padding: 6px 4px 0px 4px; }
   #logo-sub { font-size: 15.4px; padding: 1px 4px 4px 4px; }
   label { padding: 7px 0px 7px 0px; }
   .toggle-menu ul li { width: 44px; height: 7px; margin-bottom: 7px; }
   nav.hamburger ul li a         { color: #F8F8F8; font-size: 4.5vh; padding: 1.9vh 2.3vh; display: block; } 
   section { max-width: 90%; }
}

@media only screen and (max-width: 375px) {
   #logo     { font-size: 18.0px; padding: 6px 4px 0px 4px; }
   #logo-sub { font-size: 15.4px; padding: 1px 4px 4px 4px; }
   label { padding:7px 0px 7px 0px }
   .toggle-menu ul li { width: 44px; height: 7px; margin-bottom: 7px; }
   nav.hamburger ul li a         { color: #F8F8F8; font-size: 4.0vh; padding: 1.7vh 2.3vh; display: block; } 
   h1 { font-size: 20px; }
   nav { top: 47px; }
}

