/*
@font-face {
    font-family: 'Aldo';
    src: url(fonts/aldo.ttf);
}
*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Aldo';
    font-size: 16px;
}

a {
    text-decoration: none;
}

p {
    color: black;
    font-size: 20px;
    margin-top: 20px;
    text-align: center;
}
/*
body {
    background: repeating-linear-gradient(to bottom,
            transparent,
            transparent 10%,
            #28272c 10%, #28272c 20%,
            #ff1f67 20%, #ff1f67 30%,
            #28272c 30%, #28272c 40%,
            #ff1f67 40%, #ff1f67 50%,
            #28272c 50%, #28272c 60%,
            #ff1f67 60%, #ff1f67 70%,
            #28272c 70%, #28272c 80%,
            #ff1f67 80%, #ff1f67 90%,
            transparent 90%, transparent 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}
*/

form {
    max-width: 100%;
    background-color: white;
    margin: 50px;
    border: 2px solid #ff1f67;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 25px 60px;
    a{
        font-size:24px !important;
    }

    div.mas_info{
        font-size:28px !important;
    }

    label {
        cursor:pointer;
        float: left;
        margin-top: 30px;
        color: #333;
        font-size: 22px;
        text-align: left;
        width: 100%;
    }

    select {
        width: 100%;
        height: 40px;
        border: 1px solid black;
        margin: 10px 0;
        padding: 0 10px;
    }

    .fecha_hora {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-content: center;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;

        label {
            display: inline-block;
            width: 50%;
        }

        input {
            width: 100%;
            text-align: center;
        }
    }

    textarea {
        width: 100%;
        height: 75px;
        border: 1px solid black;
        resize: vertical;
    }

    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="date"],
    input[type="time"] {
        width: 100%;
        height: 40px;
        border: 1px solid black;
        margin: 10px 0;
        padding: 0 10px;
    }

    .selector {
        > label {
            user-select: none;
            cursor: pointer;
            margin: 0;
            float: left;
            width: 100%;

            input {
                float: left;
                width: 24px;
                height: 24px;
                margin-right: 6px;
            }
        }
    }

    input[type="submit"] {
        width: 35%;
        height: 45px;
        padding: 0 10px;
        background-color: black;
        color: white;
        font-size: 22px;
        transition: 0.4s;
        margin-top: 40px;
        margin-bottom: 20px;
        cursor: pointer;

        &:hover {
            background-color: #ff1f67;
        }

        @media (max-width: 800px) {
            width: 50%;
        }

    }

    *:required {
        color: #ff1f67;
        border: 1px solid #ff1f67 !important;
    }

    fieldset{
        float: left;
        width: 100%;
        border: 0;
        padding: 0;
        margin-top: 30px;

        legend{
            font-size: 22px;
            user-select: none;
        }
        label{
            margin-top:0;
            float:left;
            display:inline-block;
            padding:0;
            margin-right:12px;
            width:calc((100%/3) - 12px);
        }
    }
}

@media screen and (max-width: 992px) {
    form {
        border: 0;
        padding: 10px;
        max-width: 100%;
        margin: 5px;

        label {
            margin-bottom: 6px;
        }

        input[type="text"],
        input[type="email"],
        input[type="tel"],
        input[type="number"],
        input[type="date"],
        input[type="time"] {
            width: 100%;
            margin: 0;
            border-radius: 6px;
        }

        textarea {
            float: left;
            width: 100%;
            padding: 10px;
            height: 30vh;
            border-radius: 6px;
        }

        fieldset label{
            width:100%;
        }
    }


    .selector {
        width: auto;
    }
}