/*
Theme Name: Bootshaus Hamm
Description: 
Author: N
Author URI: 
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/

.xwriting {  display: inline-block;
            /* nötig, damit transform greift */
             transform: rotate(-2deg);
            /* -10deg = leicht nach links, +2deg = leicht nach rechts */
             transform-origin: center;  
            }

                        .polaroid {
                            display: inline-block;
                            background: #fff;
                            padding: 10px 10px 40px 10px;
                            /* unten Platz für Text */
                            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
                            border: 1px solid #eee;
                            position: relative;
                            text-align: center;
                            max-width: 300px;
                            transform: rotate(-2deg);
                        }
            
                        /* Bild selbst */
                        .polaroid img {
                            display: block;
                            max-width: 100%;
                            height: auto;
                            margin: 0 auto;
                        }
            
                        /* Körnung / Film-Grain */
                        .polaroid::before {
                            content: "";
                            position: absolute;
                            inset: 0;
                            background-image: url("data:image/svg+xml;utf8,
             <svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' > <filter id='grain' > <feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' /> <feColorMatrix type='saturate' values='0' /> <feComponentTransfer> <feFuncA type='linear' slope='0.15' /> </feComponentTransfer> </filter> <rect width='100%' height='100%' filter='url(%23grain)' /> </svg>");
             background-size: cover;
                                    opacity: 0.12;
                                    pointer-events: none;
                                    border-radius: 2px;
                            }
            
                            /* Caption automatisch aus dem ALT-Attribut */
                            .polaroid img::after {
                                content: attr(alt);
                                display: block;
                                font-family: 'Shadows Into Light', 'Comic Sans MS', cursive;
                                font-size: 1rem;
                                color: #333;
                                margin-top: 8px;
                            }

.menu-cover {
    display: inline-block;
    position: relative;
    max-width: 300px;
    /* Größe anpassen */
    background: #fff;
    border: 2px solid #ddd;
    /* Rahmen wie Karton */
    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.25),
        inset 0 0 15px rgba(0, 0, 0, 0.05);
    /* außen + innen */
    transform: rotate(-1deg);
    /* leicht gekippt für Realismus */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.menu-cover img {
    display: block;
    width: 100%;
    height: auto;
}

/* kleiner „Buchrücken“-Effekt links */
.menu-cover::before {
    content: "";
    position: absolute;
    top: 0;
    left: -8px;
    width: 8px;
    height: 100%;
    background: linear-gradient(to right, #bbb, #eee);
    border-right: 1px solid #ccc;
    box-shadow: inset -2px 0 4px rgba(0, 0, 0, 0.1);
}

/* Hover-Effekt: hebt die Karte an */
.menu-cover:hover {
    transform: rotate(0deg) scale(1.02);
    box-shadow: 0 18px 25px rgba(0, 0, 0, 0.35);
}

a {
color: var(--awb-text-color) !important;}

a:hover {
color:white !important;}