/* ====================== BOOKING ====================== */

.location {
    margin-top: 4rem;

    .mapa {
        margin: auto;
    }

    a {
        color: #575757;
        font-weight: 600;
    }

    a:hover {
        text-decoration: underline;
    }

    h2 {
        margin-bottom: 2rem;
    }

    .location__info {
        display: flex;
        flex-direction: row;
        margin-top: 5rem;
        display: flex;
        justify-content: center;
        align-items: center;

        .location-text {
            margin-bottom: 1rem;
            margin-right: 5rem;
            flex-basis: 40%;
        }

        .map {
            flex-basis: 60%;
            box-shadow: 0 5px 10px rgb(0 0 0 / 10%);

            iframe {
                height: 50vh;
                width: 50vw;
            }
        }
    }

    .things-to-do {
        margin-top: 5rem;

        hr {
            border-top: 1px solid #888888;
            margin-bottom: 3rem;
            width: 90%;
            margin-left: 5%;
        }

        .to-do-description {
            text-align: center;
            margin-bottom: 2rem;
        }

        ul li {
            margin-left: 3rem;
            margin-top: 2.5rem;

            b {
                text-transform: uppercase;
            }
        }

        .to-do, .to-eat {
            margin: 0 5rem;

            hr {
                border-top: 2px solid #888888;
                margin-bottom: 3rem;
                width: 20rem;
            }
        }

        .to-eat h3 {
            margin-top: 0 !important;
            margin-bottom: 1rem;
        }

        h3 {
            margin-top: 4rem;
            margin-bottom: 1rem;
        }

        .eat-location {
            display: flex;
            margin-top: .5rem;
        }

        .location-icon {
            width: 1.5rem;
            height: 1.5rem;
            margin-right: .5rem;
        }
    }

    .moving-container {
        
        hr {
            border-top: 1px solid #888888;
            width: 90%;
            margin: 4.5rem 5% 3rem 5%;
        }

        h2 {
            margin-bottom: 4rem;
        }

        .moving__info {
            margin: 0 8rem;
            
            ul {
                display: grid;
                grid-template-columns: 1fr 1fr;
                justify-items: center;

                .bus {
                    max-width: 20rem;
                }
            }
    
            b {
                text-transform: uppercase;
            }
        }
    }
}

#map {
    height: 50vh;
    width: 50vw;
}

@media (max-width: 768px) {
    .location__container {
        .location__info {
            display: block;
            margin: 0 1.5rem;

            .location-text {
                margin: 4rem 0 2rem;
            }

            #map {
                width: 100%;

                iframe {
                    width: 100%;
                }
            }
        }
    }

    .things-to-do, .moving-container {
        li {
            font-size: 14px;
        }

        .to-do, .to-eat, .moving__info {
            margin: 0 !important;
        }
    }

    .things-to-do {
        .to-do-description {
            margin: 0 1.5rem;
        }

        .to-do {
            h3 {
                text-align: center;
            }

            hr {
                width: 70% !important;
                margin-left: 15%;
            }

            ul {
                margin: 0 2rem;
                
                li {
                    margin-left: 0 !important;
                }
            }
        }

        .to-eat {
            h3 {
                text-align: center;
            }

            hr {
                width: 70% !important;
                margin-left: 15%;
            }

            ul {
                margin: 0 2rem;
                
                li {
                    margin-left: 0 !important;
                }
            }
        }

    }
    
    .moving-container {
        h2 {
            margin-bottom: 1rem !important;
        }

        ul {
            text-align: center;
            margin: .5rem;
            row-gap: 1rem;

            li {
                .bus-jump {
                    display: none;
                }
            }
        }
    }
}