{% extends 'base.html.twig' %}

{% block title %}{{controller_name}}{% endblock %}


{% block body %}
<style>
    .tp-bgimg{
        background-repeat: no-repeat;background-image: url("/images/slides/expositor_peixes_clean_safe.jpg");width: 100%;background-size: 100% 150%;height: 100%;opacity: 1;visibility: inherit;z-index: 20;background-position: 0px -65px;
    }
    
</style>

    <div class="ppb_wrapper  ">
        <div class="one fullwidth ">
            <div id="rev_slider_1_1_wrapper" class="rev_slider_wrapper fullwidthbanner-container" data-source="gallery" style="margin:0px auto;background:#262626;padding:0px;margin-top:0px;margin-bottom:0px;">
                <!-- START REVOLUTION SLIDER 5.4.5.1 fullwidth mode -->
                <div id="rev_slider_1_1" class="rev_slider fullwidthabanner tp-overflow-hidden" style="display:none;" data-version="5.4.5.1">
                    <ul>
                        <!-- SLIDE  -->
                        <li data-index="rs-1" data-transition="zoomin" data-slotamount="7" data-hideafterloop="0" data-hideslideonmobile="off" data-easein="default" data-easeout="default" data-masterspeed="300" data-thumb="upload/Mark_Lobo_Photography-Melbourne-Jam_Jar1-100x50.jpg" data-rotate="0" data-saveperformance="on" data-title="Slide" data-param1="" data-param2="" data-param3="" data-param4="" data-param5="" data-param6="" data-param7="" data-param8="" data-param9="" data-param10="" data-description="">
                            <!-- MAIN IMAGE -->
                            <img src="{{ asset('images/slides/expositor_peixes_clean_safe_2.jpg') }}" alt="" title="Mark_Lobo_Photography-Melbourne-Jam_Jar1" width="1110" height="740" data-bgposition="center top" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina>
                            <!-- LAYERS -->

                            <!-- LAYER NR. 1 -->

                            <!-- LAYER NR. 3 -->
{#                            <div class="tp-caption sub-title-center   tp-resizeme" id="slide-1-layer-3" data-x="center" data-hoffset="0" data-y="center" data-voffset="50" data-width="auto" data-height="auto" data-type="text" data-responsive_offset="on" data-frames='[{"from":"opacity:0;","speed":300,"to":"","delay":500,"ease":"Power3.easeInOut"},{"delay":"wait","speed":300,"to":"auto:auto;","ease":"nothing"}]' data-textAlign="['','','','']" style="z-index: 7; white-space: nowrap; color: #1a3853;text-transform:left;">Making The Delicious Premium Food Since 1990#}
{#                                <br/> Book Online Or Call (1800)456-6743 </div>#}
                        </li>
                    </ul>
                    <div class="tp-bannertimer tp-bottom" style="visibility: hidden !important;"></div>
                </div>

            </div>
            <!-- END REVOLUTION SLIDER -->
        </div>
        <div class="one withsmallpadding ppb_text" style="text-align:center;padding-bottom:0 !important;padding:50px 0 50px 0;">
            <div class="standard_wrapper">
                <div class="page_content_wrapper">
                    <div class="inner">
                        <div style="margin:auto;width:60%">
                            </p>

                            <div class="tp-caption title-first-word   tp-resizeme" id="slide-1-layer-1" data-x="center" data-hoffset="0" data-y="center" data-voffset="-80" data-width="auto" data-height="auto" data-type="text" data-responsive_offset="on" data-frames='[{"from":"opacity:0;","speed":300,"to":"","delay":450,"ease":"Power3.easeInOut"},{"delay":"wait","speed":300,"to":"auto:auto;","ease":"nothing"}]' data-textAlign="['','','','']" style="z-index: 5; white-space: nowrap;text-transform:left; text-shadow: 2px 2px #8e8e8e;">{% trans %}Welcome to{% endtrans %} {% trans %}Our{% endtrans %}</div>

                            <!-- LAYER NR. 2 -->
                            <div class="tp-caption title   tp-resizeme" id="slide-1-layer-2" data-x="center" data-hoffset="0" data-y="center" data-voffset="-20" data-width="auto" data-height="auto" data-type="text" data-responsive_offset="on" data-frames='[{"from":"opacity:0;","speed":300,"to":"","delay":500,"ease":"Power3.easeInOut"},{"delay":"wait","speed":300,"to":"auto:auto;","ease":"nothing"}]' data-textAlign="['','','','']" style="z-index: 6; white-space: nowrap; color: #1a3853;text-transform:left; text-shadow: 2px 2px #8e8e8e; font-size: 50px;"> <strong>{% trans %}Restaurant{% endtrans %}</strong> </div>

                                <HR><BR>
                            <div style="font-size:30px;text-transform:uppercase;letter-spacing:-1px;font-weight:300;">{% trans %}HAVE YOUR MEAL AT THE SAFEST RESTAURANT IN THE REGION{% endtrans %}</div>
                            <div style="font-size:30px;text-transform:uppercase;letter-spacing:-1px;font-weight:300;">{% trans %}WE COMPLY WITH ALL SANITARY REQUIREMENTS - COVID-19{% endtrans %}</div>
                            <div class="post_detail">{% trans %}Our Founder{% endtrans %}</div>
                            <p><span style="font-family:Kristi;font-size:40px;font-weight:600;">Joaquim Nascimento</span></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="one withsmallpadding ppb_text" style="text-align:center;padding-bottom:0 !important;padding:50px 0 50px 0;">
            <div class="standard_wrapper">
                <div class="page_content_wrapper">
                    <div class="inner">
                        <div style="margin:auto;width:60%">
                            </p>
                            <div style="font-size:30px;text-transform:uppercase;letter-spacing:-1px;font-weight:300;">{% trans %}WHERE THE TRADITION, THE SEA, THE BARROCAL AND THE SERRA CROSS IN A KITCHEN WITH SOUL{% endtrans %}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="one ppb_card_two_cols_with_image" style="padding: 50px 0 70px 0 !important;position:relative;padding:40px 0 40px 0;">
            <div class="standard_wrapper">
                <div class="page_content_wrapper">
                    <div class="inner">
                        <div class="one_half parallax_scroll_image" style="width:65%;">
                            <div class="image_classic_frame expand">
                                <div class="image_wrapper">
                                    <a href="{{first_article.0.filename}}" class="img_frame"><img src="{{first_article.0.filename}}" class="portfolio_img" alt="" /></a>
                                </div>
                            </div>
                        </div>
                        <div class="one_half last parallax_scroll" style="width:40%;position:absolute;right:90px;padding:40px;background:#ffffff;" data-stellar-ratio="1.3">
                            <h2 class="ppb_title"><span class="ppb_title_first" >{{first_article.0.title}}</span>{{first_article.0.description}}</h2>
                            {{first_article.0.text|raw}}
                        </div>
                        <br class="clear" />
                    </div>
                </div>
            </div>
        </div>
        <div class="divider one">&nbsp;</div>
        <div class="parallax title" data-image="/images/slides/experiencea_deleciosa.jpg" data-width="1024" data-height="682" data-content-height="60">
            <div class="parallax_title">
                <h2 class="ppb_title"><span class="ppb_title_first" >{% trans %}Delightful{% endtrans %}</span>{% trans %}Experience{% endtrans %}</h2></div>
        </div>


        <div class="one withsmallpadding ppb_text" style="text-align:center;padding-bottom:0 !important;padding:50px 0 50px 0;">
            <div class="standard_wrapper">
                <div class="page_content_wrapper">
                    <div class="inner">
                        <div style="margin:auto;width:60%">
                            </p>
                            <div style="font-size:30px;text-transform:uppercase;letter-spacing:-1px;font-weight:300;">{% trans %}THE SEA IS THE SEASON OF LIFE{% endtrans %}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>





        <div class="one ppb_card_two_cols_with_image" style="padding: 50px 0 70px 0 !important;position:relative;padding:40px 0 40px 0;">
            <div class="standard_wrapper">
                <div class="page_content_wrapper">
                    <div class="inner">
                        <div class="one_half parallax_scroll_image" style="width:65%;">
                            <div class="image_classic_frame expand">
                                <div class="image_wrapper">
                                    <a href="{{second_article.0.filename}}" class="img_frame"><img src="{{second_article.0.filename}}" class="portfolio_img" alt="" /></a>
                                </div>
                            </div>
                        </div>
                        <div class="one_half last parallax_scroll" style="width:40%;position:absolute;right:90px;padding:40px;background:#ffffff;" data-stellar-ratio="1.3">
                            <h2 class="ppb_title"><span class="ppb_title_first" >{{second_article.0.title}}</span>{{second_article.0.description}}</h2>
                            {{second_article.0.text | raw}}
                        </div>
                        <br class="clear" />
                    </div>
                </div>
            </div>
        </div>




        <div class="divider one">&nbsp;</div>
    </div>
{% endblock %}