:root { 
    /*Colors*/
    --border:#e8edf6;
    /*Utilities*/
    --sliderHeight: 600px;
}

body{font-size: 1.0em;  font-family: var(--bodytext);}

/* Medium desktops */
@media (min-width: 1200px) {
  .container {max-width: 1180px;}
}
/* Large desktops */
@media (min-width: 1400px) {
  .container { max-width: 1320px; }
}
/* Extra-large desktops or 4K displays */
@media (min-width: 1600px) {
  .container { max-width: 1440px; }
}
@media (min-width: 1920px) {
    .container { max-width: 1600px; }
}

a{color: var(--secondary); }
header.Header {position:relative;z-index: 9;background:var(--white) url(/image/cache/headerBG.png); box-shadow:none;
    & .brandNavigation { align-items:center;}
    & .logo {display:flex;justify-content: space-between;
        & img {max-height: 110px;}
    }
    div.navigation {background: var(--white);}
    .main-navigation {justify-content: space-between;
        & ul {justify-content: space-around;margin:0;width:100%;
            & li {
                a,span {font-size: 1.0em;text-transform: capitalize;font-weight: 400;padding: 12px 15px;color: var(--text);}
                &.hasSubmenu {
                    > a, > span{
                        &:after{content:"\f229";font-family: bootstrap-icons !important;font-size: 10px;display:inline-block;vertical-align:middle;padding: 1px 3px;}                        
                    }
                } 
                &.home a{font-size:0;text-align: center;padding: 10px 12px;margin: 0;
                    &:before{content:"\f424";font-family:bootstrap-icons!important;font-size: 18px;display: block;margin: 0 auto;}          
                }
                &:hover{ background-color:var(--highlight);
                    a,span{ color:var(--white); cursor:pointer;
                         &:hover{  background:var(--primary); }
                     }
                }        
                ul {min-width: 300px; 
                    li a{padding: 10px;font-size: .9em;}
                }
                &:last-child ul{right: 0;left: auto;}
                @media (min-width: 0px) and (max-width: 1199px) {
                    a{padding: 12px 15px;font-size:1em}
                } 
                @media (min-width: 0px) and (max-width: 1080px) {
                    a{padding: 12px 10px;font-size:.9em}
                }                 
            }      
        }    
        button.navbar-toggler{background:none;border:none;padding: 0 5px;outline:none;box-shadow: none;border-radius: 0;
            &:focus, &:active{outline:none;box-shadow: none;}
            i{font-size:2.5em;color: var(--text);line-height: 0;}  
            &:hover {background:var(--highlight);
                i{color:var(--white);}        
            }
        }
    }  
               
    div.topNav{
        nav{
            ul{display:flex; list-style:none; margin:0; padding:0;
                li{
                    a{color:var(--highlight);font-size: 1.1em;font-weight: 500;display:inline-block;padding:10px;margin:0 2px;line-height: 1;border: 2px solid var(--highlight);transition: all 0.3s;-o-transition: all 0.3s;-webkit-transition: all 0.3s;border-radius: 3px;
                        &:hover{background:var(--highlight); color:var(--white);}
                    }
                    &.onlineLicense a{background: var(--highlight);border: 1px solid transparent;color: var(--white);font-size: 1.1em;font-weight: 400;line-height: 1;padding: 10px 15px;text-align: center;
                        &:hover{background:var(--primary); color:var(--white);}          
                    }
                }  
                @media (min-width: 0px) and (max-width: 991px) {
                    li{display:none;
                       &.onlineLicense{display:block;}
                    }   
                }
            }            
        }
        button.navbar-toggler{background: var(--primary);border:none;padding: 0;margin:0 10px;outline:none;box-shadow: none;height: 39px;border-radius: 5px;
            &:focus, &:active{outline:none;box-shadow: none;}
            span{display:block;}
            i{font-size: 40px;color: var(--white);line-height: 0;}                     
        } 
        a.button.button-primary{background:var(--primary);text-transform:uppercase; padding:15px;
            &:hover{background:var(--primary); color:var(--white);}                       
        }         
    }
    @media (min-width: 0px) and (max-width: 991px) {
        & .brandNavigation {padding:5px 0;}            
        & .topNav{flex-wrap:wrap;
            & #social{min-width:100%;
                & ul{justify-content:end; margin-bottom:10px;}                     
            } 
             a.button.button-primary{ font-size:.9em;}
        }
        a{font-size:1em}
    }               
}
.breadcrumbs { background:var(--gray);
    a{display:inline-block;padding: 10px 5px;color: var(--dark);}            
}

.slider-block{/* background: var(--primary); */color: var(--white);/* margin-top: 100px; */position:relative;
            
    .sliderSection {z-index: 1;position: relative;top: 0;width: 100%;left: 0;margin-top: 0;height: 100%;
        .tao-carousel, .tao-carousel .tao-stage-outer, .tao-carousel .tao-stage, .tao-carousel .tao-wrapper, .tao-carousel .tao-item, .item{height:100%;}
        & .slide {background:var(--white);/* height:100%; */width: 100%;display:flex;/* margin-bottom: 80px; */
            & .captionData{/* width: 50%; */height: 100%;margin: 0;padding: 0px  30px;}
            & .media{width: 60%;line-height: 0;height: 100%; position: relative;
                video{object-fit: cover;height: 100%;width: 90%;object-position: center center;opacity: 1;position: absolute;top: 0;}        
            }
            & .image { height:100%; position:relative;
                img{ max-height: 540px;}
                &.Fullwidth img{/* max-height:none; */width:100%;height:100%;object-fit: cover;object-position: bottom;}
            }
            & .caption {padding:0;
                & :is(h1, h2, h3, h4){ font-family:var(--header); }
                .h1, h1 {font-size: calc(2rem + 1.0vw);  font-weight: bold;letter-spacing: 0.05em;
                    @media (min-width: 1200px) {font-size: 3.0rem; }
                    @media (max-width: 991px) {font-size: 2.0rem; }
                    @media (max-width: 768px) {font-size: 1.6rem; }                   
                }
                .h2, h2 {font-size: calc(1.20rem + 0.5vw); 
                    @media (min-width: 1200px) {font-size: 2.5rem; }
                   
                }
                .h3, h3 {font-size: calc(1.0rem + 0.5vw); 
                    @media (min-width: 1200px) {font-size: 2rem; }
                    
                }
                p, div {font-size: calc(1.0rem + 0.05vw); 
                    @media (min-width: 1200px) {font-size: 1.2rem; } 
                }                     
            }                  
        }                     
    }  
    @media (min-width: 0px) and (max-width: 992px) {
        .sliderSection {
            & .slide {margin-bottom:0; flex-direction:column;align-items: flex-start;
                & .captionData{flex: 0 0 auto;width: fit-content;position: absolute;padding:15px;
                    & .caption{ padding:15px;}              
                }
                & .media{width:100%; transform:none;
                    video{width:100%;}        
                }
            }
        }
    }
    @media (min-width: 0px) and (max-width: 768px) { margin-top: 0;}               
}

.sliderSection {
    & .tao-item{   
        & .slide {
            & .image {background-size:100%;  transition: all ease 8s;}
        }
        &.active { 
             & .slide {
                  & .image {transition:all ease 8s;background-size: 100%;}
             }
        }
       
    }
}

.subpageHeader-block {
    & .pageHeader{width:100%;height: 100%;display:flex;background: var(--primaryText);position: relative;
        & .captionData {/* width:40%; */
            & .caption{width: 100%;position: relative;margin: 0;padding: 10px 0px; color:var(--white);
                & :is(h1, h2, h3, h4){ font-family:var(--header); color:var(--white);}
                .h1, h1 {font-size: calc(1.2rem + 1.0vw);font-weight: 500;letter-spacing: 0.05em;                         
                    @media (min-width: 1200px) {font-size: 2.0rem; }
                    @media (max-width: 992px) {font-size: 2.0rem; }
                    @media (max-width: 548px) {font-size: 1.6rem; }
                   
                }
                .h2, h2 {font-size: calc(2rem + 0.5vw);font-weight:700;
                    @media (min-width: 1200px) {font-size: 3rem; }
                    @media (max-width: 992px) {font-size: 2.0rem; } 
                    @media (max-width: 548px) {font-size: 1.4rem; }
                }
                .h3, h3 {font-size: calc(1.0rem + 0.5vw); 
                    @media (min-width: 1200px) {font-size: 2rem; }
                    @media (max-width: 992px) {font-size: 1.5rem; }
                    @media (max-width: 548px) {font-size: 1.1rem; }
                }
                p, div {font-size: calc(1.2rem + 0.05vw); 
                    @media (min-width: 1200px) {font-size: 1.2rem; } 
                    @media (max-width: 992px) {font-size: 1.0rem; }                         
                }
            }
        }
        & .media{width: 60%;height: 100%;line-height: 0;transform: translateY(80px);position: relative;display: flex;justify-content: center;align-items: flex-end;
            video{object-fit: cover;height: 100%;width: 90%;object-position: center center;opacity: 1;/* position: absolute; */bottom: 0;max-height: 540px;aspect-ratio: 4 / 3;}     
            &[data-video]:not([data-video=""]){/* aspect-ratio: 4 / 3; */
                & .image{display:none;}
            }
            & .image {object-fit: cover;object-position: center center;opacity: 1;
                img{width:100%;height:100%;max-width: max-content;object-fit: contain;max-height: 540px;
                    &[src="#"], &[src=""]{display:none;}   
                }
            }                      
        } 
    }
    @media (min-width: 0px) and (max-width: 992px) {
            & .pageHeader  {margin-bottom:0; flex-direction:column;align-items: flex-start;
                & .captionData{flex: 0 0 auto;width: 100%;position: relative;z-index: 1;padding:15px;
                    & .caption{ padding:15px;
                        &:after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: transparent;z-index: -1;/* background-color:color-mix(in srgb, var(--primary) 80%, transparent); */}                              
                    }              
                }
                & .media{width:100%; transform:none;
                    & .image{width:100vw;
                        img{object-fit:cover;}        
                    }
                    video{width:100%;}        
                }
            }
    }
    @media (min-width: 0px) and (max-width: 768px) { padding-top: 0;}                      
}


.events {
    &.homeEvents{
        h2{margin:0;margin-bottom:15px;color: var(--dark);}
        & .eventrow {margin-bottom: 15px;padding-bottom: 15px;/* border-bottom: 1px dashed var(--mute); */padding: 15px;background: color-mix(in srgb, var(--primary) 7%, transparent 100%);border-radius: 5px;
            h4 a{color:var(--dark);}
            ul li {margin-bottom: 10px;}         
        }
        & .resourceBlock{border-bottom:1px solid #ddd;padding: 0 0 10px 10px;margin-bottom: 20px;
             a{display:inline-block; margin-right:15px; }
        } 
    }
}

.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;}
footer#footer{
    iframe{min-height:340px;}
}
#social {}
.copyright{ margin-top:0px !important;}

.about-block{background:var(--gray);}

.updates-block {background:var(--primary) url(/image/cache/Online_BG.jpg) no-repeat center;background-size:cover;background-attachment: fixed;position:relative;padding:150px 0;
    &:after{content:'';display:block;width:100%;height:100%;position:absolute;top:0;left:0;background:#333;opacity: 0.75;}
    & .onlineBlock {width: 50%;margin:0 auto;padding: 45px;border-radius: 6px;background: var(--white);color: var(--text);position:relative;z-index:2;
        h2{color: var(--text);}               
    }
    @media (min-width: 0px) and (max-width: 991px) {
        & .onlineBlock {width:95%;padding: 20px;}
    }           
}

.activityPageHeader h1{text-transform:uppercase;}
.activityCards {margin-top: 3rem;background:var(--light);}

& .activitiesBlock{position: relative;width:100%;
    & .activityBlock{height: 100%;}                        
}
.activityBlock{background:var(--white);box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.1);height: 100%;display: flex;flex-direction: column;flex: 0 0 auto;
    img{width:100%;}
    & .details{ display:block;  padding: 15px; 
        span, em{display:block;color: var(--text);}
        em{font-weight:500; color:var(--primaryText); }        
        & .h3{display:block;min-width:50%;color: var(--text);line-height: 30px; margin: 0;text-transform: uppercase;font-weight: bold;font-size: 1.1em;} 
    }
} 
@media (min-width: 0px) and (max-width: 991px) {
    .activityIndividualBlock{ margin-top:30px;}
}

/*News*/
.newsBlock{
    & .jsnews_35{height: 100%;display: flex;flex-direction: column;justify-content: space-between;}
    h2{margin-bottom:15px; }
    .news-listing {display:flex;position: relative;margin-bottom: 7px;padding-bottom: 8px;border-bottom: 1px solid var(--offwhite);align-items: center;
        img{margin-right:10px;width: 200px;display: block;}
        & .news-info{position:relative;z-index:1; 
            & .newsTitle {line-height:1.1;
                a{ 
                     &:hover{color:var(--highlight);}
                 }             
            }            
        }
        &:hover {transition: box-shadow .35s ease}
    }
}
 
.news{display:flex; flex-direction:column; height:100%; justify-content:space-between;
     & .article {margin-bottom: 15px;padding-bottom:10px;border-bottom:1px dashed var(--primary);
        h2{font-size:1.33em;}
        & .splitleft, & .splitright { display:block;
            em{font-size:.9em;}
            a{display:inline-block; padding:3px 10px; font-size:.8em; text-transform:uppercase; border:1px solid var(--primary); border-radius:5px;
                 &:hover{ background:var(--primary); color:var(--white);}
             } 
        }
    }
    & .newsRow{margin-bottom: 15px;padding-bottom: 15px;border-bottom: 1px dashed var(--offwhite);
        & .date {font-weight: 400; } 
        & .newsContent h3 a{color:var(--primary);}
        & .newsRow_title a {font-size: 1.3em;font-weight: 400;color: var(--text);}
    }      
}

.news-body img{max-width:60%;float:left;margin-right: 15px;margin-bottom: 15px;}

/* Events Wrapper */
.event {margin: 10px 0 15px; padding: 0; position: relative; display: flex; justify-content: flex-start; align-items: center; background: var(--white); border-bottom: 1px solid var(--bs-border-color);
  .event_date {text-align: center; font-weight: 900; font-size: 1.2em; line-height: 1em; text-transform: uppercase; color: var(--text); } 
  .event_day {font-size: 1.5em; padding: 10px; } 
  .event_time {font-size: 0.84em; font-weight: 400; display: block; line-height: 1.5em; } 
  .event_content {padding: 10px; font-weight: normal; font-size: 1em; text-align: left; line-height: 1.5em; position: relative; z-index: 1; 
    a {color:var(--primary);font-size: 1.2em; font-weight: 500; word-break: break-word; vertical-align: middle; } 
  }
}

/* Events Section */
.events {
  h2 {margin: 50px 0 15px; color: var(--text); }
  .eventrow {margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px dashed var(--gray); 
    h3 {font-size: 1.125rem; } p {margin: 0; } 
    ul {margin: 0 0 10px; padding: 0; 
      li {margin-right: 15px; } 
    } 
  }
}

/* Event Articles / Cards */
.events_block {
  .article {border-bottom: 1px solid var(--gray); padding: 15px 0; 
    img {max-width: 300px; height: auto; } 
    .dtl {padding: 0 15px; } 
  } 
}

/* Event Detail Page */
.EventDetail {
  .dtl img {max-width: 450px; margin: 0 auto; display: block; } 
}

/* Outfitters webform */
.outfitters {
    & .outfitters-row{border:1px solid var(--offwhite);height:100%;
        & img {width: 200px;margin:15px;margin-right:0;}
        & .details{padding:15px;}
    }
    @media (min-width: 0px) and (max-width: 991px) {
        & .outfitters-row{flex-direction:column;
            & img{margin:15px;}                 
        }
    }
}

/*Staff*/
.directoryBlock{
    & div[class*="d-none#"]{display:none;}
}

/*Resources*/
.resourcesBlock{background: var(--primary50);height: 100%;padding:15px;border: 1px solid var(--border);
    & .name {/* padding-left: 70px; */background: url(/image/cache/small_logo.jpg) no-repeat center left;background-size: 60px;font-size: 1.0em;/* min-height: 70px; *//* display: flex; *//* flex-direction: column; *//* justify-content: center; *//* align-items: flex-start; */}
    ul{margin: 0;padding:0;list-style:none;margin-bottom: 15px;
        li{margin-top: 10px;display: flex;justify-content: flex-start;align-items: center;
            &.hide{display:none;}
            i{color:var(--mute); margin-right:5px;}
            a{color:var(--dark);}  
        }  
    }
    p[data=""]{display:none;}
}
/*FAQs*/
.faqsBlock{
    > p a{font-size:.8em; color:var(--primaryText);}
    & .faq{border-bottom: 1px solid var(--border);padding: 10px 0px;margin-bottom: 10px;
        a {display:flex;justify-content: space-between;color: var(--dark);
            &:after{content:"\f4f9"; font-family:bootstrap-icons!important; color:var(--primary);} 
            &:focus, &:focus-visible{ border:none; outline:none;}
            &[aria-expanded="true"]:after{content:"\f2e5"; }
        }
        & .accordion-collapse{padding:0 10px;}
    }    
}

#loader { position:fixed; width:100%; height:100vh; left:0; top:0;z-index:99; background:rgb(26 26 26 / 50%);}
#loader i{position:relative;display: inline-block;text-align: center;left:50%;top:50%;font-size:3em;transform:translate(-50%, -50%);color:#ffc107;-webkit-animation: fa-spin 1s infinite steps(8);animation: fa-spin 1s infinite steps(8);}   
/* 1. Define the keyframes */
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}


/*Hunt Schedule*/
input{
    &.require.error{border:1px solid var(--error);}
}
.fieldval.permitInput{display:flex !important; align-items: center;
    & .verify {display:block;line-height:0;padding: 12px;font-size: 0;margin: 0 2px;background: var(--primary);color: var(--white);border-radius: 5px; cursor:pointer;
        i:before{font-size: 17px;}            
    }                      
}

#huntingDate .fieldval{display:flex; position:relative;}
#hunt_date_input{width: calc(100% - 40px);}

.seasonRow{position:relative;
    #calendarWrapper {position:relative;top: auto;height: auto;
        table{position:relative;height:480px;}                 
    }
}

#calendarIcon {margin: 0 6px;height: 40px;line-height: 40px;}
#calendarIcon i:before {font-size: 22px;color: #b82100;}
#calendarWrapper {position: absolute;z-index: 2;top: 40px;display: none;min-width: 90%;}
#calendarWrapper.show{display:block;}
#calendarWrapper table{position:absolute;width: 100%;background: #FFF; border-collapse:collapse;}
#calendarWrapper table tr { margin:0;}
#calendarWrapper table tr th {padding: 0px;}
#calendarWrapper table tr th, #calendarWrapper table tr td{border:1px solid #aeaeae;text-align:center;}
#calendarWrapper table tr td.month {background: #C3814F;color: #FFF;font-weight:bold;text-transform: uppercase;padding: 5px;}
#calendarWrapper table tr td.month span.month{padding: 5px 30px; display: inline-block;}
#calendarWrapper table tr td.month span.navigate {font-weight:300; cursor:pointer;}
#calendarWrapper table tr.days th{background: #d8b377;padding: 10px;}
#calendarWrapper table tr.dates td{color: #999;background: #CCC;position: relative;}
#calendarWrapper table tr.dates td.past{ background:#b5b5b5; color:#a1a1a1;}
#calendarWrapper table tr.dates td.current.active, #calendarWrapper table tr.dates td.current.active.winter {background: #5F8F00;color: #FFF;cursor: pointer;}
#calendarWrapper table tr.dates td.current.active:hover, #calendarWrapper table tr.dates td.current.active.winter:hover, #calendarWrapper table tr.dates td.current.active.selected {background: #ff9900;color: #FFF;}
#calendarWrapper table tr.dates td.current.filled{background: #666;color: #b5b5b5;}
#calendarWrapper table tr.dates td.current.filling { background:#4a6c06 !important;}
#calendarWrapper table tr.dates td.current small{font-size: .7em;display:block;line-height: 2;position: absolute;top: 0;color: #ffffff63;width: 100%;text-align: center;}
#calendarWrapper table tr.dates td a{color:var(--white);display: block;/* width: 100%; */height: stretch;}

#seasonDetails{text-align:center; font-size:1.2em; margin:10px 0; padding:15px; border-bottom:1px solid var(--border); border-top:1px solid var(--border);
    span{font-weight:500;}              
}

@media (max-width: 768px) {
  .event {flex-direction: column; text-align: center; 
    .event_content {padding-top: 15px; } 
  }

  .events_block .article {flex-direction: column; align-items: center; 
    img {width: 100%; max-width: 100%; } 
    .dtl {padding: 10px 0; } 
  }
}

.legendDetails{ 
    & .legendRow{display:flex;margin: 10px 0;align-items: center; color: var(--dark); font-weight:500; font-size:0.8em;
        span{width:30px;height:30px;margin-right: 5px;background:var(--light);
            &.available{background:#5f8f00;}
            &.unavailable{background:#cccccc;}
            &.filled{background:#666666;}
        }            
    }              
}

.divTable {width: 100%; 
    & .divRow {display: flex; width: 100%; flex-wrap: nowrap; 
        & .divCol {padding: 5px;border-bottom: 1px solid var(--light);vertical-align: bottom;flex: 0 0 25%;max-width: 25%; 
            &.tribe{
                a{font-weight:400;} 
                span{display:block;font-size:0.9em;font-style: italic;} 
            } 
            &.Email {word-break: break-all; } 
        } 
        &:nth-child(2n+1) .divCol {background:var(--gray);} 
        &.Header .divCol {background: var(--light); font-weight: 500; } 
    } 
    @media (min-width: 0px) and (max-width: 780px) {
        & .divRow {flex-direction: column; border: 1px solid var(--light); margin-bottom: 10px; 
            &.header {display: none; } 
            & .divCol {flex: 0 0 100%; max-width: 100%; display: flex; flex-wrap: nowrap; font-weight: 400; 
                &::before {content: attr(data); min-width: 130px; padding-right: 10px; font-weight: 300; font-size: 0.9em; } 
                &.tribe {flex-wrap: wrap;font-size: 1.2em; 
                    span{flex: 0 0 100%;max-width: 100%; font-size:0.8em;} 
                    &::before {display: none; } 
                } 
            } 
        } 
    } 
}

/*Seasons & Dates*/
.buffaloLicenseGroup {margin-bottom:15px;
    h3{font-size:1.2em;}
    & .divTable{border: 1px solid var(--light);border-top: 0;margin-bottom: 0;}
    & .divRow {
        & .divCol {flex: 0 0 33.33%;max-width: 33.33%;}      
         
        &.stampRow{/* padding: 5px; */  
            & .divCol {
                &.stamp span{display:block; }        
            }
            strong{font-weight:500;}
            span{ }
        }
        &.Header{margin-bottom: 0;
             .divCol {background: var(--primary100);font-size: .90em;padding: 3px 5px;}  
        }            
    }
    @media (min-width: 0px) and (max-width: 780px) {
        & .divRow {margin-bottom:0;border-bottom: 0;
            &.Header{display:none;}
            & .divCol {flex: 0 0 100%;max-width: 100%;
                 &[data="Tribal Status"]{word-break:break-all;}         
            }    
            &.stampRow{
                div.stamp:before, div.type:before{display:none;}
                & .divCol{flex: 0 0 100%;max-width: 100%;}
            }
        }
    }               
}

/*Footer*/
footer {
    & .footerNav {margin-bottom: 25px;line-height: normal;
        ul { display:block; 
            li {min-width:50%;text-align: left;
                ul{ display:block;
                    li{min-width:auto;text-align:left;padding: 5px 0;}
                } 
                a{text-align:left; font-size:1.1em;
                    &:hover, &:focus{color:var(--primary);} 
                }
                &.services ul li{padding: 5px; 
                    a{ font-size:.9em;}    
                }
            }
        }                    
    }
    & .copyright{margin-top:15px;line-height: normal;}
    @media all and (min-width: 0px) and (max-width: 767px) {
        & .address{ text-align:left;}
        & .footerNav { margin-top:30px;
            ul{display:block;}
        }
    }    
}

@media all and (min-width: 0px) and (max-width: 579px) {
    .sliderSection{ }
}
@media all and (min-width: 0px) and (max-width: 479px) {
    .sliderSection{ }
}