@extends('layouts.plantilla');
@section('cdn')
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous">
    </script>
    <script src="https://kit.fontawesome.com/b1f3d5c1f6.js" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="../../resources/css/app.css">
@endsection

@section('titulo', $data->SER_TITULO)

@section('header-image', $data->SER_LINK_IMAGEN)

@section('header-titulo', $data->SER_TITULO)

@section('content')
    <div class="w-100 row">
        <p style="text-align: justify;"><strong>Descripción:</strong> {{ $data->SER_DESCRIPCION }}</p>
        <div class="col-4">
            <ul>
                <li class="mb-3 nav-link"><strong>Responsable: </strong>{{ $data->SER_RESPONSABLE }}</li>
                <li class="mb-3 nav-link"><strong>Contacto: </strong>{{ $data->SER_TELEFONO }}</li>
                <li class="mb-3 nav-link"><strong>Dirección: </strong>{{ $data->SER_DIRECCION }}</li>
            </ul>
        </div>
        <div class="col-4">
            <ul>
                <li class="mb-3 nav-link"><strong>Correo Electrónico: </strong>{{ $data->SER_EMAIL }}</li>
                <li class="mb-3 nav-link"><strong>Categoria: </strong>{{ $data->SER_CATEGORIA }}</li>
            </ul>
        </div>
        <div class="col-4 d-flex justify-content-center align-items-center">
        </div>
    </div>
@endsection