@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>
@endsection
@section('titulo', 'Redes sociales')

@section('header-titulo', 'Redes sociales')

@section('header-image', '../resources/images/wallhaven-nzxq5v.jpg')

@section('content')
    <div class="d-flex justify-content-center align-items-center w-100 ">
        <div class="bg-body-secondary rounded rounded-4">
            <div class="bg-dark p-4 video-social rounded rounded-top-4">
                <video width="440" height="260" controls>
                    <source src="../resources/videos/ITSOEH.mp4" type="video/mp4">
                </video>
            </div>
            <div class="social-header text-center p-4">
                <span>Síguenos en</span>
            </div>
            <div class="content-social p-3">
                <div class="spotify d-flex justify-content-between w-100">
                    <img src="https://services.linkfire.com/logo_spotify_onlight.svg" alt="" style="width: 100px;">
                    <button class="btn btn-success" style="width: 120px;">Visitar</button>
                </div>
            </div>
            <div class="content-social p-3">
                <div class="youtube d-flex justify-content-between w-100">

                    <img src="https://services.linkfire.com/logo_youtube_onlight.svg" alt="" style="width: 100px;">
                    <button class="btn btn-danger" style="width: 120px;">Visitar</button>
                </div>
            </div>
            <div class="content-social p-3">
                <div class="facebook d-flex justify-content-between w-100">

                    <img src="https://services.linkfire.com/logo_facebook_onlight.svg" alt="" style="width: 100px;">
                    <button class="btn btn-primary" style="width: 120px;">Visitar</button>
                </div>
            </div>
            <div class="content-social p-3">
                <div class="facebook d-flex justify-content-between w-100">
                    <img src="https://services.linkfire.com/logo_instagram_onlight.svg" alt=""
                        style="width: 100px;">
                    <button class="btn btn-warning" style="width: 120px;">Visitar</button>
                </div>
            </div>
            <div class="content-social p-3">
                <div class="twitter d-flex justify-content-between w-100">
                    <img src="https://services.linkfire.com/logo_twitter_onlight.svg" alt="" style="width: 100px;">
                    <button class="btn btn-info " style="width: 120px;">Visitar</button>
                </div>
            </div>
        </div>
    @endsection