templates/default/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}{{titlePage}}{% endblock %}
  5. {% block body %}
  6. {#    ZONA SLINDER#}
  8.     <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
  9.         <ol class="carousel-indicators">
  10.             <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
  11.             <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
  12.             <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
  13.         </ol>
  14.         <div class="carousel-inner custom-slide">
  15.             <div class="carousel-item active custom-slide-item">
  16.                <div class="row">
  17.                    <div class="col-lg-6">
  18.                        <div class="alignation-header" data-aos="fade-up-right " data-aos-duration="2000">
  19.                         <div class="titlelider">
  20.                             <span>Esperienta o nosso novo Burger</span>
  21.                         </div>
  22.                            <div class="description">
  23.                                <span>CHOPPER BURGER by FABIOS</span>
  24.                            </div>
  25.                            <div class="button-header">
  26.                                <button class="as-btn">Saber Mais</button>
  27.                            </div>
  28.                        </div>
  29.                    </div>
  30.                    <div class="col-lg-6" data-aos="zoom-in-left" data-aos-duration="2000" >
  31.                        <img class="image-slider" style="position:relative" src="{{ asset('assets/img/headerburger.png') }}">
  32.                    </div>
  33.                </div>
  34.             </div>
  35. {#            <div class="carousel-item">#}
  36. {#                <img src="..." class="d-block w-100" alt="...">#}
  37. {#            </div>#}
  38. {#            <div class="carousel-item">#}
  39. {#                <img src="..." class="d-block w-100" alt="...">#}
  40. {#            </div>#}
  41.         </div>
  42.         <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
  43.             <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  44.             <span class="sr-only">Previous</span>
  45.         </a>
  46.         <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
  47.             <span class="carousel-control-next-icon" aria-hidden="true"></span>
  48.             <span class="sr-only">Next</span>
  49.         </a>
  50.     </div>
  52. {#    <div class="d-none d-md-block">#}
  53. {#        <div class="ls-wp-container fitvidsignore hero-2 as-hero-carousel" style="width:1920px;height:800px;margin:0 auto;margin-bottom: 0px;">#}
  54. {#            <div class="ls-slide" data-ls="duration:6000; transition2d:5,114; kenburnsscale:1.2;">#}
  55. {#                <img width="1920" height="800" src="assets/img/hero/hero_bg_1_1.jpg" class="ls-bg" alt="bg"> <img width="133" height="168" src="assets/img/hero/hero_shape_4.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:5000; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_5.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:47px; left:811px;" data-ls="offsetxin:100; offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:1500; parallax:true; parallaxlevel:8; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_6.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:302px; left:160px;" data-ls="offsetxin:-300; offsetyin:100; durationin:1500; delayin:80; rotatein:60; durationout:1500; parallax:true; parallaxlevel:10; parallaxdurationmove:800; position:fixed;"> <img width="190" height="118" src="assets/img/hero/hero_shape_7.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:658px; left:28px;" data-ls="offsetyin:200; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="200" height="173" src="assets/img/hero/hero_shape_8.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:593px; left:586px;" data-ls="offsetxin:100; offsetyin:300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="539" height="456" src="assets/img/hero/hero_shape_2.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:29px; left:182px;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; parallax:true; parallaxlevel:10; parallaxdurationmove:400; position:fixed;"> <img width="943" height="763" src="assets/img/hero/hero_shape_3.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:0px;" data-ls="offsetxin:-600; durationin:1500; delayin:80; bgcolorin:transparent; colorin:transparent; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-hide-tablet ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:458px; left:485px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-hide-desktop ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:495px; left:308px; width:374px; height:35px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;">#}
  56. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="shop.html" target="_self" data-ls="offsetxin:500; delayin:180; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#ff9d2d; position:fixed;">#}
  57. {#                    <ls-layer style="font-size:14px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:162px; left:344px; top:510px; text-transform:capitalize; line-height:14px; padding-bottom:20px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#FF9D2D;" class="ls-button-layer">ORDER NOW</ls-layer>#}
  58. {#                </a>#}
  59. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="menu-fast.html" target="_self" data-ls="offsetxin:500; delayin:200; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#eb0029; position:fixed;">#}
  60. {#                    <ls-layer style="font-size:14px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:162px; left:530px; top:510px; text-transform:capitalize; line-height:14px; padding-bottom:20px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#EB0029;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  61. {#                </a>#}
  62. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:222px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">WE SERVE THE</h1>#}
  63. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:301px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:80; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">TASTE, AS YOU</h1>#}
  64. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:380px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l hero-title ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:160; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">LIKE <span class="font-style text-theme2">FOODS</span></h1>#}
  65. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-phone" href="shop.html" target="_self" data-ls="offsetxin:500; delayin:180; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#ff9d2d; position:fixed;">#}
  66. {#                    <ls-layer style="font-size:32px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:78px; top:549px; text-transform:capitalize; padding-bottom:30px; padding-top:30px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#FF9D2D; line-height:32px; width:270px;" class="ls-button-layer">ORDER NOW</ls-layer>#}
  67. {#                </a>#}
  68. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-phone" href="menu-fast.html" target="_self" data-ls="offsetxin:500; delayin:200; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#eb0029; position:fixed;">#}
  69. {#                    <ls-layer style="font-size:32px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:378px; top:549px; text-transform:capitalize; padding-bottom:30px; padding-top:30px; font-weight:600; border-radius:999px 999px 999px 999px; line-height:32px; width:310px; background-color:#eb0029;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  70. {#                </a>#}
  71. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:160px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">WE SERVE THE</h1>#}
  72. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:276px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:80; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">TASTE, AS YOU</h1>#}
  73. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:391px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l hero-title ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:160; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">LIKE <span class="font-style text-theme2">FOODS</span></h1>#}
  74. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-tablet" href="shop.html" target="_self" data-ls="offsetxin:500; delayin:180; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#ff9d2d; position:fixed;">#}
  75. {#                    <ls-layer style="font-size:42px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:78px; top:549px; text-transform:capitalize; padding-bottom:40px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#FF9D2D; line-height:42px; width:340px; padding-top:40px;" class="ls-button-layer">ORDER NOW</ls-layer>#}
  76. {#                </a>#}
  77. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-tablet" href="menu-fast.html" target="_self" data-ls="offsetxin:500; delayin:200; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#eb0029; position:fixed;">#}
  78. {#                    <ls-layer style="font-size:42px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:464px; top:549px; text-transform:capitalize; padding-bottom:40px; padding-top:40px; font-weight:600; border-radius:999px 999px 999px 999px; line-height:42px; background-color:#eb0029; width:400px;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  79. {#                </a>#}
  80. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:149px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer" data-ls="offsetxin:500; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-80; durationout:400; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">WE SERVE THE</h1>#}
  81. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:264px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-tablet ls-text-layer" data-ls="offsetxin:500; delayin:80; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-80; durationout:400; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">TASTE, AS YOU</h1>#}
  82. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:378px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l hero-title ls-hide-desktop ls-hide-tablet ls-text-layer" data-ls="offsetxin:500; delayin:160; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-80; durationout:400; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">LIKE <span class="font-style text-theme2">FOODS</span></h1>#}
  83. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="#1" target="_self" data-ls="static:forever; position:fixed;">#}
  84. {#                    <ls-layer style='text-align:center; font-weight:700; cursor:pointer; width:30px; height:30px; left:110px; top:345px; line-height:32px; background-size:contain; background-position:50% 50%; color:#eb0029; font-size:12px; background-image:url("assets/img/hero/dot_bg_white.png");' class="ls-button-layer">1</ls-layer>#}
  85. {#                </a>#}
  86. {#                <ls-layer style='text-align:center; font-weight:700; cursor:pointer; width:30px; height:30px; left:110px; top:345px; line-height:32px; background-size:contain; background-position:50% 50%; font-size:12px; color:#ffffff; background-image:url("assets/img/hero/dot_bg.png");' class="ls-l ls-hide-tablet ls-hide-phone ls-button-layer" data-ls="durationin:400; position:fixed;">1</ls-layer>#}
  87. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="#2" target="_self" data-ls="static:forever; position:fixed;">#}
  88. {#                    <ls-layer style='text-align:center; font-weight:700; cursor:pointer; width:30px; height:30px; left:110px; top:386px; line-height:32px; background-size:contain; background-position:50% 50%; color:#eb0029; font-size:12px; background-image:url("assets/img/hero/dot_bg_white.png");' class="ls-button-layer">2</ls-layer>#}
  89. {#                </a>#}
  90. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="#3" target="_self" data-ls="static:forever; position:fixed;">#}
  91. {#                    <ls-layer style='text-align:center; font-weight:700; cursor:pointer; width:30px; height:30px; left:110px; top:426px; line-height:32px; background-size:contain; background-position:50% 50%; color:#eb0029; font-size:12px; background-image:url("assets/img/hero/dot_bg_white.png");' class="ls-button-layer">3</ls-layer>#}
  92. {#                </a>#}
  93. {#                <img width="2" height="100" src="assets/img/hero/dot_line.png" class="ls-l ls-hide-tablet ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; left:124px; top:236px;" data-ls="static:forever; position:fixed;"> <img width="2" height="100" src="assets/img/hero/dot_line_2.png" class="ls-l ls-hide-tablet ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; left:124px; top:464px;" data-ls="static:forever; position:fixed;">#}
  94. {#            </div>#}
  95. {#            <div class="ls-slide" data-ls="duration:6000; transition2d:5,114; kenburnsscale:1.2;">#}
  96. {#                <img width="1920" height="800" src="assets/img/hero/hero_bg_1_2.jpg" class="ls-bg" alt="bg"> <img width="133" height="168" src="assets/img/hero/hero_shape_4.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:5000; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_5.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:47px; left:811px;" data-ls="offsetxin:100; offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:1500; parallax:true; parallaxlevel:8; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_6.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:302px; left:160px;" data-ls="offsetxin:-300; offsetyin:100; durationin:1500; delayin:80; rotatein:60; durationout:1500; parallax:true; parallaxlevel:10; parallaxdurationmove:800; position:fixed;"> <img width="190" height="118" src="assets/img/hero/hero_shape_7.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:658px; left:28px;" data-ls="offsetyin:200; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="200" height="173" src="assets/img/hero/hero_shape_8.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:593px; left:586px;" data-ls="offsetxin:100; offsetyin:300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="539" height="456" src="assets/img/hero/hero_shape_2.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:29px; left:182px;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; parallax:true; parallaxlevel:10; parallaxdurationmove:400; position:fixed;"> <img width="943" height="763" src="assets/img/hero/hero_shape_3.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:0px;" data-ls="offsetxin:-600; durationin:1500; delayin:80; bgcolorin:transparent; colorin:transparent; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-hide-tablet ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:458px; left:485px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-hide-desktop ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:495px; left:308px; width:374px; height:35px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;">#}
  97. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="shop.html" target="_self" data-ls="offsetxin:500; delayin:180; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#ff9d2d; position:fixed;">#}
  98. {#                    <ls-layer style="font-size:14px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:162px; left:344px; top:510px; text-transform:capitalize; line-height:14px; padding-bottom:20px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#FF9D2D;" class="ls-button-layer">ORDER NOW</ls-layer>#}
  99. {#                </a>#}
  100. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="menu-fast.html" target="_self" data-ls="offsetxin:500; delayin:200; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#eb0029; position:fixed;">#}
  101. {#                    <ls-layer style="font-size:14px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:162px; left:530px; top:510px; text-transform:capitalize; line-height:14px; padding-bottom:20px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#EB0029;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  102. {#                </a>#}
  103. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:222px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">YOU ALWAYS LIKE</h1>#}
  104. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:301px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:80; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">TASTE, OF OUR</h1>#}
  105. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:380px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l hero-title ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:160; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">FAST <span class="font-style text-theme2">FOODS</span></h1>#}
  106. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-phone" href="shop.html" target="_self" data-ls="offsetxin:500; delayin:180; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#ff9d2d; position:fixed;">#}
  107. {#                    <ls-layer style="font-size:32px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:78px; top:549px; text-transform:capitalize; padding-bottom:30px; padding-top:30px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#FF9D2D; line-height:32px; width:270px;" class="ls-button-layer">ORDER NOW</ls-layer>#}
  108. {#                </a>#}
  109. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-phone" href="menu-fast.html" target="_self" data-ls="offsetxin:500; delayin:200; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#eb0029; position:fixed;">#}
  110. {#                    <ls-layer style="font-size:32px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:378px; top:549px; text-transform:capitalize; padding-bottom:30px; padding-top:30px; font-weight:600; border-radius:999px 999px 999px 999px; line-height:32px; width:310px; background-color:#eb0029;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  111. {#                </a>#}
  112. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:160px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">YOU ALWAYS LIKE</h1>#}
  113. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:276px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:80; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">TASTE, OF OUR</h1>#}
  114. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:391px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l hero-title ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:160; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">FAST <span class="font-style text-theme2">FOODS</span></h1>#}
  115. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="#2" target="_self" data-ls="durationin:400; position:fixed;">#}
  116. {#                    <ls-layer style='text-align:center; font-weight:700; cursor:pointer; width:30px; height:30px; left:110px; top:386px; line-height:32px; background-size:contain; background-position:50% 50%; font-size:12px; color:#ffffff; z-index:9999; background-image:url("assets/img/hero/dot_bg.png");' class="ls-button-layer">2</ls-layer>#}
  117. {#                </a>#}
  118. {#            </div>#}
  119. {#            <div class="ls-slide" data-ls="duration:6000; transition2d:5,114; kenburnsscale:1.2;">#}
  120. {#                <img width="1920" height="800" src="assets/img/hero/hero_bg_1_3.jpg" class="ls-bg" alt="bg"> <img width="133" height="168" src="assets/img/hero/hero_shape_4.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:5000; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_5.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:47px; left:811px;" data-ls="offsetxin:100; offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:1500; parallax:true; parallaxlevel:8; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_6.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:302px; left:160px;" data-ls="offsetxin:-300; offsetyin:100; durationin:1500; delayin:80; rotatein:60; durationout:1500; parallax:true; parallaxlevel:10; parallaxdurationmove:800; position:fixed;"> <img width="190" height="118" src="assets/img/hero/hero_shape_7.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:658px; left:28px;" data-ls="offsetyin:200; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="200" height="173" src="assets/img/hero/hero_shape_8.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:593px; left:586px;" data-ls="offsetxin:100; offsetyin:300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="539" height="456" src="assets/img/hero/hero_shape_2.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:29px; left:182px;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; parallax:true; parallaxlevel:10; parallaxdurationmove:400; position:fixed;"> <img width="943" height="763" src="assets/img/hero/hero_shape_3.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:0px;" data-ls="offsetxin:-600; durationin:1500; delayin:80; bgcolorin:transparent; colorin:transparent; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-hide-tablet ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:458px; left:584px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-hide-desktop ls-hide-phone ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:495px; left:446px; width:374px; height:35px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;">#}
  121. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="shop.html" target="_self" data-ls="offsetxin:500; delayin:180; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#ff9d2d; position:fixed;">#}
  122. {#                    <ls-layer style="font-size:14px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:162px; left:344px; top:510px; text-transform:capitalize; line-height:14px; padding-bottom:20px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#FF9D2D;" class="ls-button-layer">ORDER NOW</ls-layer>#}
  123. {#                </a>#}
  124. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="menu-fast.html" target="_self" data-ls="offsetxin:500; delayin:200; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#eb0029; position:fixed;">#}
  125. {#                    <ls-layer style="font-size:14px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:162px; left:530px; top:510px; text-transform:capitalize; line-height:14px; padding-bottom:20px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#EB0029;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  126. {#                </a>#}
  127. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:222px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">WE PROVIDE BEST</h1>#}
  128. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:301px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:80; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">BEHAVIOUR AND</h1>#}
  129. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:80px; top:380px; left:340px; color:#ffffff; font-size:70px; white-space:normal;" class="ls-l hero-title ls-hide-tablet ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:160; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">YUMMY <span class="font-style text-theme2">FOODS</span></h1>#}
  130. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-phone" href="shop.html" target="_self" data-ls="offsetxin:500; delayin:180; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#ff9d2d; position:fixed;">#}
  131. {#                    <ls-layer style="font-size:32px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:78px; top:549px; text-transform:capitalize; padding-bottom:30px; padding-top:30px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#FF9D2D; line-height:32px; width:270px;" class="ls-button-layer">ORDER NOW</ls-layer>#}
  132. {#                </a>#}
  133. {#                <a style="" class="ls-l ls-hide-desktop ls-hide-phone" href="menu-fast.html" target="_self" data-ls="offsetxin:500; delayin:200; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#ffffff; hovercolor:#eb0029; position:fixed;">#}
  134. {#                    <ls-layer style="font-size:32px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; left:378px; top:549px; text-transform:capitalize; padding-bottom:30px; padding-top:30px; font-weight:600; border-radius:999px 999px 999px 999px; line-height:32px; width:310px; background-color:#eb0029;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  135. {#                </a>#}
  136. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:160px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">WE PROVIDE BEST</h1>#}
  137. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:276px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:80; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">BEHAVIOUR AND</h1>#}
  138. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:700; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:110px; top:391px; left:72px; color:#ffffff; font-size:100px; white-space:normal;" class="ls-l hero-title ls-hide-desktop ls-hide-phone ls-text-layer" data-ls="offsetxin:500; delayin:160; easingin:easeOutBack; bgcolorin:transparent; colorin:transparent; offsetxout:-120; durationout:800; startatout:slidechangeonly + ; bgcolorout:transparent; colorout:transparent; position:fixed;">YUMMY <span class="font-style text-theme2">FOODS</span></h1>#}
  139. {#                <a style="" class="ls-l ls-hide-tablet ls-hide-phone" href="#3" target="_self" data-ls="durationin:400; position:fixed;">#}
  140. {#                    <ls-layer style='text-align:center; font-weight:700; cursor:pointer; width:30px; height:30px; left:110px; top:426px; line-height:32px; background-size:contain; background-position:50% 50%; font-size:12px; color:#ffffff; z-index:9999; background-image:url("assets/img/hero/dot_bg.png");' class="ls-button-layer">3</ls-layer>#}
  141. {#                </a>#}
  142. {#            </div>#}
  143. {#        </div>#}
  144. {#    </div>#}
  145. {#    <div class="d-block d-md-none">#}
  146. {#        <div id="slider" class="ls-wp-container fitvidsignore hero-2 as-hero-carousel phone" style="width:500px;height:510px;margin:0 auto;margin-bottom: 0px;">#}
  147. {#            <div class="ls-slide" data-ls="duration:5000; transition2d:5; kenburnsscale:1.2;">#}
  148. {#                <img width="500" height="510" src="assets/img/hero/hero_bg_phone_1_1.jpg" class="ls-bg" alt="bg"> <img width="190" height="118" src="assets/img/hero/hero_shape_7.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:453px; left:15px; width:92px; height:57px;" data-ls="offsetyin:200; durationin:1400; rotatein:60deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; rotation:00deg; position:fixed;"> <img width="200" height="173" src="assets/img/hero/hero_shape_8.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:434px; left:181px; width:65px; height:56px;" data-ls="offsetyin:200; durationin:1400; rotatein:-90deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_2_2.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:194px; left:19px; width:56px; height:54px;" data-ls="offsetxin:-300; durationin:1400; rotatein:80deg; durationout:1500; parallax:true; parallaxlevel:10; parallaxdurationmove:800; position:fixed;"> <img width="133" height="168" src="assets/img/hero/hero_shape_4.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:0px; left:0px; width:65px; height:82px;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:5000; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_5.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:300px; width:69px; height:68px;" data-ls="offsetxin:100; offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:1500; parallax:true; parallaxlevel:8; parallaxdurationmove:400; position:fixed;"> <img width="943" height="763" src="assets/img/hero/hero_shape_3.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:-1px; width:494px; height:430px; z-index:5;" data-ls="offsetxin:-600; durationin:1500; delayin:80; bgcolorin:transparent; colorin:transparent; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:281px; left:125px; width:180px; height:16px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;">#}
  149. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:54px; top:110px; left:15px; font-weight:800; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:-150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">WE SERVE THE</h1>#}
  150. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:800; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:54px; top:168px; left:15px; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l hero-title ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:-150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">TASTE, AS YOU</h1>#}
  151. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:800; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:55px; top:226px; left:15px; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l hero-title ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">LIKE <span class="font-style text-theme2">FOODS</span></h1>#}
  152. {#                <a style="" class="ls-l" href="shop.html" target="_self" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#010f1c; hovercolor:#ffffff; position:fixed;">#}
  153. {#                    <ls-layer style="font-size:20px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:198px; left:15px; top:326px; text-transform:uppercase; line-height:20px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#eb0029; padding-bottom:22px; padding-top:22px;" class="ls-button-layer">Order now</ls-layer>#}
  154. {#                </a>#}
  155. {#                <a style="" class="ls-l" href="menu-fast.html" target="_self" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#010f1c; hovercolor:#ffffff; position:fixed;">#}
  156. {#                    <ls-layer style="font-size:19px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:178px; left:234px; top:326px; text-transform:uppercase; line-height:19px; padding-bottom:22px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#ff9d2d;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  157. {#                </a>#}
  158. {#            </div>#}
  159. {#            <div class="ls-slide" data-ls="duration:5000; transition2d:5; kenburnsscale:1.2;">#}
  160. {#                <img width="500" height="510" src="assets/img/hero/hero_bg_phone_1_2.jpg" class="ls-bg" alt="bg"> <img width="190" height="118" src="assets/img/hero/hero_shape_7.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:453px; left:15px; width:92px; height:57px;" data-ls="offsetyin:200; durationin:1400; rotatein:60deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; rotation:00deg; position:fixed;"> <img width="200" height="173" src="assets/img/hero/hero_shape_8.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:434px; left:181px; width:65px; height:56px;" data-ls="offsetyin:200; durationin:1400; rotatein:-90deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_2_2.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:194px; left:19px; width:56px; height:54px;" data-ls="offsetxin:-300; durationin:1400; rotatein:80deg; durationout:1500; parallax:true; parallaxlevel:10; parallaxdurationmove:800; position:fixed;"> <img width="133" height="168" src="assets/img/hero/hero_shape_4.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:0px; left:0px; width:65px; height:82px;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:5000; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_5.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:300px; width:69px; height:68px;" data-ls="offsetxin:100; offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:1500; parallax:true; parallaxlevel:8; parallaxdurationmove:400; position:fixed;"> <img width="943" height="763" src="assets/img/hero/hero_shape_3.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:-1px; width:494px; height:430px; z-index:5;" data-ls="offsetxin:-600; durationin:1500; delayin:80; bgcolorin:transparent; colorin:transparent; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:281px; left:115px; width:180px; height:16px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;">#}
  161. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:54px; top:110px; left:15px; font-weight:800; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:-150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">YOU ALWAYS LIKE</h1>#}
  162. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:800; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:54px; top:168px; left:15px; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l hero-title ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:-150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">TASTE, OF OUR</h1>#}
  163. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:800; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:55px; top:226px; left:15px; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l hero-title ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">FAST <span class="font-style text-theme2">FOODS</span></h1>#}
  164. {#                <a style="" class="ls-l" href="shop.html" target="_self" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#010f1c; hovercolor:#ffffff; position:fixed;">#}
  165. {#                    <ls-layer style="font-size:20px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:198px; left:15px; top:326px; text-transform:uppercase; line-height:20px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#eb0029; padding-bottom:22px; padding-top:22px;" class="ls-button-layer">Order now</ls-layer>#}
  166. {#                </a>#}
  167. {#                <a style="" class="ls-l" href="menu-fast.html" target="_self" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#010f1c; hovercolor:#ffffff; position:fixed;">#}
  168. {#                    <ls-layer style="font-size:19px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:178px; left:234px; top:326px; text-transform:uppercase; line-height:19px; padding-bottom:22px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#ff9d2d;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  169. {#                </a>#}
  170. {#            </div>#}
  171. {#            <div class="ls-slide" data-ls="duration:5000; transition2d:5; kenburnsscale:1.2;">#}
  172. {#                <img width="500" height="510" src="assets/img/hero/hero_bg_phone_1_3.jpg" class="ls-bg" alt="bg"> <img width="190" height="118" src="assets/img/hero/hero_shape_7.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:453px; left:15px; width:92px; height:57px;" data-ls="offsetyin:200; durationin:1400; rotatein:60deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; rotation:00deg; position:fixed;"> <img width="200" height="173" src="assets/img/hero/hero_shape_8.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:434px; left:181px; width:65px; height:56px;" data-ls="offsetyin:200; durationin:1400; rotatein:-90deg; bgcolorin:transparent; colorin:transparent; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_2_2.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:194px; left:19px; width:56px; height:54px;" data-ls="offsetxin:-300; durationin:1400; rotatein:80deg; durationout:1500; parallax:true; parallaxlevel:10; parallaxdurationmove:800; position:fixed;"> <img width="133" height="168" src="assets/img/hero/hero_shape_4.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:0px; left:0px; width:65px; height:82px;" data-ls="offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:5000; parallax:true; parallaxlevel:12; parallaxdurationmove:400; position:fixed;"> <img width="153" height="149" src="assets/img/hero/hero_shape_5.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:300px; width:69px; height:68px;" data-ls="offsetxin:100; offsetyin:-300; durationin:1500; delayin:80; rotatein:40deg; bgcolorin:transparent; colorin:transparent; durationout:1500; parallax:true; parallaxlevel:8; parallaxdurationmove:400; position:fixed;"> <img width="943" height="763" src="assets/img/hero/hero_shape_3.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:19px; left:-1px; width:494px; height:430px; z-index:5;" data-ls="offsetxin:-600; durationin:1500; delayin:80; bgcolorin:transparent; colorin:transparent; position:fixed;"> <img width="291" height="27" src="assets/img/hero/title_line.png" class="ls-l ls-img-layer" alt="hero img" style="font-size:36px; color:#000; text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:400; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; top:281px; left:175px; width:180px; height:16px;" data-ls="durationin:1500; delayin:400; clipin:0 100% 0 0; position:fixed;">#}
  173. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:54px; top:110px; left:15px; font-weight:800; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:-150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">WE PROVIDE BEST</h1>#}
  174. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:800; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:54px; top:168px; left:15px; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l hero-title ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:-150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">BEHAVIOUR AND</h1>#}
  175. {#                <h1 style="text-align:left; font-style:normal; text-decoration:none; text-transform:none; font-weight:800; letter-spacing:0px; background-position:0% 0%; background-repeat:no-repeat; font-family:Rubik; line-height:55px; top:226px; left:15px; font-size:44px; color:#ffffff; white-space:normal;" class="ls-l hero-title ls-text-layer" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; position:fixed;">YUMMY <span class="font-style text-theme2">FOODS</span></h1>#}
  176. {#                <a style="" class="ls-l" href="shop.html" target="_self" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#010f1c; hovercolor:#ffffff; position:fixed;">#}
  177. {#                    <ls-layer style="font-size:20px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:198px; left:15px; top:326px; text-transform:uppercase; line-height:20px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#eb0029; padding-bottom:22px; padding-top:22px;" class="ls-button-layer">Order now</ls-layer>#}
  178. {#                </a>#}
  179. {#                <a style="" class="ls-l" href="menu-fast.html" target="_self" data-ls="offsetyin:-100lh; durationin:1500; easingin:easeOutQuint; bgcolorin:transparent; colorin:transparent; offsetyout:150; durationout:1500; easingout:easeInQuint; bgcolorout:transparent; colorout:transparent; hover:true; hoveropacity:1; hoverbgcolor:#010f1c; hovercolor:#ffffff; position:fixed;">#}
  180. {#                    <ls-layer style="font-size:19px; color:#fff; text-align:center; font-family:Rubik; cursor:pointer; width:178px; left:234px; top:326px; text-transform:uppercase; line-height:19px; padding-bottom:22px; padding-top:22px; font-weight:600; border-radius:999px 999px 999px 999px; background-color:#ff9d2d;" class="ls-button-layer">BROWSE MENU</ls-layer>#}
  181. {#                </a>#}
  182. {#            </div>#}
  183. {#        </div>#}
  184. {#    </div>#}
  186. {#    ZONA TOPICOS#}
  188.     <section class="space">
  189.         <div class="container">
  190.             <div class="row gy-30 justify-content-center">
  191.                 <div class="col-md-4 col-sm-6 feature-card-wrap">
  192.                     <div class="feature-card">
  193.                         <div class="feature-card_icon"><img src="assets/img/icon/feature_1_1.svg" alt="icon"></div>
  194.                         <div>
  195.                             <h3 class="feature-card_title">Descontos Mensais</h3>
  196.                             <p class="feature-card_text">Cada mês temos descontos nos nossos melhores produtos.</p>
  197.                         </div>
  198.                     </div>
  199.                 </div>
  200.                 <div class="col-md-4 col-sm-6 feature-card-wrap">
  201.                     <div class="feature-card">
  202.                         <div class="feature-card_icon"><img src="assets/img/icon/feature_1_2.svg" alt="icon"></div>
  203.                         <div>
  204.                             <h3 class="feature-card_title">Comida fresta e saudável</h3>
  205.                             <p class="feature-card_text">Garantimos comida sempre fresca e saudável.</p>
  206.                         </div>
  207.                     </div>
  208.                 </div>
  209.                 <div class="col-md-4 col-sm-6 feature-card-wrap">
  210.                     <div class="feature-card">
  211.                         <div class="feature-card_icon"><img src="assets/img/icon/feature_1_3.svg" alt="icon"></div>
  212.                         <div>
  213.                             <h3 class="feature-card_title">Serviço rápido a Mesa</h3>
  214.                             <p class="feature-card_text">Os nossos profissionais garantam o melhor atendimento e rápido</p>
  215.                         </div>
  216.                     </div>
  217.                 </div>
  218.             </div>
  219.         </div>
  220.     </section>
  223. {#    ZONA SOBRE NOS#}
  225.     <div class="space-bottom shape-mockup-wrap">
  226.         <div class="container">
  227.             <div class="row">
  228.                 <div class="col-xl-6 col-xxl-7 pe-xxl-5">
  229.                     <div class="text-end"><img src="assets/img/normal/about_1_1.png" alt="About"></div>
  230.                 </div>
  231.                 <div class="col-xl-6 col-xxl-5 col-lg-9 mt-35 mt-xl-0">
  232.                     <div class="title-area mb-30">
  233.                         <span class="sub-title"><img class="icon" src="assets/img/icon/title_icon.svg" alt="icon"> Sobre Nós</span>
  234.                         <h2 class="sec-title">Comida deleciosa direto para <span class="font-style text-theme">Sua Mesa</span></h2>
  235.                     </div>
  236.                     <p class="mt-n2 mb-4">O Roadstop do Fabio, é um sonho pessoal meu, realizado. Uma lanchonete americana aliada ao nosso conceito único dentro do qual valorizamos a qualidade de nossos produtos e realizamos testes diários para melhorar os resultados finais de nossas confecções.</p>
  237.                     <div class="checklist-wrap">
  238.                         <div class="as-video"><img src="assets/img/normal/about_1_2.jpg" alt="video"> <a href="https://www.youtube.com/watch?v=_sI_Ps7JSEk" class="play-btn popup-video"><i class="fas fa-play"></i></a></div>
  239.                         <div class="checklist">
  240.                             <ul>
  241.                                 <li>Comida Deliciosa &amp; Saudável</li>
  242.                                 <li>Zona especifica para familia</li>
  243.                                 <li>Melhores Preços &amp; Ofertas</li>
  244.                                 <li>Feito Por Ingredientes Frescos</li>
  245.                                 <li>Música &amp; muito mais</li>
  246.                             </ul>
  247.                         </div>
  248.                     </div>
  249.                     <div class="btn-wrap">
  250.                         <a href="#" class="as-btn">Saber Mais</a>
  251.                         <div class="profile-box">
  252.                             <div class="avater"><img src="assets/img/normal/about_avater.jpg" alt="avater"></div>
  253.                             <div class="content">
  254.                                 <h6 class="title">Fábio Marques</h6>
  255.                                 <p class="desig">CEO, de Fabio´s Roadstop</p>
  256.                             </div>
  257.                         </div>
  258.                     </div>
  259.                 </div>
  260.             </div>
  261.         </div>
  262.         <div class="shape-mockup about-shape1" style="top: 0%; left: 0px;"><img src="assets/img/shape/bg_shape_1.png" alt="shapes"></div>
  263.     </div>
  265. {#    ZONA PROMOÇÂO#}
  267.     <section class="space position-relative background-image" style="background-image: url(&quot;assets/img/bg/offer_banner_1.jpg&quot;);">
  268.         <div class="container">
  269.             <div class="row gy-30">
  270.                 <div class="col-md-1">
  271.                     <ul class="discount_counter1 counter-list" data-offer-date="01/17/2023">
  272.                         <li>
  273.                             <div class="day count-number">6</div>
  274.                             <span class="count-name">DIAS</span>
  275.                         </li>
  276.                         <li>
  277.                             <div class="hour count-number">10</div>
  278.                             <span class="count-name">HORAS</span>
  279.                         </li>
  280.                         <li>
  281.                             <div class="minute count-number">06</div>
  282.                             <span class="count-name">Min</span>
  283.                         </li>
  284.                         <li>
  285.                             <div class="seconds count-number">51</div>
  286.                             <span class="count-name">Sec</span>
  287.                         </li>
  288.                     </ul>
  289.                 </div>
  290.                 <div class="col-xl-6 col-lg-7 col-md-9 ps-md-5 offset-xl-1 space-bottom">
  291.                     <h2 class="text-white fw-semibold mt-n2">Burger delicioso &amp; Batata <br>Frita no Restaurante</h2>
  292.                     <p class="text-white mb-4">Aproveita o nosso desconto no Burger da Semana no nosso Restaurante</p>
  293.                     <div class="btn-wrap">
  294.                         <a href="#" class="as-btn style6">Reservar Mesa</a>
  295.                         <h5 class="price_style1">€18 - <del>€20</del></h5>
  296.                     </div>
  297.                 </div>
  298.             </div>
  299.             <div class="discount_style2 background-image" style="background-image: url(&quot;assets/img/shape/discount_bg_2.svg&quot;);">
  300.                 <p class="small-text1">APROVEITA</p>
  301.                 <h3 class="percentage">10%</h3>
  302.                 <p class="small-text2">DESCONTO</p>
  303.             </div>
  304.         </div>
  305.     </section>
  308. {#    ZONA BANNER APP#}
  309.     <div class="space-top shape-mockup-wrap mb-5">
  310.         <div class="container">
  311.             <div class="download-area bg-smoke2 background-image" style="background-image: url(&quot;assets/img/bg/download_bg_1.png&quot;);">
  312.                 <div class="row">
  313.                     <div class="col-xl-6 col-xxl-5 col-lg-7 col-md-9">
  314.                         <div class="title-area mb-30">
  315.                             <span class="sub-title"><img class="icon" src="assets/img/icon/title_icon.svg" alt="icon"> Download App</span>
  316.                             <h2 class="sec-title">Nossa App para pedidos<span class="font-style text-theme">Online</span></h2>
  317.                         </div>
  318.                         <p class="mt-n2 mb-4">Baixa a nossa app Fabios Roadstop para ter a melhor experiência e rapidéz</p>
  319.                         <div class="download-btn-wrap">
  320.                             <a target="_blank" href="https://play.google.com/" class="download-btn">
  321.                                 <i class="fa-brands fa-google-play"></i>
  322.                                 <div class="text-group">
  323.                                     <span class="small-text">Download From</span>
  324.                                     <h6 class="big-text">Google Play</h6>
  325.                                 </div>
  326.                             </a>
  327.                             <a target="_blank" href="https://www.apple.com/store" class="download-btn bg-theme2">
  328.                                 <i class="fa-brands fa-apple"></i>
  329.                                 <div class="text-group">
  330.                                     <span class="small-text">Download From</span>
  331.                                     <h6 class="big-text">App Store</h6>
  332.                                 </div>
  333.                             </a>
  334.                         </div>
  335.                     </div>
  336.                 </div>
  337.             </div>
  338.         </div>
  339.         <div class="shape-mockup leaf jump" style="top: 10%; right: 0px;"><img src="assets/img/shape/leaf_1.png" alt="shape"></div>
  340.         <div class="shape-mockup leaf jump-reverse" style="top: 30%; left: 2%;"><img src="assets/img/shape/chips_1.png" alt="shape"></div>
  341.     </div>
  343.     <div class="z-index-common shape-mockup-wrap" data-pos-for="#bookingSec1" data-sec-pos="bottom-half" style="margin-bottom: -250px;">
  344.         <div class="container">
  345.             <div class="video-box1">
  346.                 <img src="assets/img/normal/video_1.jpg" alt="video">
  347.                 <div class="video-content">
  348.                     <h2 class="h4 text-white font-style">Nosso Video</h2>
  349.                     <a href="https://www.youtube.com/watch?v=_sI_Ps7JSEk" class="play-btn popup-video"><i class="fas fa-play"></i></a>
  350.                 </div>
  351.             </div>
  352.         </div>
  353.         <div class="shape-mockup leaf jump-reverse d-none d-md-block" style="top: 10%; left: 2%;"><img src="assets/img/shape/chips_2.png" alt="shape"></div>
  354.     </div>
  355.     <section class="space background-image" id="bookingSec1" data-overlay="title" data-opacity="8" style="background-image: url({{ asset('assets/img/bg/bgbook.png') }}); padding-top: 370px;">
  356.         <div class="container">
  357.             <div class="title-area text-center">
  358.                 <span class="sub-title"><img class="icon" src="assets/img/icon/title_icon.svg" alt="icon"> Reservas</span>
  359.                 <h2 class="sec-title text-white">Reserva a Mesa <span class="font-style text-theme">Agora!</span></h2>
  360.                 <p class="sec-text text-white ms-auto me-auto">Preenche o Formulário para reservas mesa no nosso Restaurante.</p>
  361.             </div>
  362.             <form action="#" method="POST" class="booking-form">
  363.                 <div class="row">
  364.                     <div class="form-group col-lg-4"><input type="text" class="form-control date-pick" id="date-pick" name="date" placeholder="Escolha a Data"> <i class="fal fa-calendar-days"></i></div>
  365.                     <div class="form-group col-lg-4"><input type="text" class="form-control time-pick" id="time-pick" name="time" placeholder="Escolha a Hora"> <i class="fal fa-clock"></i></div>
  366.                     <div class="form-group col-lg-4"><input type="number" class="form-control" name="guest" id="guest" placeholder="Total de Pessoas"> <i class="fal fa-user-group"></i></div>
  367.                     <div class="form-group col-12"><textarea name="message" id="message" cols="30" rows="3" class="form-control" placeholder="Observação"></textarea> <i class="fal fa-comment"></i></div>
  368.                     <div class="form-btn col-12 text-center"><button class="as-btn style3">Reservar</button></div>
  369.                 </div>
  370.                 <p class="form-messages mb-0 mt-3"></p>
  371.             </form>
  372.         </div>
  373.     </section>
  374. {% endblock %}
  376. {% block javascripts %}
  377.     {{ parent() }}
  378.     <script>
  380.         $('.image-slider').css({'-webkit-transition':'all'});
  382.         $('.custom-slide').mousemove(function(event) {
  383.             var moveX = (($(window).width() / 2) - event.pageX) * 0.1;
  384.             var moveY = (($(window).height() / 2) - event.pageY) * 0.1;
  386.             $('.image-slider').css('margin-left', moveX + 'px');
  387.             $('.image-slider').css('margin-top', moveY + 'px');
  388.             $('.image-slider').css('margin-right', moveX + 'px');
  389.             $('.image-slider').css('margin-bottom', moveY + 'px');
  391.         });
  394.         // $(window).mousemove(function(event) {
  395.         //
  396.         //     var xp = "20";
  397.         //     var xy = "30";
  398.         //
  399.         //     $(".image-slider").css({"left" : event.xp, "top" : event.xy});
  400.         // });
  401.     </script>
  402. {% endblock %}