@extends('client.raffles.layouts.app')
@section('content')
    <section class="">
        <div class="services-banner">
            <img src="{{ asset('raffles/assets/images/backgrounds_general/social-banner.png') }}" width="1425" height="356"
                alt="Social Platform">

        </div>





        <section class="lqd-section about social-platform pt- pb-40">
            <div class="container">
                <!-- <div class="section-break mt-0"></div> -->
                <h2 class="text-36 md:text-24 text-brand text-center pt-40">Lets Connect</h2>
                <div class="section-break "></div>
                <div class="social-facebook pb-30">
                    <h3 class="text-sec2 text-46 md:text-24 pb-30 text-center">Facebook </h3>
                    <div class="row">

                        <div class="col col-12  p-0">
                            <div class="w-full flex flex-wrap justify-center module-icon-box">
                                <a href="{{ setting('facebook') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-blue-100 text-30">
                                                        <i class="fa-brands fa-facebook text-sec"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles<br />Educare
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <a href="{{ setting('facebook') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-blue-100 text-30">
                                                        <i class="fa-brands fa-facebook text-sec"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles Study in<br />UK
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <a href="{{ setting('facebook') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-blue-100 text-30">
                                                        <i class="fa-brands fa-facebook text-sec"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles Study in<br />USA
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <a href="{{ setting('facebook') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-blue-100 text-30">
                                                        <i class="fa-brands fa-facebook text-sec"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles Learning<br />Center
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>

                            </div>
                        </div>

                    </div>

                </div>



                <div class="social-instagram pb-30">
                    <h3 class="text-sec2 text-46 md:text-24 pb-30 text-center">Instagram </h3>
                    <div class="row">

                        <div class="col col-12  p-0">
                            <div class="w-full flex flex-wrap justify-center module-icon-box">

                                <a href="{{ setting('instagram') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all pr-60 mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-red-100 text-50">
                                                        <i class="fa-brands fa-instagram text-brand"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles<br />Educare
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <a href="{{ setting('instagram') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all pr-60 mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-red-100 text-50">
                                                        <i class="fa-brands fa-instagram text-brand"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles Educare<br /> USA
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <a href="{{ setting('instagram') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all pr-60 mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-red-100 text-50">
                                                        <i class="fa-brands fa-instagram text-brand"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles Learning<br />Center
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                            </div>
                        </div>

                    </div>

                </div>

                <div class="social-tiktok pb-30">
                    <h3 class="text-sec2 text-46 md:text-24 pb-30 text-center">Tiktok & Google </h3>
                    <div class="row">

                        <div class="col col-12  p-0">
                            <div class="w-full flex flex-wrap justify-center module-icon-box">


                                <a href="{{ setting('tiktok') }}">
                                    <div class="w-25percent sm:w-50percent ">
                                        <div
                                            class="flex justify-center items-center text-center lqd-iconbox-scale transition-all pl-60 mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col justify-center iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-gray-100 text-30">
                                                        <i class="fa-brands fa-tiktok text-black"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles<br />Educare
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <a href="{{ setting('tiktok') }}">
                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all pl-60 mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-gray-100 text-30">
                                                        <i class="fa-brands fa-tiktok text-black"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles Study<br />Abroad
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <a href="{{ setting('google') }}">

                                    <div class="w-25percent sm:w-50percent">
                                        <div class="lqd-iconbox-scale transition-all pr-60 mb-30 sm:mb-0 hover:scale-1/1">
                                            <div
                                                class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                <div class="iconbox-icon-wrap">
                                                    <div
                                                        class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-green-100 text-30">
                                                        <i class="fa-brands fa-google"></i>
                                                    </div>
                                                </div>
                                                <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                    Raffles<br />Educare
                                                </h3>
                                            </div>
                                        </div>
                                    </div>
                                </a>


                            </div>
                        </div>

                    </div>

                </div>






                <div class="mad:block flex flex-wrap justify-center gap-90 items-center">


                    <div class="social-pinterest pb-30">
                        <h3 class="text-sec2 text-46 md:text-24 pb-30 text-center">Pinterest </h3>
                        <div class="row">

                            <div class="col col-12  p-0">
                                <div class="w-full flex flex-wrap justify-center module-icon-box">

                                    <a href="{{ setting('pinterest') }}">
                                        <div class="w-25percent sm:w-50percent">
                                            <div
                                                class="lqd-iconbox-scale transition-all pr-60 mb-30 sm:mb-0 hover:scale-1/1">
                                                <div
                                                    class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                    <div class="iconbox-icon-wrap">
                                                        <div
                                                            class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-red-100 text-50">
                                                            <i class="fa-brands fa-pinterest text-brand"></i>
                                                        </div>
                                                    </div>
                                                    <h3
                                                        class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                        Raffles<br />Educare
                                                    </h3>
                                                </div>
                                            </div>
                                        </div>
                                    </a>

                                </div>
                            </div>

                        </div>

                    </div>


                    <div class="social-linkedin pb-30">
                        <h3 class="text-sec2 text-46 md:text-24 pb-30 text-center">Linkedin </h3>
                        <div class="row">

                            <div class="col col-12  p-0">
                                <div class="w-full flex flex-wrap justify-center module-icon-box">
                                    <a href="{{ setting('linkedin') }}">
                                        <div class="w-25percent sm:w-50percent">
                                            <div class="lqd-iconbox-scale transition-all mb-30 sm:mb-0 hover:scale-1/1">
                                                <div
                                                    class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                    <div class="iconbox-icon-wrap">
                                                        <div
                                                            class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-blue-100 text-30">
                                                            <i class="fa-brands fa-linkedin text-sec"></i>
                                                        </div>
                                                    </div>
                                                    <h3
                                                        class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                        Raffles<br />Educare
                                                    </h3>
                                                </div>
                                            </div>
                                        </div>

                                    </a>


                                </div>
                            </div>

                        </div>

                    </div>


                    <div class="social-youtube pb-30">
                        <h3 class="text-sec2 text-46 md:text-24 pb-30 text-center">Youtube </h3>
                        <div class="row">

                            <div class="col col-12  p-0">
                                <div class="w-full flex flex-wrap justify-center module-icon-box">

                                    <a href="{{ setting('youtube') }}">
                                        <div class="w-25percent sm:w-50percent">
                                            <div
                                                class="lqd-iconbox-scale transition-all pr-60 mb-30 sm:mb-0 hover:scale-1/1">
                                                <div
                                                    class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                    <div class="iconbox-icon-wrap">
                                                        <div
                                                            class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-red-100 text-50">
                                                            <i class="fa-brands fa-youtube text-brand"></i>
                                                        </div>
                                                    </div>
                                                    <h3
                                                        class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                        Raffles<br />Educare
                                                    </h3>
                                                </div>
                                            </div>
                                        </div>
                                    </a>

                                </div>
                            </div>

                        </div>

                    </div>

                    <!-- <div class="social-google pb-30">
                            <h3 class="text-sec2 text-46 md:text-24 pb-30 text-center">Google Business </h3>
                            <div class="row">

                                <div class="col col-12  p-0">
                                    <div class="w-full flex flex-wrap justify-center module-icon-box">


                                        <div class="w-25percent sm:w-50percent">
                                            <div class="lqd-iconbox-scale transition-all pr-60 mb-30 sm:mb-0 hover:scale-1/1">
                                                <div
                                                    class="iconbox flex items-center flex-grow-1 relative flex-col iconbox-default iconbox-circle">
                                                    <div class="iconbox-icon-wrap">
                                                        <div
                                                            class="iconbox-icon-container inline-flex relative z-1 rounded-full mb-20 w-75 h-75 bg-green-100 text-30">
                                                            <i class="fa-brands fa-google"></i>
                                                        </div>
                                                    </div>
                                                    <h3 class="lqd-iconbox-heading text-16 font-bold text-center leading-1em">
                                                        Raffles<br />Educare
                                                    </h3>
                                                </div>
                                            </div>
                                        </div>



                                    </div>
                                </div>

                            </div>

                        </div> -->
                </div>

            </div>


        </section>
    @endsection