@import "~theme/vars";

h1 {
    font-family: $font-family-monospace;
    font-weight: bold;
    font-size: 32px;
    color: #9cb8f9;
    text-shadow: 0 0 1px black;
    margin: 0 0 25px;
}

button, a, .quote {
    font-family: $font-family-sans-serif;
}

.quotes {
    margin: 50px 0;
    display: flex;
    justify-content: center;
    text-align: center;

    .quote {
        margin: 0 30px;

        .text {
            font-size: 40px;
            font-style: italic;
        }

        .author {
            font-size: 14px;
        }
    }

    @media (max-width: 600px) {
        & { display: none;}
    }
}

strong {
    background: #849dff;
    font-weight: normal;
    padding: 2px 7px;
    color: black;
}

.section {
    padding: 50px 0;
}

.section-a {
    background: rgba(0, 0, 0, .5);
}

.section-b {
}

::ng-deep lib-ngx-image-zoom {
    width: 100%;
    display: block;

    img {
        min-width: 100px;
        max-width: 100%;
        width: 100%;
    }
}

.btn-lg {
    display: flex;
    align-items: center;
    text-align: left;
    line-height: 0.9;
    padding: 0.7rem 1.2rem;

    fa-icon {
        margin-right: 5px;
    }

    small {
        font-size: 14px;
        opacity: .5;
    }
}
