@extends('layouts.main')
@section('content')
<!--================Breadcrumb Area =================-->
<section class="breadcrumb_area">
    <div class="overlay bg-parallax" data-stellar-ratio="0.8" data-stellar-vertical-offset="0" data-background=""></div>
    <div class="container">
        <div class="page-cover text-center">
            <h2 class="page-cover-tittle">{{__('destinations.title')}}</h2>
            <ol class="breadcrumb">
                <li><a href="">{{__('destinations.angola.country')}}</a></li>

            </ol>
        </div>
    </div>
</section>
<!--================Breadcrumb Area =================-->

<!--================ About History Area  =================-->
<section class="about_history_area section_gap" style="background: url('/image/destinations/angola/destinations-angola-background.jpg') no-repeat fixed; background-size: cover; padding-top: 50px; color: black;">
    <div class="container white_background">
        <div class="row mb-4">
            <div class="col-md-6 d_flex align-items-center">
                <div class="destination-header" style="text-align: justify;">
                    <h2 class="title title_color">{{__('destinations.angola.country')}}</h2>
                    <h4>{{__('destinations.angola.gen_info_title')}}</h4>
                    <p>
                        {{__('destinations.angola.gen_info_text_1')}}
                        <br>
                        <br>
                        {{__('destinations.angola.gen_info_text_2')}}
                    </p>
                    <!-- <a href="#meet_our_team" class="button_hover theme_btn_two">Meet Our Team</a> -->
                </div>                
            </div>
            <div class="col-md-6">
                <img class="img-fluid" src="/image/destinations/angola/1-map-of-angola.png" alt="img">
                <br><br>
                <img class="img-fluid" src="/image/destinations/angola/2.jpg" alt="img">
            </div>
        </div>

        <div class="row mb-4">
            <div class="col-md-6 d_flex align-items-center">
                <div class="" style="text-align: justify;">
                    <!-- <h2 class="title title_color">Safaris in Namibia</h2> -->
                    <h2>{{__('destinations.angola.south_coast_title')}}</h2>
                    <p>
                        {{__('destinations.angola.south_coast_text_1')}}
                        <br>
                        {{__('destinations.angola.south_coast_text_2')}} 
                        {{__('destinations.angola.south_coast_text_3')}}
                        <br><br>
                        {{__('destinations.angola.south_coast_text_4')}}
                    </p>
                </div>                
            </div>
            <div class="col-md-6">
                <img class="img-fluid" src="/image/destinations/angola/3.png" alt="img">
            </div>
        </div>

        <div class="row mb-4">
            <div class="col-md-6 d_flex align-items-center">
                <div class="" style="text-align: justify;">
                    <!-- <h2 class="title title_color">Safaris in Namibia</h2> -->
                    <h2>{{__('destinations.angola.cristo_rei_title')}}</h2>
                    <p>
                        {{__('destinations.angola.cristo_rei_text')}}
                        {{__('destinations.angola.cristo_rei_text_2')}}
                    </p>
                </div>                
            </div>
            <div class="col-md-6">
                <img class="img-fluid" src="/image/destinations/angola/4.jpg" alt="img">
            </div>
        </div>
        <br>
        <div class="row mb-4">
            <div class="col-md-6 d_flex align-items-center">
                <div class="" style="text-align: justify;">
                    <!-- <h2 class="title title_color">Safaris in Namibia</h2> -->
                    <h2>{{__('destinations.angola.kalandula_title')}}</h2>
                    <p>
                        {{__('destinations.angola.kalandula_text')}}
                        {{__('destinations.angola.kalandula_text_2')}}
                    </p>
                </div>                
            </div>
            <div class="col-md-6">
                <img class="img-fluid" src="/image/destinations/angola/5.png" alt="img">
            </div>
        </div>

    </div>
</section>
<!--================ About History Area  =================-->
@endsection