:root {
    --header: "Public Sans", sans-serif ;
    --subheader: "Inter Tight", sans-serif, system-ui; 
    --bodytext: "Inter", sans-serif, system-ui;
    --special :"Nova Square", sans-serif; 
    /*Colors*/
    --primary:#FA4132;
    --highlight:#c31f12;
    --dark: #3e3e3e;     
    --mute:#303e49;
    /*Utilities*/    
}

body{color: #303e49;}
body.noScroll{ overflow:hidden;}
body::-webkit-scrollbar-track {background-color: #fff;}
body::-webkit-scrollbar { width: 7px; background-color: #fff;}
body::-webkit-scrollbar-thumb { background-color: var(--primary);}
body.subpage .Header { background:rgb(255 255 255 / 70%);}
a{color:var(--highlight);font-weight:500;}
figure { margin:0; position:relative;
    figcaption {position: absolute;bottom: 0;right: 0;background: var(--light);color: var(--dark);display: block;padding: 3px 10px;font-size: .9em;} 
}


header.Header {position: fixed;width: 100%;z-index: 99;padding: 0;top: auto;left: auto;transition: all .5s ease;transform: translateY(0px);transition: all .5s ease;
    & .logo {min-width:250px;
        & svg {padding:5px 0; max-height: 70px;}
    }
    .main-navigation {
        & > ul {
            & > li { 
                & > a {padding: 30px 10px;font-size: 1rem;border-bottom: 3px solid transparent; transition:all .5s ease;
                    &:hover { border-bottom: 3px solid var(--primary);}
                }
                &.home a{font-size:0;text-align: center;padding: 28px 15px;margin: 0;
                    &:before{content:"\f425";font-family:bootstrap-icons!important;font-size: 18px;display: block;margin: 0 auto;}        
                }
                &.phone a {display:flex; align-items:center; padding: 27px 15px;margin: 0;
                    &:before{content:"\f5b4";font-family:bootstrap-icons!important;font-size: 18px; margin-right: 5px;}
                }
                
            }
        }
    }
    &.toFixed{box-shadow: 0px 0px 1px rgb(9 9 9 / 30%);transform: translateY(-100%);transition:all .3s ease;}
    &.headBg.toFixed {background: var(--primary);transition: all .5s ease;position: fixed;top: 0;transform: translateY(0px);
        & .logo{
            span{color:var(--white);}
            svg g {fill:var(--white);}
        }   
        & .navigation {
            & .iconMenu { 
                button, a{color: var(--white); 
                    &:hover{color: var(--dark);}
                } 
            }
        }               
    } 
    @media (min-width: 0px) and (max-width: 768px) {
        & .logo a {font-size:1.3em;}
        & .iconMenu {
            span{ display:none;}
            i{font-size:24px;}
        }
    }  
    @media (min-width: 0px) and (max-width: 576px) {
         & .iconMenu a{display:none;}
        & .logo a {font-size:1.2em;}
    }               
               
}

/*Slider*/
.slider-block {--sliderHeight: 100vh ;
    .sliderSection {
        & .slide {
            & .image {
                & .imagecredits {position:absolute;bottom:0;right:0;background: var(--light);color: var(--dark);display:block;padding:3px 10px;font-size: .9em;}
            }
        }
    }

    
    @media (min-width: 0px) and (max-width: 576px) {
         & .sliderSection{margin-top: 75px;}
    }    
}

.subpageHeader-block{ position:relative;
    img{ width:100%;}                     
    & .pageTitle {position:absolute;z-index: 5;top: 50%;width:100%;transform: translateY(-50%);}
    & h2{font-size:4em;font-weight:600;text-transform:uppercase;color:var(--primary);display: inline-block;border-bottom: 4px solid var(--white);}
    & .pageHeader{ position:relative;}
    .credits{position:absolute;bottom:0;right:0;background:var(--primary);color:var(--white);display:block;padding:3px 10px;font-size: .9em;}
    @media (min-width: 0px) and (max-width: 768px) {
        & .pageHeader {padding-top: 75px;}
    }
}

.titleBlock {padding: 15px 0;
    &.white{ color:var(--white);}         
    span {font-size: 1.953rem;font-weight:400;font-family:var(--bodytext);font-weight: 500;position: relative;display: inline-block;color: var(--mute);border-bottom: 2px solid var(--primary);}
    .title{font-size: 2.65em;font-weight:600;font-family:var(--special);line-height: 1.0;}         
}

/*Side nav*/
.sideNav ul{ margin-bottom:15px;}
.sideNav .highlight span, .sideNav .highlight a {background: var(--primary); color: var(--white); } 

/*Gallery*/
.taoGalleryBox .overlay {background:color-mix(in srgb,var(--mute) 85%,transparent) !important;}
.gallery_paging_links  span  a, .gallery_next_link_inactive, .gallery_prev_link_inactive {margin: 0 1px !important;}
.imageGallery { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; width: 100%; height: auto;
    .ligBox{max-width: none;}   
    @media (min-width: 0px) and (max-width: 1190px) {grid-template-columns: repeat(4, 1fr);}               
    @media (min-width: 0px) and (max-width: 778px) {grid-template-columns: repeat(3, 1fr);}
    @media (min-width: 0px) and (max-width: 479px) {grid-template-columns: repeat(2, 1fr);}               
}

.featuredBlock {position:relative;display: flex;flex-wrap: wrap;
     & .contentBlock {width:100%;border: 1px solid #ddd;background: var(--offwhite);
        & .details{position:relative;padding:30px;min-height: 250px;display: flex;flex-wrap: wrap;align-content: space-between;
            h2{text-transform:uppercase;font-size: 1.5625rem;font-weight: 500;color:var(--mute);}
            a{border-bottom: 2px solid var(--primary);font-weight: 400;font-size: 1.0em;}
        }        
    }
}

.about-block{background: url(/image/cache/bgpattern2.png) bottom;background-repeat: repeat-x;border-bottom: 1px solid #f9f9f9;
    img{ width:100%;}
    & .aboutContent {background:var(--light);padding: 30px;display: flex;flex-wrap: wrap;align-content: center;height: 100%;}    
}

.member-block {position:relative;background: var(--dark);
    &:after{content:'';display:block;width:100%;height:100%;position:absolute;top:0;left:0;/* background: url("/image/cache/memberBG.jpg") no-repeat center; *//* opacity: .3; */}
    .memberDetails {color:var(--white);position:relative;z-index:1;display: flex;background: var(--dark);padding: 60px;/* min-height: 100%; */flex-wrap: wrap;align-content: center;
        h2{color:var(--white);font-size: 1.953em;font-weight:600;text-transform:uppercase;}    
        p{font-size: 1.25rem;}
        a.button{text-transform:uppercase;font-size: 1.25em;}
    }              
}

.memberRows {background: var(--offwhite);
    & .memberLogo {text-align:center;min-height: 150px;/* border: 1px solid var(--gray); */background: var(--light);display: flex;flex-wrap: wrap;align-items: center;justify-content: center;
        a{display:flex;flex-wrap: wrap;align-items: center;}
        span {display:none;}
        img{display: block;margin: 0 auto;} 
    } 
    [class="memberLogo noImage"] span, [class="memberLogo noImage#"] span{font-weight:bold;display:block;}             
}

.memberCard {height: 100%;display: flex;flex-direction: column;flex-wrap: wrap;   
    & .memberLogo {text-align:center;}
    p{ margin:0; margin-bottom:5px;}
    address{display:block;text-align:left;margin: 0;
        p{padding-left: 25px;
          a{word-break: break-all; }
          i{display:inline-block;margin-left: -25px; text-align:center; vertical-align:middle; width: 25px;}
        } 
    }
    & [class="memberLogo noImage#"], [class="memberLogo noImage"] {/* background:var(--light) ; */
        img{width: 130px;padding: 15px;}
    }        
}
 
/*Events*/ 
.updates{
    h2{font-size: 1.5625rem;font-weight: 500;text-transform: uppercase;margin-bottom: 15px;color: var(--mute);display: inline-block;border-bottom: 2px solid var(--primary);padding-right: 15px;}
    & .eventrow {margin-bottom: 15px;padding-bottom: 5px;border: 1px dashed var(--gray);
        img {display: block;margin: 0 auto;max-height: 250px;width: auto;}
        .details { padding:10px;}
        h3{font-size: 1.2rem;}
        p{margin:0;}
        ul {margin-bottom:10px;
            li{ margin-right:15px;}
            i {color: var(--bs-gray-500);}
        }       
    }
    h3 {font-size: 1.3rem;/* margin: 0; */} 
    & .button{ font-size:.9em;}
}

/*News*/
.newsRow{margin-bottom: 15px;padding-bottom: 5px;border-bottom:1px dashed var(--gray);
    & .date { color:var(--bs-gray-500);}
}

/*Directory*/
.directoryBlock {text-align:center;height: 100%;/* border: 1px solid var(--gray); */background: var(--offwhite);
    & .image {min-height:200px;
        &.noImage{background: var(--light) url(/image/cache/logo_gray.svg) no-repeat center;background-size: 150px;}    
    }             
    & .details{padding: 15px;text-align: left;border-top: 2px solid var(--primary);
        p {padding-left: 25px;margin: 0;margin-top: 10px; 
            i{margin-left: -24px;}
            a{ font-weight:400;}  
        }          
    }
}

/*Image meta tag*/
span.imageMeta{display:block;font-size:.90em;clear: both;color: var(--dark);padding: 0 5px;margin-bottom: 10px;background: var(--light);
    &:before{content:'';}              
}

.splotLightRow { margin-bottom:15px; 
    img{ width:100%;}
    & .details {padding:10px; background:var(--white); text-align:center; border:1px solid #DDD; transition:all .3s ease;
        strong{ display:block;}           
    }
    &:hover{
        img{ opacity:.9}
        & .details{ background:var(--primary); transition:all .3s ease;
            a{ color:var(--white);}          
        }
    }
}
.spotlightDetail{
    & .images{margin-bottom: 30px;
        img{width: 50%;padding: 0 10px;}
    }
}

#memberDues div[class*="_radio"] {display: flex;}
#total { font-weight:bold;}

p[data="No Category"]{ display:none;}

@media all and (min-width: 0px) and (max-width: 991px) {} 
@media all and (min-width: 0px) and (max-width:779px) {}
@media all and (min-width: 0px) and (max-width: 579px) {}
@media all and (min-width: 0px) and (max-width: 479px) {}