:root{
    /*Fonts*/
    --header: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --subheader: "Inter", sans-serif; 
    --bodytext: "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --special: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    /*Colors*/
    --primary:#963a5f;
    --secondary:#ca6989;
    --highlight:#6d2e4b;
    --brand:#f9e2e8;
    --dark: #333333;     
    --mute:#303e49;
    --text:#13272e; 
    --gray:#effaff;  
    --offwhite:#e9e9e9;      
    /*Utilities*/
    --sliderHeight:640px;
}

body{font-size: 1.0em;font-weight: 4;}

/* 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(--primary);font-weight: 400;}
header.Header {position:fixed;z-index: 9;background: transparent; box-shadow:none; 
    & .logo {display:flex;justify-content: space-between;position: static;text-align: center;
        & img {max-height: 146px;padding: 1px 0;transition:all .3s ease;position: absolute;top: 0px;}
        button{color:var(--primary);padding: 16px 0;}
    }
    & .homeHead {display: grid; grid-template-columns: 0% 100%; grid-template-rows: auto auto; align-items: center; transition: all .3s ease; 
        & .logo {display: block; text-align: center; transition: 0.3s; width: 0; opacity: 0; transition: all .3s ease;
            img{ position:relative;}
        }
        & .navigation {text-align: center; transition: all .3s ease;
            & .main-navigation ul {display: flex; justify-content: center; margin:0 auto;
                li{
                    a{padding: 28px 15px;}
                    ul{display:none;
                        li a{padding: 10px 15px;}  
                    }
                    &:hover ul{ display:block;}
                }
                
            }
        }
    }    
    .main-navigation { 
        & ul {
            & li {
                a, span {font-weight:400;font-size: 1.0em;color:var(--dark);transition:all .3s ease;padding: 28px 10ypx;}
                &.home a{font-size:0;text-align: center;padding: 26px 15px;margin: 0;
                    &:before{content:"\f424";font-family:bootstrap-icons!important;font-size: 18px;display: block;margin: 0 auto;}          
                }
                &:hover{ background-color:var(--primary);
                    a, span{ color:var(--white); }
                }                
                ul li a{padding:10px 15px; text-transform:capitalize;}
                 ul li:hover a{color:var(--primary);}
                @media (min-width: 0px) and (max-width: 1199px) {
                    a{ }
                }            
            }      
        }    
    }    

    &.Header.headBg{background:var(--white);box-shadow: 0px 0px 1px rgb(9 9 9 / 30%);
        & .logo {
            & img {max-height: 120px;filter: none;transition:all .3s ease;}
            button{color:var(--primary);}
        }    
        & .homeHead {grid-template-columns: 30% 70%; grid-template-rows: auto; transition: all .3s ease; 
            & .logo {text-align: left; visibility: visible; width: auto; opacity: 1; transition: all .3s ease;
                img{position:absolute;}
            }
            & .navigation {text-align: right; 
                & .main-navigation ul {justify-content: flex-end; margin:0;
                    li{
                        a{padding: 28px 15px;}
                        ul{ 
                            li a{padding: 10px 15px;}  
                        }                        
                    } 
                                                             
                }
            }
        }        
        & .main-navigation {justify-content: flex-end;
            li{
                &:hover a, &:hover span{color:var(--white);}
                a, span{color:var(--dark);transition:all .3s ease;text-transform: capitalize;
                    &:hover{color:var(--white);}                   
                }
                &.home a {font-size:0;}
                li a, li span{color:var(--white); padding:10px 15px;
                     &:hover{color:var(--primary);} 
                }
            }
        }
    } 
               
    @media (max-width: 1199px) {
    }
    @media (max-width: 991px) {
        & .homeHead {grid-template-columns: 100%; grid-template-rows: auto; transition: all .3s ease; 
            & .logo { display: flex; text-align: left; visibility: visible; width: 100%; opacity: 1; transition: all .3s ease;}
            & .navigation {text-align: right; display:none; 
                & .main-navigation ul {justify-content: flex-end; margin:0;
                    li a{padding: 28px 15px;}                      
                }
            }
        } 
        &.Header.headBg{
            & .homeHead {grid-template-columns: 100%;
                & .logo { width:100%;}
            }
        }    
    }

     & .homeHead {
        & .logo {align-items: baseline;
            & img{max-height: 120px;}
            button{/* padding:0; */}
        }
    }
    @media (max-width: 540px) {
        &.Header, &.Header.headBg{
            & .homeHead {
                & .logo {align-items: baseline;
                    & img{max-height: 100px;}
                }
            } 
            & .logo{
                & img{max-height:100px;}
            }            
        }      
    }               
}

body.subpage header{background:var(--white);
    & .logo img{max-height: 120px;/* position: absolute; */top: 0;}      
    & .main-navigation{ justify-content:flex-end;
        ul li a{padding: 28px 15px;} 
    }                   
    &.Header.headBg .main-navigation ul li a{padding: 28px 15px;}
}

.breadcrumbs { background:var(--offwhite);}

.sliderSection {z-index: 1;background: var(--white);position: relative;top: 0;width: 100%;left: 0;
    & .slide {
        & .caption {

            & :is(h1, h2){line-height: 1;font-family:var(--header);}
            & :is(h3, h4, h5, h6) { line-height: 1; font-family:var(--special);}
            .h1, h1 {font-size: calc(2.5rem + 1.5vw); 
                @media (min-width: 1200px) {font-size: 4rem; } 
            }
            .h2, h2 {font-size: calc(1.20rem + 1vw);font-weight: 800;
                @media (min-width: 1200px) {font-size: 3.5em; } 
            }
            .h3, h3 {font-size: calc(1.0rem + 1vw); 
                @media (min-width: 1200px) {font-size: 2.5rem; } 
            }
            p, div {font-size: calc(1.0rem + 0.05vw); 
                @media (min-width: 1200px) {font-size: 1.6rem; } 
            }   
            & .line { width: 250px; height: 3px; background: var(--primary); display: inline-block;}
        }
    }
    @media (max-width: 1199px) {
        &.mainSlider {margin-top:100px;}
    }
    @media (max-width: 767px) {
        &.mainSlider {margin-top:80px;}
    }                
}

.sliderSection {margin-top: 80px;
    & .tao-item{   
        & .slide {
            & .image {background-size:100%;  transition: all ease 8s;}
        }
        &.active { 
             & .slide {
                & .image {transition:all ease 8s;
                    &.justify-content-left{justify-content:flex-start;}
                    &.justify-content-right{justify-content:flex-end;}                          
                }
             }
        }
       
    }
}

.slideLogo{position:absolute;z-index: 2;width: 100%;text-align: center;padding: 30px; 
     & img{max-width: 200px;display: block;margin: 0 auto;}
}
@media (max-width: 991px) {
    & .slideLogo{ display:none;}
}

.subpageHeader-block {padding-top: 120px;
    & .pageHeader{background:var(--dark);
        img{width:100%;max-height: 440px;object-fit:cover;}                                      
    }
    @media (max-width: 1199px) {
        padding-top: 80px
    }                      
}
.content-block {/* padding-top: 80px; */}
.sideNav {
    ul {list-style: none; margin: 0; padding: 0;
        li{   
            &.currentitem a{background:var(--mute); color:var(--white);}
        }
    }
}
.events-block{ 
    & .eventsBlock{padding: 0;/* background:var(--white); */border-radius: 5px;height: 100%;
        h2{margin-bottom: 15px;color: var(--dark);}
        & .eventrow {margin-bottom: 15px;padding-bottom: 15px; 
            h4 a{color:var(--dark);}
            ul li {margin-bottom: 3px; margin-right:10px;}         
        }
        & .resourceBlock{border-bottom:1px solid #ddd;padding: 0 0 10px 10px;margin-bottom: 20px;
             a{display:inline-block; margin-right:15px; }
        } 
    }
    &.bgImage-block{position:relative;padding: 45px 0;/* min-height: 500px; */background: var(--brand);
        & .container{position:relative; z-index:1;}
        &:after{content:''; display:block;opacity:.5; position:absolute; width:100%; height:100%;  top:0; left:0;}               
    }
}

.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{padding-top:30px;}
#social {}
.copyright{ margin-top:0px !important;}

/*Service/Programs*/
.serviceBlocks{ 
    .serviceBlock{border: 1px solid #001c4e1c;padding: 20px;height: 100%;border-radius: 5px;background: var(--gray);
        h3{margin:0;}   
    }
} 

.FacilityBlocks{
    .FacilityBlock{ border: 1px solid #001c4e1c;border-radius: 5px; height: 100%; background: var(--gray);
        .details {padding: 15px;}
    }
}

 
/*News*/
.news-listing {padding: 0;position: relative;margin-bottom: 20px;border-bottom: 1px solid var(--bs-border-color);-webkit-transition: -webkit-box-shadow .35s ease;-o-transition: box-shadow .35s ease;transition: box-shadow .35s ease;
    & .news-info{position:relative;z-index:1;
        & .newsTitle {line-height:1.1;
            a{ color:var(--primary);}             
        }            
    }
    &: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(--gray);
        & .date {font-weight: 400;color: var(--primary);}   
        & .newsRow_title a {font-size: 1.3em;font-weight: 500;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: 10px 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; } 
}

@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; } 
  }
}

/*resources*/
.resource{
    img{ margin-right:15px;}
}

/*FAQs*/
.groupPanel{margin-bottom: 15px;border: 1px solid #dcdcdc;
    & .groupPanel-title{/* padding:5px; */margin: 0;
        a{color: #606060;font-weight: 500;text-transform: uppercase;display: flex;align-items: center;padding:10px;
            &:before{content:"\f235";font-family:bootstrap-icons!important;line-height: 1;font-size: 20px;}
            &:focus, &:focus-visible{outline:none;}
          &.collapsed:before{content:"\f229";}
        }                   
    }
    & .groupPanel-body{border-top: 1px solid #dcdcdc;padding-top:10px;
        & .panel-title a{display:flex; align-items:center;
            &:before{content:"\f2e6"; font-family:bootstrap-icons!important;line-height: 0;font-size: 15px; padding:0 5px;}
            &.collapsed:before{content:"\f4fa";}
        }
        & .panel-body{padding: 0 30px;}
    }
}

/*Veterinary List*/
.veterinaryRows{border:1px solid #dcdcdc; padding:15px; height:100%;
    i{color:var(--secondary);}               
}

/*Meet the Team*/
.teamRow{height:100%;border:1px solid var(--offwhite);text-align:center;padding-bottom: 10px;
    img{max-width:150px;display:block;margin: 0px auto;opacity: .4;background: var(--brand);}
    span{display:block; color: var(--dark);
        &.img{background:var(--brand);}
        &.h3{padding:10px 0;margin: 0;color: var(--dark);}
    }
    em{color: var(--dark);}         
}


footer {
    & .footerNav {margin-bottom: 25px;
        ul {display:flex;flex-direction: column;
            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{color:var(--brand);}
                 }
            }
        }                    
    }
    & .copyright{ margin-top:15px;}
    @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{margin-top: 0;}
}
@media all and (min-width: 0px) and (max-width: 479px) {
    .sliderSection{margin-top: 0;}
}