@import url(fonts.css);
:root{
    --maincolor: #f8e3a8;
}
*{
    margin: 0;
    padding: 0;
}
body{
    overflow-x: hidden;
}
.brand-name {
    color:var(--maincolor);
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}
.fa-sun{
    color: white;
}
.lighter{
    background: #212529;
}
.lighter:focus {
    color: #000;
    background-color: #000;
    border-color: #f9fafb;
    box-shadow: 0 0 0 0.25rem 
}
.lighter:hover{
    background: white !important;
}
.lighter:hover .fa-sun{
    color:var(--maincolor);
}

.font-Lobste{
    font-family: 'Marck';
}
.logo a:hover {
    color: white !important;
}
.nav-bg{
    background:var(--maincolor);
}
.text-color{
    color: var(--maincolor);
}
.btn:hover {
    color: white;
}
.welcome-image{
    filter: brightness(.7);
}
.welcome{
    background:#4d3926 ;
}
.vertical{
    height: 0px;
}
.welcome-text{
    padding: 30% 0 50%;
    font-family: 'Marck';

}
.our-food{
  background: #1c1209;
 
}
h2{
    color: var(--maincolor);
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;

}
.ourfood-menu a{
    text-decoration: none;
    transition: transform .5s cubic-bezier(.85,-0.65,1,.33);
}
.ourfood-menu a:hover{
    transform: scale(1.1);
    text-decoration: none;
    color: white;
}
.menu1{
    background-image: linear-gradient(90deg,rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0.3)) , url(../images/menu1.jpg);
    color: #f4f6f5;
    background-size: cover;
    
}
.menu2{
    background-image: linear-gradient(90deg,rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0.3)) ,url(../images/menu2.jpg);
    color: #f4f6f5;
    background-size: cover;
    
 }
.ourfood-menu h3{
    margin-top: 70%;
}
hr{
    border-top: 2px solid var(--maincolor);
}
.form-select {
    width: 100%;
    color: var(--maincolor);
   background: #1c1209;
   border: var(--maincolor) 1px solid;
   border-radius: 0px;
}
.btn-outline-main {
    color: var(--maincolor);
    border-color: var(--maincolor);
    width: 12%;
}
.form-select:focus {
    border-color: var(--maincolor);
    outline: 0;
    box-shadow: 0 0 0 0.25rem #f8e3a83d;
}
.our-story{
    background: #4d3926;
    border-top: rgb(248 227 168 / .25) 1px solid;
}
.benfits{
    background: #f8e3a8;

}

.text1 {
    font-size: 60px;
    text-transform: capitalize;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;

}

.text-one-1 {
    animation: text1;
    -webkit-animation: text1;
}

.text-two-2 {
    animation: text2;
}

.text-three-3 {
    animation: text3;
    -webkit-animation: text3;
}

.text-four-4 {
    animation: text4;
    -webkit-animation: text4;
}

.text-five-5 {
    animation: text5;
    -webkit-animation: text5;
}


.text-one-1,
.text-two-2,
.text-three-3,
.text-four-4,
.text-five-5{
    font-size: 50px;
    font-weight: bolder;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    animation-duration: 15s;
    animation-timing-function: steps(50);
    animation-iteration-count: infinite;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;

}

@keyframes text1 {
    0%,
    20%,
    30%,
    40%,
    50%,
    60%,
    70%,
    80%,
    90%,
    100% {
        width: 0;
    }
    10% {
        width: 11em;
    }
}

@keyframes text2 {
    0%,
    10%,
    20%,
    40%,
    50%,
    60%,
    70%,
    80%,
    90%,
    100% {
        width: 0;
    }
    30% {
        width: 12em;
    }
}

@keyframes text3 {
    0%,
    10%,
    20%,
    30%,
    40%,
    60%,
    70%,
    80%,
    90%,
    100% {
        width: 0;
    }
    50% {
        width: 13em;
    }
}

@keyframes text4 {
    0%,
    10%,
    20%,
    30%,
    40%,
    50%,
    60%,
    80%,
    90%,
    100% {
        width: 0em;
    }
    70% {
        width: 15em;
    }
}

@keyframes text5 {
    0%,
    10%,
    20%,
    30%,
    40%,
    50%,
    60%,
    70%,
    80%,
    100% {
        width: 0em;
    }
    90% {
        width: 18em;
    }
}




.upcommin-events{
    background: #1c1209;
}
.btn-outline-second{
    background: black;
    color: white;
}
.fs-7{
    font-size: 14px;
}
.card{
    border: black 1px solid;
}
.about-us img{
    clip-path: circle();
    width: 23%;
}
.about-us{
    background: #f8e3a8;
}
.about-us h3{
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}
.contact-us{
    background:#4d3926;
}
.contact-text{
    padding: 8% 0 56%;
}
iframe{
    width: 100%;
}
.time{
    background-image: linear-gradient(90deg,rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0.3)) ,url(../images/open-time.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.open-time{
    background: #f8e3a8;
}
.feedback{
    background: url(../images/feedback.jpg)no-repeat;
    background-size: cover;
}
.px-m{
    padding: 0 20%;
}
.feedback .form-control {
    color: white;
    background: rgb(0 0 0 / 7%);
    border: 1px solid #d5b8a4;
    border-radius: 0;
}
.form-control:focus {
    color: white;
    background-color: rgb(0 0 0 / 7%);;
    border-color: #d5b8a4;
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
}
.height{
    height: 37px;
}
textarea{
    resize: none;
}
.fd-btn{
    width: 140px;
    background: white;
    color: black;
    height: 53px;
    border-radius: 0;
    position: relative;
    top: -27px;
}
.shake-little{
    display: unset;
}
.fd-btn:hover {
    color: black;
}
.feedback .form-control::placeholder { 
    color: white;
    opacity: 1; 
}

.feedback .form-control:-ms-input-placeholder { 
    color: white;
}

footer{
    border-top: #35271b 3px solid;
}
footer a:hover{
    color: white;
}