html
{
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}
body
{
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    background-color: var(--main_bg);
}

.image_wide
{
    display: block;
    position: relative;
    width: 100%;
    min-height: 100px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.two_up
{
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
}
    .two_up > *
    {
        min-width: 0;
    }

p
{
    color: var(--blue);
    text-align: justify;
}
h1, h2, h3, h4, h5
{
    font-family: hrh_exotc;
}
li
{
  margin-top: 10px;
  margin-bottom: 10px;
}
#main
{
    display: grid;
    grid-template-columns: 1fr 400px;
    padding: 2rem;
    vertical-align: top;
    grid-gap: 2rem;
}
.hidden
{
    display: none !important;
}
@media screen and (max-width: 500px)
{
    #main
    {
        display: block;
    }
        #main > div
        {
            display: block;
        }
        #main h1
        {
            font-size: 2rem;
        }
    .picture_block
    {
        grid-template-columns: 1fr 1fr;
    }
}

.repair_topper
{
    display: block;
    position: relative;
    background-position: center center;
    height: 200px;
    width: 50%;
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: auto;
    margin-right: auto;
}

.image_list
{
    display: block;
    vertical-align: top;
}
    .image_list > div
    {
        display: inline-block;
        position: relative;
        height: 70px;
        width: 70px;
        box-sizing: border-box;
        border: 1px solid silver;
        box-shadow: 1px 3px 3px black;
        border-radius: 2px;
    }
        .image_list > div > img
        {
            display: block;
            position: relative;
            top: 5px;
            left: 50%;
            width: 90%;
            height: 40px;
            transform: translateX(-50%);
        }