@extends('layouts.master')
@section('content')

<style>
        .card {
            position: relative;
            overflow: hidden;
            border: none;
        }
        .card img {
            object-fit: cover;
            height: 100%;
            opacity: 0.3;
        }
        .card-date {
            position: absolute;
            top: 0;
            left: 25px;
            background: white ;
            color:rgba(0, 0, 0, 0.8);
            font-weight: bold;
            padding: 10px;
            writing-mode: vertical-rl;
            text-orientation: upright;
            font-size: 14px;
        }
        .card-body {
            position: relative;
            z-index: 2;
            background: rgba(255, 255, 255, 0.9);
            padding: 20px;
        }
        .card-title {
            font-size: 30px;
            font-weight: 500;
        }
        .card-text {
            font-size: 14px;
            color: #555;
        }
        .view-art {
            font-size: 14px;
            background-color: #004085!important;
            border-color: #004085!important;
        }
    </style>
    <div class="main-body">
        <div class="main-about">
            <h1 class="py-auto">Resources</h1>
            <!-- <h5>Events - <span class="company">Activity Center</span></h5> -->
        </div>
        <div class="our-member" style="margin-top:50px">
            <h1 class="text-center">Resources Center </h1>
            <h5 class="text-center mb">We're here with you to analyzing your business according to different<br> points of view and guide you in your business.</h5>
        </div>
        <div class="container">
            <span class="title">Document Repository</span>
        </div>
        <div class="search">
            <div class="container">
                
                <!-- <div class="container my-5"> -->
                    <div class="row g-4">
                        <!-- Card Item -->
                        <div class="col-md-4">
                            <div class="card">
                                <div class="res1">
                                    <div class="card-date">22.10.24</div>
                                    <div class="card-body">
                                        <h5 class="card-title">Lorem ipsum dolor sit amet, consectetur</h5>
                                        <p class="card-text">We're here with you to analyzing your business according to different.</p>
                                        <a href="#" class="btn btn-primary view-art">View Article</a>
                                    </div>
                                </div>    
                            </div>
                        </div>

                        <!-- Repeat for other cards -->
                        <div class="col-md-4">
                            <div class="card">
                                <div class="res2">
                                    <div class="card-date">22.10.24</div>
                                    <div class="card-body">
                                        <h5 class="card-title">Lorem ipsum dolor sit amet, consectetur</h5>
                                        <p class="card-text">We're here with you to analyzing your business according to different.</p>
                                        <a href="#" class="btn btn-primary view-art">View Article</a>
                                    </div>
                                </div>    
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="card">
                                <!-- <img src="/img/imagedoc3.png" class="card-img" alt="Card Image"> -->
                                <div class="res3">
                                    <div class="card-date">22.10.24</div>
                                    <div class="card-body">
                                        <h5 class="card-title">Lorem ipsum dolor sit amet, consectetur</h5>
                                        <p class="card-text">We're here with you to analyzing your business according to different.</p>
                                        <a href="#" class="btn btn-primary view-art">View Article</a>
                                    </div>
                                </div>    
                            </div>
                        </div>

                        <!-- Add more cards as needed -->
                    </div>
                    <div class="row g-4 mt-2">
                        <!-- Card Item -->
                        <div class="col-md-4">
                            <div class="card">
                                <div class="res1">
                                    <div class="card-date">22.10.24</div>
                                    <div class="card-body">
                                        <h5 class="card-title">Lorem ipsum dolor sit amet, consectetur</h5>
                                        <p class="card-text">We're here with you to analyzing your business according to different.</p>
                                        <a href="#" class="btn btn-primary view-art">View Article</a>
                                    </div>
                                </div>    
                            </div>
                        </div>

                        <!-- Repeat for other cards -->
                        <div class="col-md-4">
                            <div class="card">
                                <div class="res2">
                                    <div class="card-date">22.10.24</div>
                                    <div class="card-body">
                                        <h5 class="card-title">Lorem ipsum dolor sit amet, consectetur</h5>
                                        <p class="card-text">We're here with you to analyzing your business according to different.</p>
                                        <a href="#" class="btn btn-primary view-art">View Article</a>
                                    </div>
                                </div>    
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="card">
                                <!-- <img src="/img/imagedoc3.png" class="card-img" alt="Card Image"> -->
                                <div class="res3">
                                    <div class="card-date">22.10.24</div>
                                    <div class="card-body">
                                        <h5 class="card-title">Lorem ipsum dolor sit amet, consectetur</h5>
                                        <p class="card-text">We're here with you to analyzing your business according to different.</p>
                                        <a href="#" class="btn btn-primary view-art">View Article</a>
                                    </div>
                                </div>    
                            </div>
                        </div>

                        <!-- Add more cards as needed -->
                    </div>
                <!-- </div> -->
            </div>
        </div>   
 


        

       <div style="margin-top:60px">
            @include('layouts.art')
        </div>    
   

@endsection