* {
    margin: 0;
    padding: 0;
}


html {
    font-size: 62.5%;
    font-family: "Roboto", sans-serif;

    scroll-behavior: smooth;
}


header {
    
    /* height: 7rem; */
    max-height: 7rem;
    /* background-color: blue; */
    background-color: rgba(255, 255, 255, 0.86);
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    position: fixed;
    z-index: 100;

    /* align-items: flex-start; */

    /* top: 7rem; */
}

.left-top {
    display: flex;
    align-items: center;
}

.left-top a{
    text-decoration: none;
    color: black;
}

.left-top a:visited {
    color: inherit;
}

.top-logo {
    /* padding: 3rem 5rem; */
    padding: 1.5rem 5rem;
    transform: translateY(-5px);
    padding-left: 5rem;
    
    font-family: "Manrope", sans-serif;
    font-size: 3.0rem;
    font-weight: 900;
    color: black;

    cursor: pointer;
}

.hours-container {

    
    max-height: 7rem;
    
    overflow: visible;
    align-self: flex-start;

    display: flex;



    

     flex-direction: column;
    /* justify-content: flex-start; */

    /* background-color: cadetblue; */
    background-color: none;
    /* padding-top: 20.5rem; */

    padding-top: 2.5rem;
    /* padding-top: 5.5rem; */
    /* padding-top: 1rem; */
    /* margin-top: 2rem; */
    /* padding-left: 5rem; */
    padding-right: 5rem;

    /* padding-bottom: 2.9rem; */

    width: 20rem;
}

.hours {
    /* padding-left: 5rem; */
    /* height: 100%; */
    font-size: 1.4rem;

    display: flex;


    
    
}

.expand-button {
    padding-left: 2rem;
}

.hour-title {
    color: rgb(113, 131, 248);
}

.todays-hour {
    padding-left: 2rem;
    color: #2e2e2e;
}

.expanded {
    /* position: absolute; */
    /* display: block; */
    padding-left: 0rem;
    /* background-color: #fff; */
    background-color: rgba(255, 255, 255, 0.86);
    /* box-shadow: inset 0 0 0 1000px rgba(255, 255, 255, 0.86); */

        margin-top: 2.8rem;

    /* padding-top: 1rem; */
    display: none;
    /* opacity: 0; */

    width: 20rem;
    transform: translateX(-5rem);

    padding-left: 5rem;
    padding-right: 1rem;
    padding-bottom: 1rem;

    /* transition: opacity .5s ease; */
}

.day-hour {
    /* padding-top: 1rem; */
    font-size: 1.4rem;
    /* margin-top: 1rem;
    margin-bottom: 1rem; */
    margin: 1.8rem 0;

    display: flex;

    
}

.day-active{
    border-bottom: 1.5px solid rgb(163, 43, 255);
}

.a {
    padding-left: 1.9rem;
}

.day {
    width: 3rem;
    text-align: center;
    padding-right: .5rem;
}

.header-options {
    font-size: 2.0rem;
    padding-right: 3rem;
    display: flex;
    font-weight: 200;




}

.header-options a {
    text-decoration: none;
    color: black;
}

.header-option a:visited
 {
    color: black;
}


.header-option {
    margin: 0 2rem;

    border-color: white;
    padding-bottom: 5px;
    border-bottom: 1px solid #ffffff00;
    transition: border-bottom .4s ease;
}

.header-option:hover {
    /* padding-bottom: .7rem; */
    border-bottom: 1px solid rgb(173, 67, 197) ;
    /* transform: translateY(1px); */
}





.header-option-active {
    /* padding-bottom: .7rem; */
    border-bottom: 1px solid rgb(197, 67, 178) ;
}



.contact-button-header {
    /* background: linear-gradient(to top right, rgb(132, 0, 255), rgb(0, 255, 4)); */
    /* background: linear-gradient(to top right, rgb(182, 37, 255), rgb(0, 255, 4)); */
    /* background: linear-gradient(to top right, rgb(37, 128, 255), rgb(0, 255, 4)); */
    /* background: linear-gradient(to top right, rgb(255, 177, 9), rgb(0, 166, 255)); */

    background: linear-gradient(to top right, rgb(255, 177, 9), rgb(255, 102, 0)) rgb(255, 102, 0);
    /* background: linear-gradient(90deg, #3f51b5, transparent) #2196f3; */
    /* background: linear-gradient(to top right, rgb(255, 124, 9), transparent) rgb(157, 255, 115); */
    /* background-color: rgb(255, 102, 0); */

    /* background-color: red; */



    /* height: 7rem; */
    border-radius: 2rem;

    /* clip-path: polygon(5% 0%, 100% 0%, 95% 100%, 0% 100%); */

    /* clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); */

    font-size: 1.5rem;
    display: flex;
    align-items: center;
    padding: 0 3rem;
    color: white;
    margin-left: 4rem;
    width: max-content;
    height: 3rem;
    /* margin-right: 1rem; */
    
    /* background: linear-gradient(45deg, #ff2119, transparent) #fe9000;
    transition: background 0.5s ease; */

    /* transition: background-color 1s; */
}

.contact-button-header:hover {
    /* background-image: linear-gradient(to right, white, white); */

    /* background: linear-gradient(45deg, white, transparent);
    background-color: rgb(0, 128, 255); */



    /* background: linear-gradient(45deg, #43e97b, #38f9d7) */
}

.header-instagram {
    font-size: 2.2rem;
    margin-left: 2rem;
    padding-bottom: 5px;


    /* border-color: white; */

    /* border-bottom: 1px solid white;
    transition: border-bottom .4s ease; */

    /* width: 1rem; */

    /* background: white; */
    transition: all .4s ease;
}

.header-instagram:hover {

    /* border-bottom: 1px solid rgb(255, 31, 221) ; */

    color:  rgb(255, 67, 180);

    /* background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); */

    
}




.mobile-menu-expanded {

    /* float: right; */
    right: 0;
    position:fixed;
    /* background-color: aqua; */

    background-color: white;

    width: 0;
    opacity: 0;
    /* width: 100px; */
    height: 100vh;
    z-index: 99;

    /* display:inline; */

    transition: width .5s ease-in-out, opacity .5s ease-in-out;

    overflow: hidden;
}



.header-menu-bar {
    font-size: 2.2rem;
    margin-left: 3rem;
    display: none;
}

.expanded-menu-top-bar {
    height: 7rem;
    /* background-color: antiquewhite; */
    background-color: white;

    border-bottom: 1px solid #8c8c8c74;

    display: flex;
    align-items: center;
    /* width: 100%; */

    flex-direction: row-reverse;
}

.close-icon {
    padding-right: 3rem;
    font-size: 2.2rem;
    font-weight: 300;

    color: rgb(75, 75, 75);
    /* right: 0; */
}


.mobile-header-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    /* justify-content: center; */
    align-items: center;
}

.mobile-header-section a {
    color: black;
    text-decoration: none;
}

.mobile-header-section a:visited {
    color: inherit;
}

.mobile-header-option-active {
    border-bottom: 1px solid rgb(197, 67, 178);
}
/* .mobile-header-option-active2 {
    border-bottom: 1px solid rgb(197, 67, 178);
} */

.mobile-menu {

    padding-bottom: 6px;

    margin-top: 5rem;

    font-size: 2.5rem;

    font-weight: 300;

    cursor: pointer;

}

.mobile-menu-instargam {
    font-size: 2.5rem;

    margin-top: 5rem;
    /* color: black; */
    transition: color .4s ease;
    text-decoration: none;
    color: black;
}

.mobile-menu-instargam:hover {
    color:rgb(255, 67, 180);
}


.mobile-contact-button-header {
    background: linear-gradient(to top right, rgb(255, 177, 9), rgb(255, 102, 0));
    border-radius: 4rem;
    height: 5rem;

    font-size: 1.5rem;
    display: flex;
    align-items: center;
    padding: 0 3rem;
    color: white;
    font-weight: 300;
    margin-top: 4rem;
    /* margin-left: 4rem; */

}




.slideshow {
    padding: 0;
    padding-top: 7rem;
    /* margin-top: 7rem; */
    /* background-color: azure; */
    background-color: rgba(203, 203, 203, 0.779);
    height: 40rem;
    white-space: nowrap;
    overflow: hidden;
    /* gap: 0; */

    /* font-size: 0; */
    
    /* margin: 0; */
    border: none;

    overflow-x: scroll;

    /* position: relative; */
    /* overflow-x: hidden; */
}


.autoplay-wrapper {
    display: none;
    width: 100%;
    /* display: block; */
    /* height: 5rem; */
    background-color: yellow;
    /* text-align: center; */
    display: flex;
    justify-content: center;
    
}

.autoplay {

    cursor: pointer;
    
    width: 2rem;
    margin-top: 1rem;
    height: 2rem;
    border-radius: 2rem;
    background-color: rgba(255, 255, 255, 0.519);
    position: absolute;
    border: .5px solid rgba(88, 88, 88, 0.068);
    /* text-align: center; */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    padding-top: .1rem;
    /* padding-left: .2rem; */
    /* color: rgba(239, 239, 239, 0.868); */
    color: #afafaf;
    font-weight: 100;
    
    
    /* text-align: center; */

}


.slideshow::-webkit-scrollbar {
  display: none;/* newer Chrome/Safari */
}

.photo {
    height: 100%;
    width: 100%;
    display: inline-block;
    /* border: none; */
    /* gap: 0; */
    /* font-size: 0; */
    
    /* overflow-x: scroll; */
    /* box-sizing: content-box; */
    
}

.photo img{
    height: 100%;
    overflow-y: hidden;
    
    /* object-fit: contain; */
    object-fit: cover;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 100%;
}

/* .side-button-wrapper {
    position: absolute;
    display: flex;
    height: 100%;
    align-items: center;
} */

.side-button {
    font-weight: 100;
    font-size: 1.8rem;

    border-radius: 3rem;
    width: 5rem;
    height: 5rem;

    transform:translateY(-23rem);

    /* background-color: rgba(115, 115, 255, 0.226); */
    background-color: #ffffff33;

    color: rgba(255, 255, 255, 0.841);

    position: absolute;
}

.side-button-left {
    cursor: pointer;
    display: flex;
    /* text-align: center; */
    justify-content: center;
    align-items: center;

    /* color: rgb(102, 102, 102); */
    /* font-size: 3rem; */
    /* translate:  0 -24rem; */

    
    
    margin-left: .3rem;

    /* padding-top: .2rem; */
    padding-right: .2rem;
    /* left: 0; */
    /* z-index: 999; */
}

.side-button-right {
    cursor: pointer;
    display: flex;
    /* text-align: center; */
    justify-content: center;
    align-items: center;
    
    
    /* font-size: 3rem; */
    /* transform: translateX(104rem) translateY(-24rem); */
    right: 0;
    

    
    /* float: right; */
    margin-right: .3rem;
}


.dots {
    position:absolute;
    
    /* display: block; */
    width: 100%;
    margin: 0 auto;
    color: white;
    white-space: nowrap;
    overflow: auto;
    text-align: center;
    translate:  0 -30px;

}

.dot {

    cursor: pointer;
    display: inline-block;
    /* padding: 0 1rem; */
    margin-left: 1rem;
    background: rgba(255, 255, 255, 0.352);
    border: 1px solid grey;
    height: 1rem;
    width: 1rem;
    border-radius: 5rem;
}

.dot-active {
    background-color: white;
}

.background-bar {
    height: .2rem;
    /* display: inline-block; */
    background-color: #6e9eff6d;
    /* background-color: #ffffff33; */
    /* background-color: red; */
    width: 100%;
    /* position: absolute; */
    /* transform: translateY(-3.9rem); */
    bottom: 0;
    left: 0;
}

.progress-bar {
    height: .2rem;
    /* display: inline-block; */
    background-color: #0055ff71;
    /* background-color: red; */
    width: 100%;
    position: absolute;
    /* position:sticky; */
    transform: translateY(-.5rem);
    /* bottom: 0; */
    left: 0;
}





.featured-section {
    background-image: url(stone-texture1.jpg);
    padding-top: 5rem;
    
}


.featured-container {

    display: flex;

    padding-bottom: 9rem;
    border-bottom: 1px dotted rgba(155, 155, 155, 0.466);
}


.featured-item {
    width: 33.3%;
}


.featured-item-image {
    width: 100%;
    height: 25rem;
    /* padding-top: 3rem; */

    display: flex;
    align-items: center;
    justify-content: center;
}

.featured-item-image img{
    width: 30rem;
    height: 30rem;
    object-fit: cover;
    /* object-position: -100px 0px; */
    scale: .6;
    
    /* border-radius: 15rem; */
    border-radius: 50%;

    /* clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%); */
    /* clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%); */


    /* clip-path: polygon(50% 0%, 90% 20%, 100% 60%, 75% 100%, 25% 100%, 0% 60%, 10% 20%); */
    /* clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%); */

    /* clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%); */

    transition:all .5s ease-in-out;

}



.featured-item-image img:hover {
    width: 32rem;
    height: 32rem;
    /* object-position: -105px 0px; */

    /* transform: translateY(-1rem); */
}


.featured-item-bananamatcha img {
    width: 30rem;
    height: 30rem;
    object-fit: cover;
    /* object-position: 0px 30px; */
    scale: .6;
    
    border-radius: 30rem;

    transition:all .5s ease-in-out;
}

.featured-item-image-pumpkin img {
    width: 30rem;
    height: 30rem;
    object-fit: cover;
    object-position: 0px 0px;
    scale: .6;
    
    border-radius: 30rem;

    transition:all .5s ease-in-out;
}

.featured-item-description{
    text-align: center;
    font-size: 2.3rem;

    font-weight:200;
}

.featured-item-description-dirty-banana {
    text-align: center;
    font-size: 2.3rem;
    width: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;

    font-weight:200;
}


.new-badge {
    width: 3rem;
    height: 3rem;
    position: absolute;
    background-color: red;
    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transform: translateX(8rem) translateY(5rem);
    z-index: 50;

    /* animation: move-y 1.5s infinite alternate ease-in-out; */
}

@keyframes move-y {
  from {
    transform: translateX(8rem) translateY(5rem);
  }
  to {
    transform: translateX(8rem) translateY(5.2rem);
  }
}




.staff-pick {
    width: 10rem;
    height: 4rem;
    position: absolute;
    background-color: rgb(12, 210, 255);
    border-radius: 3rem;

    

    padding-left: .1rem;

    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transform: translateX(50px) translateY(40px) rotate(0);
    z-index: 50;

    text-align: center;

    /* animation: move-y 1.5s infinite alternate ease-in-out; */

}


.seasonal-special {
    width: 8rem;
    height: 4rem;
    position: absolute;
    background-color: rgb(166, 0, 255);
    border-radius: 3rem;

    

    padding-left: .1rem;

    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transform: translateX(5rem) translateY(4rem) rotate(0);
    z-index: 50;

    text-align: center;
}


.icon-recommended {
    width: 3rem;
    height: 3rem;
    position: absolute;
    background-color: rgb(37, 230, 255);
    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transform: translateX(8rem) translateY(5rem);
    z-index: 50;

    font-size: 1.5rem;
}


.seasonal-icon {
    width: 3rem;
    height: 3rem;
    position: absolute;
    background-color: rgb(39, 233, 0);
    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transform: translateX(8rem) translateY(5rem);
    z-index: 50;
}









/* .next {
    height: 20rem;
} */

.bestseller {
    /* background-image: url('/marble-bk1.jpg');
    background-size: contain; */
    /* opacity: .9; */

    padding-top: 5rem;
    
}

.section-title {
    text-align: center;
    /* padding-top: 3rem; */
    padding-top: 1rem;
    padding-bottom: 7rem;

    font-size: 3rem;
    font-weight: 100;

}

.top-bar {
    margin: 0 auto;
    padding-top: 5rem;
    transform: translateY(5rem);
    /* margin-top: 5rem; */
    /* text-align: center; */
    border-top: .5rem solid rgba(189, 189, 189, 0.586);
    /* border-top: .5rem solid #c875db95; */
    width: 5rem;
}

.top-bar-circle {
    width: .7rem;
    height: .7rem;
    background-color: rgba(171, 171, 171, 0.452);
    border-radius: 50%;
    margin: 0 auto;
    /* margin-top: 5rem; */
    /* padding-top: 5rem; */
}


.bestseller-title {
    text-align: center;
    padding-top: 3rem;
    padding-bottom: 8rem;

    font-size: 3rem;
    font-weight: 100;
    font-style: italic;
}

.bestseller-photos {
    width: 100%;
    display: flex;
    /* font-size: 0; */
}

.beseseller-photos-half {
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    /* flex-direction: ; */

}

.beseseller-photo {
    width: 50%;
    /* background-color: rgb(214, 168, 255); */
    background-color: black;

    position: relative;
    
    
}

.photo-description {
    display: flex;
    position: absolute;
    /* text-align: center; */
    /* font-size: 4rem; */
    font-size: 3.2rem;
    color: white;
    width: 100%;
    height: 100%;
    z-index: 5;
    align-items: center;
    justify-content: center;
    font-weight: 200;

    opacity: 0;

    transition: opacity .4s ease;

    background-color: rgba(0, 0, 0, 0.549);
    z-index: 8;

    
    
    
}

.p-d-inner {
    padding: 0 1rem;
    
    text-align: center;
}


.beseseller-photo img {
    /* width: 50%; */
    width: 100%;
    display: block;
    aspect-ratio: 1 / 1;
    object-fit: cover;

    float: right;

    z-index: 10;

    transition: transform .5s ease;
    


    

}

.beseseller-photo {
    
    overflow: hidden;
}

.beseseller-photo:hover img,
.photo-img-active img{ 
    transform: scale(1.1);
}

.beseseller-photos-half img:hover {
    /* width: calc(100% - 3rem); */


    /* filter: brightness(0.5); */


    /* transform: scale(1.2); */
    
    
}


.photo-description {
    /* padding:0 3rem; */
    /* font-size: 1.7rem; */
}



.photo-description:hover,
.photo-description-tap-active {
    opacity: 1;


}


.manu-button {
    font-size: 3rem;
    font-weight: 200;
    text-align: center;
    padding-top: 4rem;
    padding-bottom: 8rem;
}

.menu-section {
     scroll-margin-top:7rem; 

     padding-top: 5rem;

     

    

     
}

.menu-photo-container {
    width: 100%;
    display: flex;
    /* align-items: center; */
    justify-content: center;
}

.menu-photo-container img{

    width: 45%;
    
}





.menu-flex {
    display: flex;
    padding-bottom: 10rem;
}

.menu-half {
    width: 50%;
}

.menu-category-headline{
    width: 100%;
    /* text-align: center; */
    font-size: 1.7rem;
    padding: 1rem 0;
    
    /* width: min-content; */
    display: flex;
    justify-content: center;

    /* transition: all .5s ease-in-out; */
}

/* .menu-category-headline:hover {
    background-image: linear-gradient(to right,rgb(255, 204, 0), rgb(255, 153, 0));
    color: transparent;
    background-clip: text;
    
    cursor:default;
} */

.menu-container {
    border-bottom: 1px solid #777;
    padding-bottom: .5rem;
}

.menu-item {
    text-align: center;
    padding: .5rem 0;
    font-size: 1.5rem;
    font-weight: 200;

    /* transition: all .3s ease-in-out; */
    
    
}

.menu-item:hover {
    background-image: linear-gradient(to right,rgb(187, 0, 255), rgb(0, 225, 255));
    color: transparent;
    background-clip: text;
    
    cursor:default;
}

.menu-one-third {
    width: 33.3%;
}










.location-section {
    border-top: 1px solid rgba(195, 195, 195, 0.447);

    scroll-margin-top:7rem; 

    border-bottom: 1px solid rgba(195, 195, 195, 0.447);

    padding-bottom: 5rem;
    padding-top: 5rem;

    
}

.location {
    width: 100%;
    display: flex;
    height: 50rem;
    
    flex-direction: row-reverse;
}

.google-map {
    display: flex;
    justify-content: center;
}

.google-map iframe {
    width: 80%;
}

.location-title {
    

    font-size: 3rem;
    font-weight: 200;
    text-align: center;
    padding-top: 4rem;
    padding-bottom: 8rem;

}

.map-details {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.location-description {
    padding: 3rem 13rem;
    font-size: 1.4rem;
    font-weight: 200;
    line-height: 1.5;
    
}

.address {
    /* text-align: center; */
    font-size: 1.4rem;
    /* font-weight: 300; */

    font-weight: 400;
    color: #30a1a1;
}

.map-button-container {
    padding-top: 4rem;
    display: flex;
}

.map-button {
    height: 8rem;
    
    /* padding: 1rem 5rem;
    border: 1px solid rgba(193, 193, 193, 0.3); */

    
    
}



.map-button img {
    width: 6rem;
    height: 6rem;
    border-radius: 50%;

    transition: all .5s ease;

    padding: 0 5rem;

    
}

.map-button img:hover {
    width: 7rem;
    height: 7rem;
    transform: translateX(2px);
    transform: translateY(-5px);

    padding: 0 4.5rem;
    /* padding-left: 4rem; */
    /* padding-bottom: 1rem; */
    
}

.map-text {
    display: flex;
}

.map-description {
    /* padding: 1rem 5rem; */
    font-size: 1.2rem;
    font-weight: 200;
    width: 16rem;
    text-align: center;


}




.google-map {
    width: 50%;
}

#map {
    

    /* height: 100%; */
    height: 45rem;
    width: 80%;
    /* padding-right: 3rem;
    padding-left: 3rem; */
    /* margin: 0 auto; */
    display: flex;
    justify-content: center;
    align-self: center;
    z-index: 90;
}

.order-online-section {
    width: 100%;
    display: flex;

    /* height: 30rem; */
    height: 20rem;

    /* justify-content: center; */
    align-items: center;
    border-top: 1px solid rgba(195, 195, 195, 0.447);

    /* background-image: linear-gradient(to top right, rgb(199, 248, 255), rgba(216, 255, 198, 0.762)); */
    /* background-image: linear-gradient(to top right, rgb(199, 248, 255), rgb(255, 251, 196)); */
    background-image: linear-gradient(to bottom left, rgb(199, 248, 255), rgb(247, 209, 255));
    color: black;

    
}

.order-title {
    width: 50%;
    text-align: center;
    font-size: 3rem;
    font-weight: 200;
}

.order-button-container {
    width: 50%;
    display: flex;
    justify-content: center;
    /* align-items: center; */
    
}
.order-button {
    /* width: min-content; */
    width: max-content;
    padding: 1.5rem 4rem;
    background-color: rgb(0, 200, 255);
    border-radius: 3rem;
    /* border: 1px solid white; */
    color: white;
    font-size: 1.5rem;
    /* justify-content: center;  */

    transition: all .5s ease;
}

.order-button:hover {
    /* color: rgb(0, 200, 255); */
    /* color: rgb(0, 200, 255); */
    /* color: white; */
    /* background-color: rgb(138, 245, 255); */
    background-color: rgb(255, 175, 45);
    /* border: 1px solid rgb(0, 200, 255); */

    /* border: 1px solid rgb(255, 232, 56); */
}

.order-button-container a {
    text-decoration: none;
}


/* .photo-description:hover .beseseller-photos-half img {
    transform: scale(1.2);
} */

.story-section {
    scroll-margin-top:7rem; 
    padding-top: 5rem;

     /* background-image: url(/simon-berger-JH_R66BihvA-unsplash.jpg); */
}


.story-flex {
    display: flex;
    width: 100%;

    /* justify-content: center; */


    margin-bottom: 10rem;

    
}

.story-photo {

    width: 50%;


    display: flex;
    justify-content: center; /* Center image horizontally */
    align-items: center;     /* Optional: center image vertically */


    
    
    
}

.story-photo img {
    width: 60%;
    /* height: auto; */
    margin: 0 auto;

    transition: all .5s ease-in-out;
}


.story-photo img:hover {
    width: 63%;
    
}



.story-description {
    width: 50%;

    display: flex;
    justify-content: center; /* Center image horizontally */
    align-items: center;     /* Optional: center image vertically */

    
}


.story-paragraph {
    width: 70%;
    font-size: 1.7rem;
    font-weight: 100;
    line-height: 1.5;
    
}

footer {
    /* height: 20rem; */
    background-color: rgba(217, 217, 217, 0.316);
    /* display: none; */
    width: 100%;
}

.footer-container {
    /* height: 2rem; */
    /* height: 18rem; */
    width: 100%;
    display: flex;
}

.footer-box {
    width: 33.3%;
    padding: 5rem 10rem;
}

.footer-box a {
    text-decoration: none;
    color: inherit;
}

.footer-item-head {
    padding: 1rem .5rem;
    font-size: 1.3rem;
    font-weight: 300;
    width: max-content;
    border-bottom: 1px solid rgb(255, 161, 21);
    margin-bottom: 1rem;
    color: rgb(52, 52, 52);
}

.footer-item-head a{
    text-decoration: none;
}

.footer-item-head a:visited {
    color: inherit;
}
.footer-item {
    padding: 1rem 0;
    font-size: 1.2rem;
    font-weight: 300;
    width: max-content;
}

.footer-item a {
    text-decoration: none;
    color: inherit;
}



.footer-item a:visited {
    color: inherit;
}


.footer-instargam-title {
    padding: 1rem 0;
    font-size: 1.2rem;
    font-weight: 300;
    text-align: center;
}

.footer-instargam {
    font-size: 1.8rem;
    text-align: center;
    margin-top: 0rem;
}


.copyright {
    width: 100%;
    bottom: 0;
    /* position: fixed; */
    text-align: center;
    padding-bottom: 1rem;

    font-size: 1.1rem;
    font-weight: 200;

    letter-spacing: .5px;
}