@extends('layouts.front')

@section('meta_info')
    <meta name="keywords" content="Provat Feri, Australian Bangla News, Migration, Australia, Community" />
    <meta name="description" content="Provat Feri, Online News Paper Australia, Bangla News Paper Australia, Best Bangla news Paper Australia, Community, Australia, Politics, Tech, International, education">
    <meta name="robots" content="ALL"/>
    <meta name="robots" content="index, follow"/>
    <meta name="googlebot" content="index, follow"/>
    <meta name="distribution" content="Global"/>
    <meta name="rating" content="General"/>
    <meta name="classification" content="Newspaper, Artical, Australian News Portal"/>
    <meta property="og:title" content="Provat Feri | Popular Bangla Online News Paper in Australia" />
    <meta property="og:description" content="Provat Feri, Online News Paper Australia, Bangla News Paper Australia, Best Bangla news Paper Australia, politics, tech, international, education">
    <meta property="og:url" content="https://provatferi.com.au/" />
    <meta property="og:image" content="https://provatferi.com.au/img/logo-fb.png"/>
    <meta property="og:image:alt" content="প্রভাত ফেরী"/>
    <meta property="og:site_name" content="প্রভাত ফেরী" />
    <meta property="fb:app_id" content="" />
    <meta property="fb:pages" content=""/>
    <meta property="og:type" content="website" />
@endsection


@section('extra_css')
    <link rel="stylesheet"
          href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.green.css"/>
    <style>

        /*.section-row img {
            background: url('https://pf.wamhost.com/img/logo-fb.png');
            display: block;
        }*/
        .owl-nav {
            position: absolute;
            top: -73px;
            right: 0;
        }

        .owl-prev {
            float: left;
            margin-left: -15px;
        }

        .owl-next {
            float: right;
            margin-right: -15px;
        }
    </style>
@endsection

@section('extra_js')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>

    <script>
        $(document).ready(function () {

            $(".video-carousel").owlCarousel({
                loop: true,
                margin: 10,
                dots: false,
                nav: true,
                responsive: {
                    0: {
                        items: 1
                    },
                    600: {
                        items: 3
                    },
                    1000: {
                        items: 5
                    }
                }
            });


            $(".photo-carousel").owlCarousel({
                loop: true,
                center: true,
                margin: 30,
                autoplay: true,
                dots: false,
                nav: true,
                autoplayTimeout: 8500,
                smartSpeed: 450,
                navText: ['<i class="glyphicon glyphicon-arrow-left"></i>', '<i class="glyphicon glyphicon-arrow-right"></i>'],
                responsive: {
                    0: {
                        items: 1
                    },
                    768: {
                        items: 1
                    },
                    1170: {
                        items: 1
                    }
                }
            });


        });
    </script>

    <script>
        function openPage(pageName, elmnt, color) {
            var i, tabcontent, tablinks;
            tabcontent = document.getElementsByClassName("tabcontent");
            for (i = 0; i < tabcontent.length; i++) {
                tabcontent[i].style.display = "none";
            }
            tablinks = document.getElementsByClassName("tablink");
            for (i = 0; i < tablinks.length; i++) {
                tablinks[i].style.backgroundColor = "";
            }
            document.getElementById(pageName).style.display = "block";
            elmnt.style.backgroundColor = color;
        }

        // Get the element with id="defaultOpen" and click on it
        document.getElementById("defaultOpen").click();
    </script>
@endsection

@section('main_content')

    <div class="top-banner-section">
        <div class="container">
            <div class="row">
                <div class="col-md-4">