/*=====================
      1400 Screen
=======================*/
@media(max-width: 1400px){
	.home .slide .content {
		position: absolute;
		top: 285px;
	}

}
/*=====================
      1400 Screen
=======================*/

/*=====================
      1200 Screen
=======================*/
@media(max-width: 1200px){
	.home .slide .content {
		position: absolute;
		top: 252px;
	}
	.navbar .navbar-brand {
		width: 280px;
	}
	.about-section h2 {
		font-size: 1.7rem;
	}
	.tabs-section{
		overflow: hidden;
	}

}

/*=====================
      1200 Screen
=======================*/
@media(max-width: 1160px){
	.home .slide .content {
		top: 230px;
	}
	.meal h1 {
		font-size: 1.7rem;
	}
}
/*=====================
      991 Screen
=======================*/
@media(max-width: 991px){
	.home {
    margin-top: 85px;
  }
	.home .slide .content {
		 top: 185px;
	}
	.meal h1 {
		font-size: 1.6rem;
	}
	.story-section h3 {
		font-size: 2.2rem;
	}
	.service-banner > .container{
		max-width: 100%;
	}
	.service-banner .banner .content h3 {
		font-size: 1.5rem;
	}
	.staff-section > .container{
		max-width: 100%;
	}
	.staff-section .box-container .box .content h3 {
  		font-size: 1.5rem;
	}
	.quality > .container{
		max-width: 100%;
	}
	.quality .box .icon {
		width: unset;
	}
	.quality .box h3{
		margin-right: 0 !important;
	}
	.navbar .navbar-brand {
		text-align: left;
	}
	.footer.container{
		max-width: 100%;
		padding: 0 28px;
	}
	.footer .box.social{
		padding-left: 40px; 
	}
	.footer .box.ps-md-4{
		padding-left: 40px;
	}
	.about-section h2 {
		font-size: 2rem;
		text-align: center;
	}
	.about-section .text-sec {
  		padding: 0 28px;
	}
	.food-type .row{
		flex-direction: column-reverse;
	}
	.container.ups-section{
		max-width: 100%;
		padding: 0 28px;
	}
	.ups-section .box .title {
		font-size: 20px;
	}
	.faq > .container{
		max-width: 100%;
		padding: 0 28px;
	}
	.first-section.contact{
		max-width: 100%;
		padding: 0 28px;
	}
	.form-section > .container{
		max-width: 100%;
		padding: 0 28px;
	}
	.tabs-section .tab-pane .img-box{
		margin-top: unset !important;
	}
	.tabs-section .tab-pane .img-box img.mt-2{
		margin-top: 16px !important;
	}
	.tabs-section .tab-pane .img-box.b-img{
		margin-top: -50px !important;
	}
	.tabs-section .tab-pane .img-box.b-img2{
		margin-top: -180px !important;
	}
	.staff-section.container{
		max-width: 100%;
		padding: 0 28px;
	}
	.popular > .container{
		max-width: 100%;
		padding: 0 28px;
	}
	.footer .box-container .contact-box {
		width: calc(100% + 45px);
	}
}

/*=====================
      991 Screen End
=======================*/
@media(max-width: 860px){
	.home .slide .content {
		top: 165px;
	}
}
@media(max-width: 786px){
	.home .slide .content {
		top: 145px;
	}
	.quality .box h3 {
		font-size: 1.3rem;
	}
}
/*=====================
      768 Screen
=======================*/
@media(max-width: 768px){
	.home {
  		margin-top: 80px;
	}
	.meal > .container{
		max-width: 100%;
	}
	.meal h1 {
		font-size: 1.4rem;
	}
	.meal .meal-btn .btn {
		font-size: 14px;
	}
	.story-section.container{
	 	max-width: 100%;
	 	padding: 0 28px;
	 }
	 .service-banner .row .col-sm-6:last-child{
		margin-top: 24px;
	}
	.staff-section .row .col-sm-6:last-child{
		margin-top: 24px;
	}
	.feed-section.container{
		max-width: 100%;
		padding: 0 28px;
	}	
	.quality .box {
		margin-bottom: 24px;
	}
	.quality{
		padding: 32px 0;
		padding-top: 60px;
	}
	.navbar > .container{
		max-width: 100%;
		padding: 0 28px;
	}
	.popular .row .col-md-4:last-child{
		margin-top: 24px;
	}
	.popular .box-container .box {
		height: auto;
		margin-bottom: 24px;
	}
	.map-area{
		margin-top: 24px;
		height: 250px;
	}
	.first-section.contact .row:fist-child{
		flex-direction: column-reverse;
	}
	.tabs-section .tab-pane .celibrity-img.mt2 {
  		margin-top: 20px;
	}
	.tabs-section .tab-pane .p-video, .tabs-section .tab-pane .p-video .video-box {
  		height: 430px;
  		margin-top: -65px;
	}
	.tabs-section .tab-pane .p-video img{
		display: none;
	}
	.tabs-section .tab-pane .celibrity-img.mt2 + .celibrity-img{
		margin-top: -60px;
	}
	.meal {
		padding: 25px 0;
	}
}

/*=====================
      768 Screen
=======================*/

/*=====================
      650 Screen
=======================*/
@media(max-width: 650px){
	.home {
  		margin-top: 70px;
	}
	.home .slide .content {
		top: 115px;
	}
	.home .flex-slider .flex-direction-nav .flex-prev, .flex-slider .flex-direction-nav .flex-next .fa {
  		font-size: 1.5rem;
  		line-height: 1.5rem;
  		color: var(--white);
	}
	.home .flex-slider .flex-direction-nav .flex-prev:hover, .flex-slider .flex-direction-nav .flex-next:hover {
  		background: transparent;
  		color: var(--white);
	}
	.home .slide .content span {
		font-size: 1.3rem;
	}
	.meal h1 {
	  font-size: 1.2rem;
	  margin-bottom: 1rem;
	}
	.about-section h2 {
		font-size: 1.6rem;
	}
	.story-section .story-logo > div {
  		width: 50%;
	}	
}

/*=====================
      650 Screen
=======================*/

/*=====================
      575 Screen
=======================*/
@media(max-width: 575px){
.service-banner .row .col-sm-6{
		margin-top: 24px;
	}
	.service-banner > .container{
		padding: 0 28px;
	}
	.staff-section .row .col-sm-6{
		margin-top: 24px;
	}	
	.staff-section > .container {
		padding: 0 28px;
	}
	.footer .box.social{
		padding-left: 0px; 
	}
	.footer .box.ps-md-4{
		padding-left: 0px;
	}
	.tabs-section .tab-pane .img-box.b-img {
  		margin-top: 24px !important;
	}
	.tabs-section .tab-pane .img-box.b-img2{
  		margin-top: 22px !important;
	}
	.add-section .icon-container {
		padding-left: 0;
	}
	.tabs-section .tab-pane .celibrity-img:first-child{
		margin-bottom: 20px;
	}
	.tabs-section .tab-pane .p-video, .tabs-section .tab-pane .p-video .video-box {
  		height: auto;
  		margin-top: 10px;
	}
	.tabs-section .tab-pane .celibrity-img.mt2 + .celibrity-img {
  		margin-top: 20px;
	}
	.tabs-section .tab-pane .p-video img{
		display: block;
	}
}

/*=====================
      560 Screen
=======================*/
@media(max-width: 560px){
	.home .slide .content {
		top: 100px;
	}
	.home .slide .content span {
		font-size: 1.2rem;
	}
	.home {
  		margin-top: 77px;
	}

	
}

/*=====================
      480 Screen
=======================*/

@media(max-width: 480px){
	.home .slide .content {
		top: 85px;
	}
	.home .slide .content span {
		font-size: 1rem;
	}
	.quality .box h3 {
		font-size: 1.1rem;
	}
	 .tab .nav-pills li{
        width:100%;
        margin-bottom: 5px;
    }
    .tab .nav-pills li button{
        padding: 10px;
        border-radius: 16px;
    }
    .tab .nav-pills .nav-item {
    	max-width: 130px;
	}
    .tab .nav-pills li.active button:before,
    .tab .nav-pills li.active button:after{
        border: none;
    }
    .tab .tab-content{
        margin-top: 5px;
    }
    .story-section .story-logo > div {
  		width: 60%;
	}
}

/*=====================
      480 Screen
=======================*/

/*=====================
      430 Screen
=======================*/

@media(max-width: 430px){
	.home .slide .content {
		top: 75px;
	}
	.home .slide .content span {
		font-size: 1rem;
	}
	.tab .nav-pills .nav-item {
    	max-width: 110px;
	}
	.contact .add-section .add p {
		font-size: 14px;
	}
	.contact .add-section .icon-container a {
		font-size: 14px;
	}
	.first-section .contact-box {
		padding: 8px;
	}
	.navbar > .container {
		padding: 0 20px;
	}
	.story-section .story-logo > div {
  		width: 65%;
	}
	.meal {
  		padding: 16px 0;
	}	
	.meal h1 {
		font-size: 1rem;
	}
}

/*=====================
      430 Screen
=======================*/
@media(max-width: 390px){
	.home .slide .content span {
		font-size: 0.8rem;
	}
	.navbar-brand img{
		width: 50% !important;
	}
	.navbar > .container{
		padding: 0 5px;
	}
	.tab .nav-pills .nav-item {
    	max-width: 100px;
	}
	.navbar .navbar-brand {
  		width: 260px;
  		margin-left: 10px;
	}
	.story-section .story-logo > div {
  		width: 70%;
	}
	.home .slide .content {
		top: 90px;
	}
	.home .flex-slider .slides > li {
		height: 60vw;
	}
}
@media(max-width: 360px){
	.navbar .navbar-brand {
  		width: 240px;
  	}
  	.meal {
  		padding: 12px 0;
	}
  	.meal h1 {
		font-size: 0.9rem;
	}
}

