:root {
    --t4-color: #33b6a8;
    --footer-bg: #fbefe6;
     
}

html {
    font-size: 14px;
}

.navbar{width:100%}
@font-face {
    
}


#wnd_info_msg{color:black!important}

@media only screen and (min-width: 768px) {
    html {
        font-size: 16px;
    }
}
 
#header-container {
    padding-left: 9%;
    padding-right: 5%;
}
 

span {
    display: inline-block;
    margin: 0;
    padding: 0;
    color: white;
}

 
html {
    position: relative;
    min-height: 100%;
}


body, #press-read p span, #press-read p, div {
    font-family: Arial, sans-serif !important;
}

#logo {
    width: 75px
}



.t4-color {
    color: var(--t4-color)
}

#t4-nav li a {
    color: #9f9f9f;
    font-weight: bold;
     
}

#footer-logo {
    width: 240px
}

 

#footer {
    
    padding-top: 70px;
    
    position: inherit !important;
}

.footer-bg {
    background-color: #32b2ab;
    padding:15px;
}
 
@keyframes slide {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-100%);
    }
}

.float {
    float: left;
}

@media (min-width: 1440px) {
    .navbar {
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }
}
.footerTextColor {
    color: #008483

}

#footerImage img{width:50px;}

.fz30{font-size:30px}

.menu-selected {
    border-bottom: solid 2px var(--t4-color);
    color: var(--t4-color) !important;

}

.home-section1-bg {
    background-color: #a8d5ce
}
.home-section2-bg {
    background-color: #e7c09c
}

.home-together {
    background-color: #f39c8a;
}
.home-bg-yellow {
    background-color: #e2b88b;
}

.home-bg-dark {
    background-color: #008483
}
.no-gutter {
    --bs-gutter-x: 0;
}

.home-bg-story {
    background-color: #c7da8a
}
.h500{
    height:500px;
}

.home-bg-video{
    background-color:#ecddca;
}

.franchise-section1 {
    background-color: #e7c09c
}
.franchise-section2-left {
    background-color: #bdd97c;
    color: #008483;
}
.franchise-section2-right {
    background-color: #ebebe6;
}

.franchise-section3 {
    background-color: white;
    color: #008483;
}
.franchise-section4 {
    background-color: #44b4ab
}
.franchise-section-yellow {
    background-color: #e2b88b
}

.btn-submit {
    background-color: #00b7aa;
    color:white;
}

.franchise-section-pink {
    background-color: #fe9688;
}

#floatingButton {
    position: fixed;
    top: 100px;
    right: 10px;
    z-index: 1000; /* High z-index to keep it above other elements */
    transition: top 0.3s ease-in-out; /* Smooth transition for the catching up effect */
   border:none;
}
.w150{width:150px}
.franchiseForm{
    margin-left:auto;
    margin-right:250px;
    width:500px;
}
.no-border{
    border:none
}
.franchise-section3::placeholder {
    color: #008483;
    background-color:white;
}
.franchise-messagebox{
    height:140px
}

.video{
    height:500px;
    max-height:500px;
}

.img-fluid{
    width:100%;
    max-height:500px !important;
    max-width:816px !important;
}

.img-stores{
    width:100%;
    max-height:500px !important;
    max-width:641px !important
}

#home-pic {
    margin-top: -25px !important
}

.home-franchise-journey {
    background-color: #44b4ab
}

#franchise-pic {
    margin-top: -21px !important
}
@media only screen and (max-width: 767px) {
    /* Place your CSS styles here. These will be applied when the screen width is less than 767px */
    .video {
        /* Your specific styles */

        width:100% !important;
        height:auto;
    }

    .img{
        width:100% !important;
    }

    .footer-center{
        text-align:center !important
    }

    .d-flex{
        display:block !important
    }

    .img-fluid-mobile{
        width:100%;
    }

    .franchiseForm{
        width:100%;
    }

    #home-pic{
        margin-top:-16px !important
    }

    .home-section1-bg，#franchise-pic, .franchise-section1 {
        padding: 0px !important;
    }

    #floatingButton{width:75px !important}

    .footer,
    #footer,
    #footer * {
        white-space: normal !important;
        line-height: 1.4 !important;
    }

    footer span {
        max-width: 100%;
    }
}