html,body {
    background: #f6f6f6;
}

h1 {
    font-size: 2rem;
}

h2,h3 {
    font-size: 1.5rem;
}

main {
    background: #fefefe;
    max-width: 700px;
    margin: 0 auto;
    padding-bottom: 1rem;
}

header {
    border-bottom: 1px solid lightgrey;
    display: flex;
    justify-content: center;
    align-items: center;
}

header img {
    height: 100px;
    width: 100px;
}

.card {
    max-width: 100%;
}

.card-relative {
    position: relative;
}

.card-overlay {
    position: absolute;
    padding: 1rem 0;
    background: rgba(193, 193, 193, 0.51);
    color: #333;
    text-align: center;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.card-image img {
    height: auto;
    max-width: 100%;
}

.card-head .card-image img {
    object-fit: cover;
    width: 100%;
    height: 50%;
    max-height: 150px;
}

.cards-specs .card{
    flex: 0 0 30% !important;
}

#lampModal td {
    vertical-align: middle;
}

@media (max-width: 768px) {
    .card-head {
        border: none;
    }
}

@media (max-width: 560px) {

    .cards-specs {
        margin: 0 -5px 1rem -5px;
    }

    .cards-specs .card{
        margin: 0 5px 1rem 5px;
        flex: 1 1 44% !important;
    }
}
