@extends('layouts.app3')

@section('title', 'student_welfare')

@section('content')
<style>.img-box5 .img2 {
    border-radius: 10px;
    z-index: 1;
    right: 0;
    bottom: -165px;
}</style>


    <!--==============================
    Breadcumb
============================== -->
    <div class="breadcumb-wrapper " data-bg-src="document/Research/crc/bannerw.jpg" data-overlay="title" data-opacity="8">
        <div class="breadcumb-shape" data-bg-src="assets/img/bg/breadcumb_shape_1_1.png">
        </div>
        <div class="shape-mockup breadcumb-shape2 jump d-lg-block d-none" data-right="30px" data-bottom="30px">
            <img src="assets/img/bg/breadcumb_shape_1_2.png" alt="shape">
        </div>
        <div class="shape-mockup breadcumb-shape3 jump-reverse d-lg-block d-none" data-left="50px" data-bottom="80px">
            <img src="assets/img/bg/breadcumb_shape_1_3.png" alt="shape">
        </div>
        <div class="container">
            <div class="breadcumb-content text-center">
                <h1 class="breadcumb-title">Student Welfare and Affairs</h1>
               
            </div>
        </div>
    </div>
   
    <!--==============================
About Area   
==============================-->
    <div class="overflow-hidden overflow-hidden bg-smoke space" id="about-sec" data-bg-src="assets/img/bg/about-5-bg.png">
        <div class="container">   
            <div class="row">
                <div class="col-xl-6 mb-50 mb-xl-0">
                   <div class="img-box5">
                        <div class="img1"></div>
                        <div class="img2"> 
                             <img class="tilt-active" src="document/Research/student_welfare/student_welfare_afairs.avif" alt="About"> 
                        </div>
                    </div>  
                </div>
                <div class="col-xl-6">
                    <div class="text-center mb-5">
            <h6 class="display-4 fw-bold" style="color: #223584;">About </h6>
            <div class="mx-auto" style="width: 100px; height: 4px; background: linear-gradient(to right, orange, #223584);"></div>
        </div>
                    <p class="mt-n2 mb-25">Student Welfare and Affairs Department of university is dedicated for supporting students’ overall development beyond academics. It is the bridge between students and the university administration, ensuring the productive, balanced, and fulfilling campus life. It is playing a major role in ensuring the safe, inclusive and supportive campus experience. </p>
                </div>
            </div>
        </div>
    </div>
   
<!--==============================
Objective  
==============================-->
    <div class="overflow-hidden overflow-hidden bg-smoke space" id="about-sec" data-bg-src="">
        <div class="container">   
            <div class="row">
               
                <div class="col-xl-6">
                    
                     <div class="text-center mb-5">
            <h6 class="display-4 fw-bold" style="color: #223584;">Objectives</h6>
            <div class="mx-auto" style="width: 100px; height: 4px; background: linear-gradient(to right, orange, #223584);"></div>
        </div>
                  <ul>
                                     <li>Promote students’ well-being and mental health.</li>
                                    <li>Support personal and social development.</li>
                                    <li>Encourage participation in co-curricular and extracurricular activities.</li>
                                    <li>Provide assistance for academic and non-academic challenges.</li>
                                    
                                </ul>
                </div>
                
                 <div class="col-xl-6 mb-50 mb-xl-0">
                    <div class="img-box5">
                       
                        
                        <div class="img2"> 
                             <img class="tilt-active" src="document/Research/student_welfare/welfare_3.jpg" alt="About"> 
                        </div>
                        
                    </div>  
                </div>
            </div>
        </div>
    </div>
   
   
   <!--==============================
Functions
==============================-->
    <div class="overflow-hidden bg-smoke space" id="about-sec" data-bg-src="assets/img/bg/about-5-bg.png">
        <div class="container">   
            <div class="row">
               
                <div class="col-xl-6">
                    <div class="text-center mb-5">
                        <h6 class="display-4 fw-bold" style="color: #223584;">Functions  of Student Welfare and Affairs</h6>
                        <div class="mx-auto" style="width: 100px; height: 4px; background: linear-gradient(to right, orange, #223584);"></div>
                    </div>
                    <ul>
                       <li>Offers psychological and emotional support.</li>
                                    <li>Manages scholarships, fee concessions, and emergency funds for deserving students.</li>
                                    <li>Addresses complaints related to academics, facilities, or campus life.</li>
                                    <li>Helps students with career planning, internships, and placement preparation.</li>
                                    <li>Organizes medical check-ups and health awareness programmes.</li>
									<li>Ensures safe and comfortable living conditions for residential students.</li>
									<li>Organization of cultural, sports and other events for holistic growth.</li>
									
                    </ul>
                </div> 
				
				    <div class="col-xl-6">
                    <div class="row testi-slider2 th-carousel" 
                         data-slide-show="1" 
                         data-lg-slide-show="1" 
                         data-md-slide-show="1" 
                         data-arrows="false"
                         data-autoplay="true"
                         data-autoplay-speed="3000"> 
                        
                        <div class="col-lg-6">
                            <div class="tilt-active">
                                <img src="document/Research/student_welfare/student_welafare_2.JPG" alt="img">
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="tilt-active">
                                <img src="document/Research/student_welfare/student_welafare_3.jpg" alt="img">
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="tilt-active">
                                <img src="document/Research/student_welfare/student_welafare_4.jpg" alt="img">
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="tilt-active">
                                <img src="document/Research/student_welfare/student_welafare_5.JPG" alt="img">
                            </div>
                        </div>
                        
                    </div>
                </div>
                        
                 
            </div>
        </div>
    </div>

   
   
     <div class="cta-area-1" data-bg-src="assets/img/bg/cta-bg1.png">
        <div class="container">
            <div class="row align-items-center justify-content-between">
                <div class="col-lg-8">
                    <div class="cta-wrap title-area mb-0">
                        <div class="cta-icon">
                            <img src="assets/img/normal/cta-icon1.png" alt="icon">
                        </div>
                        <div class="cta-content">
                            <h3 class="cta-title sec-title">Connect Student Welfare and Affairs </h3>
                        </div>
                        <!--<a href="about.html" class="th-btn style8">Contact Us<i class="fas fa-arrow-right ms-1"></i></a>-->
                        <a href= "mailto:student.welfare@raiuniversity.edu"class="th-btn style8">Click Here<i class="fas fa-arrow-right ms-1"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="cta-img-1" data-overlay="title" data-opacity="8">
            <img src="assets/img/normal/cta_1_1.png" alt="Image">
            <a href="https://www.youtube.com/watch?v=jySdcGARFPQ" class="play-btn style2 popup-video"><i class="fa-sharp fa-solid fa-play"></i></a>
        </div>
    </div>
    @endsection
    
     <!--********************************
			Code End  Here 
	******************************** -->

    <!-- Scroll To Top -->
    <div class="scroll-top">
        <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
            <path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" style="transition: stroke-dashoffset 10ms linear 0s; stroke-dasharray: 307.919, 307.919; stroke-dashoffset: 307.919;"></path>
        </svg>
    </div>

    <!--==============================
    All Js File
============================== -->
    <!-- Jquery -->
    <script src="assets/js/vendor/jquery-3.6.0.min.js"></script>
    <!-- Slick Slider -->
    <script src="assets/js/slick.min.js"></script>
    <!-- Bootstrap -->
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- Magnific Popup -->
    <script src="assets/js/jquery.magnific-popup.min.js"></script>
    <!-- Counter Up -->
    <script src="assets/js/jquery.counterup.min.js"></script>
    <!-- Circle Progress -->
    <script src="assets/js/circle-progress.js"></script>
    <!-- Range Slider -->
    <script src="assets/js/jquery-ui.min.js"></script>
    <!-- Isotope Filter -->
    <script src="assets/js/imagesloaded.pkgd.min.js"></script>
    <script src="assets/js/isotope.pkgd.min.js"></script>
    <!-- Tilt JS -->
    <script src="assets/js/tilt.jquery.min.js"></script>
    <!-- Tweenmax JS -->
    <script src="assets/js/tweenmax.min.js"></script>
    <!-- Nice Select JS -->
    <script src="assets/js/nice-select.min.js"></script>

    <!-- Main Js File -->
    <script src="assets/js/main.js"></script>

</body>

</html>