﻿.form-container {
    justify-content: center;
    display: grid;
    grid-template-columns: minmax(auto,720px);
    padding: 16px;
}

.form {
    width: 100%;
    max-width: 720px;
    height: min-content;
    min-height: 100px;
    box-sizing: border-box;
    background-color: var(--color-SLIDDES-white);
    border-radius: 6px;
    margin: 16px 0px 16px 0px;
    overflow: hidden;
    border: 1px solid var(--color-SLIDDES-whitegray);
    border: 0px;
}

    .form .section {
        margin-top: 32px;
    }

.form .content {
    height: min-content;
    padding: 16px;
}

    .form .content h1 {
        color: var(--color-222222);
        font-size: 2.6rem;
        line-height: 3rem;
        letter-spacing: 0px;
        margin: 0px 0px 8px 0px;
    }

    .form .content h2 {
        margin: 32px 0px 16px 0px;
        color: inherit;
        font-family: 'Roboto-Medium';
        font-size: 1.4rem;
        font-weight: normal;
        letter-spacing: 0px;
        line-height: 1.4rem;
    }

    .form .content .date {
        font-size: 12px;
        margin: 0px;
    }

    .form .content ul {
        padding-left: 16px;
    }

    .form .content .ul-alternate {
        list-style-type: none;
        padding-left: 0px;
    }
        .form .content .ul-alternate li {
            padding: 4px 8px;
            background: inherit;
        }
            .form .content .ul-alternate li:nth-child(odd) {
                background: var(--color-SLIDDES-whitegray);
            }

    .form .content .ul-topline {
        list-style-type: none;
        padding-left: 0px;
    }
        .form .content .ul-topline li {
            padding: 4px 8px;
            border-top-style: solid;
            border-top-width: 1px;
            color: var(--color-SLIDDES-whitegray) !important;
        }
            .form .content .ul-topline li:first-child {
                border-top-width: 0px;
            }

    .form .content .youtube {
        width: 100%;
        height: 400px;
    }

    .form .content .video-gif {
        width: 100%;
    }

    .form .content .text-align-center {
        text-align: center;
    }

    .form .fine-print {
        font-size: 12px;
        line-height: 14px;
    }

    .form img{
        width: 100%;
    }

    .form .full-width {
        width: Calc(100% + 32px) !important;
        margin-left: -16px;
    }

    .form .pixel-art {
        image-rendering: crisp-edges;
    }

    .form .flex-small {
        display: flex;
        flex-wrap: wrap;
    }

        .form .flex-small a {
            width: 96px;
            height: 96px;
            margin: 6px;
        }

        .form .flex-small .flex-small-img {
            width: 100%;
            height: 100%;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
            border-radius: 16px;
        }

        .form .head { /*Used?*/
            justify-content: center;
            display: flex;
            gap: 16px;
        }

.form-icon {
    width: 128px;
    min-width: 128px;
    height: 128px;
    min-height: 128px;
    border-radius: 16px;
    background-size: contain;
}

.form-name-container {
    width: 100%;
    margin: auto;
}

    .form-name-container h1 {
        font-size: 3rem;
        line-height: 3rem;
    }

    .form-name-container hr {
        width: 100%;
        height: 1px;
        background-color: var(--color-SLIDDES-whitegray);
        border-style: hidden;
    }

    .form-name-container a {
        border-radius: 16px;
        padding: 4px 8px;
        background-color: var(--color-SLIDDES-blue);
        color: var(--color-SLIDDES-white);
        line-height: 32px;
        font-size: 12px;
    }


/*Other*/
.flex-space-between {
    display:flex;
    justify-content:space-between;
}