@extends('layout.app')
@section('title')
<title>ET-Visas</title>
    <meta name="description" content="ET Education and Visa Services, presented by Extratech, is an adept provider of excellent education consultation, information, and visa guidance solution to students seeking schooling abroad.">
    <meta name="robots" content="index, follow" />
    <meta property="og:url" content="" />
    <meta property="og:image" content="{{url('frontend/images/banner.png')}}"/>
    <meta property="og:title" content="ET-Visas"/>
    <meta property="og:description" content="ET Education and Visa Services, presented by Extratech, is an adept provider of excellent education consultation, information, and visa guidance solution to students seeking schooling abroad."/>
@endsection
@section('content')
    <section class="about-icons-section">
        <div class="high-visa">
            <img src="{{url('frontend/icons/speed-meter-icon.png')}}" class="img-fluid" alt="">
            <h3>High Visa <br> Success Rate</h3>
        </div>
        <div class="certified-counselor">
            <img src="{{url('frontend/icons/visa-approved.png')}}" class="img-fluid" alt="">
            <h3>Certified <br> Counselor</h3>
        </div>
        <div class="marn-agent">
            <img src="{{url('frontend/icons/agent.svg')}}" class="img-fluid" alt="">
            <h3>MARN <br> Agent</h3>
        </div>
        <div class="partners">
            <img src="{{url('frontend/icons/institution-icon.svg')}}" class="img-fluid" alt="">
            <h3>500+ Partner <br> Institutions</h3>
        </div>
        </div>
    </section>
    <section class="services-section">
        <div class="row">
            <div class="col-md-6">
                <div class="services-content">
                    <h1>Explore and Choose the Service that Fits You the Best.</h1>
                    <p>We think big and have hands in all leading technology platforms to provide you wide array of services. We think big and have hands in all leading technology platforms to provide you wide array of services.</p>
                    <a href="">Explore All Services</a>
                </div>
            </div>
            <div class="col-md-6">
                <div class="services-slick gx-4">
                    <div class="services-slider">
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/abroad-icon.png')}}" alt="">
                            </div>
                            <h2>Abroad Study</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/migration-visa.png')}}" alt="">
                            </div>
                            <h2>Migration & Visa</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                    </div>
                    <div class="services-slider">
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/ribbon.png')}}" alt="">
                            </div>
                            <h2>Career Counselling</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/insurance-icon.png')}}" alt="">
                            </div>
                            <h2>Insurance</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                    </div><div class="services-slider">
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/abroad-icon.png')}}" alt="">
                            </div>
                            <h2>Abroad Study</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/migration-visa.png')}}" alt="">
                            </div>
                            <h2>Migration & Visa</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                    </div>
                    <div class="services-slider">
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/ribbon.png')}}" alt="">
                            </div>
                            <h2>Career Counselling</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                        <div class="service-card">
                            <div class="service-icon">
                                <img src="{{url('frontend/icons/insurance-icon.png')}}" alt="">
                            </div>
                            <h2>Insurance</h2>
                            <p>Explore and Choose the Course that Meets your Dream</p>
                            <a href="">Learn More</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection
@section('script')
    <script>
        var $serviceSlider = $('.services-slick');
        $serviceSlider.slick({
            slidesToShow: 2,
            slidesToScroll: 1,
            autoplay: true,
            autoplaySpeed: 4000,
            prevArrow: false,
            nextArrow: false,
            dots: true,
            centerMode: false,
            responsive: [
                {
                    breakpoint: 1024,
                    settings: {
                        slidesToShow: 2,
                        slidesToScroll: 1,
                        infinite: true,
                        dots: false
                    }
                },
                {
                    breakpoint: 600,
                    settings: {
                        slidesToShow: 2,
                        slidesToScroll: 1
                    }
                },
                {
                    breakpoint: 480,
                    settings: {
                        slidesToShow: 1,
                        slidesToScroll: 1
                    }
                }
            ]
        });
    </script>
@endsection