@extends('layouts.app')

@section('content')

    <style>
        .button_wp{
            margin: 20px 20px 0px 0px;
            height: 48px;
            min-width: 170px;
            font-size: 15px;
            font-weight: 500;
            line-height: 46px;
            text-transform: none;
            letter-spacing: 0px;
            border: 1px solid rgb(114, 198, 200);
            border-radius: 20px;
            background: rgb(0, 143, 189);
            color: rgb(255, 255, 255);
            font-family: Belleza;

        }

        .button_wp:hover{
            background: rgb(114,198,200);
            color: black;
        }

        .accordion-button:not(.collapsed)::after {
            display: none;
        }
        .accordion-button::after {
            display: none;
        }
        .button_gallery{
            width: 100%;
            border-color: #00b3c0;
            background-color: #00c1cf;
            color: #fff;
        }

        @media (max-width: 800px) {
            .accordLeo {
                width: 90vw;
            }
        }

        @media (min-width: 800px) {
            .accordLeo {
                width: 40vw;
            }
        }

        .aReduit{

        }
        .imgAtelier{
            max-width: 100%;
        }

        .font-h3{
            font-size: 22px;
            text-align: center;
            font-family: Belleza;
            font-weight: 400;
            font-style: normal;
            letter-spacing: 0px;
            color: #50b2c1;
        }

        .font-h2{
            font-family: Belleza;
            font-size: 34px;
            line-height: 40px;
            letter-spacing: 0px;
            font-weight: 400;
            margin-bottom: 30px;
            color: #50b2c1;
        }

        .savoirplus{
            border: 1px solid;
            border-radius: 10px !important;
            border-color: #6ab9c6;
            color: #6ab9c6;
        }
        .fondActivity{
            width: fit-content;
        }
        .btnIconActivity{
            background: linear-gradient(rgb(111, 191, 255), rgb(78, 177, 193));    width: 74px;
            height: 74px;  border-radius: 25px;border: none;
        }

        .forceBg  * {
            /*background: none !important;*/
        }

    </style>


    <div style="text-align: center;">
        <a href="tel:+33683266844"><img style="image-rendering: optimizeQuality; max-width: 100vw;" src="assets/img/accueil.jpg" alt="image presentation Christelle Vandenberghe Sophrologue 06 83 26 68 44 "></a>
    </div>
    <div class="container mt-3" style=" max-width: 1024px;">
    <iframe src="https://calendar.google.com/calendar/embed?height=600&amp;wkst=1&amp;bgcolor=%2394c8d2&amp;ctz=Europe%2FParis&amp;src=Y2hyaXN0ZWxsZS52YW5kZW5iZXJnaGUwOUBnbWFpbC5jb20&amp;color=%23039BE5&amp;showCalendars=0&amp;mode=MONTH&amp;showTz=0&amp;showTitle=0" style="border-width:0" width="100%" height="600" frameborder="0" scrolling="no"></iframe>
    </div>

@endsection