.forms {
    display: flex;
    flex-direction: column;
}
.forms form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: -10px auto;
    width: 800px !important;
    max-width: 100%;
    font-size: 1.4rem;
}
.fline {
    width: 100%;
    max-width: var(--max-w);
    display: flex;
    flex-wrap: wrap;
    margin: 10px 0;
}
.fline label {
    width: 35%;
    padding-right: 20px;
    padding-top: 6px;
}
    .fline.persdata {
        align-items:center;
        /* flex-wrap: nowrap; */
    }
    .fline.persdata input{
        width:unset;
        padding: 0;
    }
    .fline.persdata label:last-of-type{
        width: unset;
        padding-left: 5px;
        padding-top: 0;
    }
.fline input[type="text"],
.fline.pass > input,
.fline input[type="submit"],
.fline input[type="button"],
.fline input[type="number"],
.fline textarea,
.fline select {
    width: 65%;
    padding: 5px;
    font-size: 1.4rem;
    border: var(--add-link-color) solid 1px;
}
.fline input[type="number"] {
    max-width:80px;
    text-align:center;
    /* padding:0 5px; */
}
.fline input[type="text"],
.fline.pass > input,
.fline input[type="button"],
.fline select {
    max-height:32px;
}
.fline.form-buttons {
    display: flex;
    flex-direction: row;
    /*! flex-wrap: nowrap; */
    justify-content: flex-start;
}
.fline button[type=submit],
.fline input[type=submit],
.fline input[type=button],
.fline.form-buttons a {
    width: 250px;
    max-width: 100%;
    margin-left: 35%;
    background-color: #9e1060;
    color: #fff;
    border: var(--add-link-color) solid 1px;
    padding: 5px 15px 5px;
    cursor: pointer;
    transition: .3s all ease;
    text-align: center;
    font-size: 1.2rem;
}
.fline.form-buttons a {
    /* margin-left: 20px; */
    background-color: #fff;
    color: var(--add-link-color);
    border: var(--add-link-color) solid 0px;
    padding: 0;
    cursor: pointer;
    transition: .3s all ease;
    text-align: center;
    width: 350px;
    text-align: left;
}
.fline input[type=submit]:hover,
.fline button[type=submit]:hover {
    background-color: #fff;
    background-color: #28bdbe;
}
.fline > span.error {
    color: red;
    font-size: 0.8rem;
    margin-left: 35%;
    margin-top:5px;
}
.fline > span.error span {
    display:block;
}

.forms.testing {}
.forms.testing form {
    font-size: 1.2rem;
}
.forms.testing:not(.usual) form div.fline:not(.form-buttons) {
    border: #5445cc solid 2px;
    margin-bottom: 30px;
    border-radius: 0 15px 15px 15px;
    box-shadow: #ccc 2px 2px 10px;
}
.forms.testing form div.fline {
    padding: 10px 20px 20px;
}
.forms.testing.usual form div.fline {
    padding: 10px 20px 0px;
}
.forms.testing form div.fline label {
    width: 100%;
    padding: 0;
    position: relative;
    /* background-color: #e8e8e8; */
    /* padding: 5px 10px; */
    /* border: #555 solid 2px; */
    /* color: #5445cc; */
}
.forms.testing form div.fline label span {
    background-color: #7bdaf6;
    background: linear-gradient(-45deg, #5445cc, #bd45cc);
    border-radius: 15px;
    box-shadow: #fff 3px 3px 0;
    color: #fff;
    width: 28px;
    height: 28px;
    text-align: center;
    display: block;
    text-align: center;
    line-height: 28px;
    position: absolute;
    left: -35px;
    top: -24px;
    /* padding-left: 3px; */
}
.forms.testing form div.fline div.form-ans {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 0;
    /* background-color: #555555; */
    /* color: #fff; */
}
.forms.testing form div.fline div.form-ans > span.error {
    margin: 10px 0 0;
    padding: 5px 15px;
    /* display: inline-block; */
    align-self: flex-end;
    border: var(--add-link-color) solid 1px;
    /* border-right-width: 10px; */
    /* margin-right: -22px; */
    border-radius: 20px;
}
.forms.testing.usual form div.fline div.form-ans > span.error {
    margin: 5px 0 0;
    padding: 0;
    /* display: inline-block; */
    border: none;
    /* border-right-width: 10px; */
    /* margin-right: -22px; */
    border-radius: 0px;
}
.forms.testing form div.fline div.form-ans > div {
    display: flex;
    align-items: flex-start;
    padding-top: 15px;
    position: relative;
    width: 100%;
}
.forms.testing form div.fline div.form-ans > div > input[type="radio"] {
    /* margin: 3px 10px 0 0; */
    /* margin-right: 10px; */
    /* display:none; */
    /* cursor: pointer; */
    /* font-size: 20px; */
    /* width: 16px; */
    /* height: 16px; */
    /* background-color: red; */
}

.forms.testing .fline input[type="text"],
.forms.testing .fline.pass > input,
.forms.testing .fline input[type="button"],
.forms.testing .fline textarea,
.forms.testing .fline select {
    width:100%;
    padding: 5px;
    font-size: 1rem;
    border: #5647cc solid 1px;
}
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:checked,
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:not(:checked) {
            position: absolute;
            left: -9999px;
        }
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:checked + label,
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:not(:checked) + label
        {
            position: relative;
            padding-left: 35px;
            cursor: pointer;
            line-height: 20px;
            display: inline-block;
            color: #5445cc;
        }
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:checked + label:before,
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:not(:checked) + label:before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            width: 18px;
            height: 18px;
            border: 1px solid #5445cc;
            border-radius: 100%;
            background: #fff;
        }
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:checked + label:after,
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:not(:checked) + label:after {
            content: '';
            width: 12px;
            height: 12px;
            background: #5445cc;
            position: absolute;
            top: 4px;
            left: 4px;
            border-radius: 100%;
            -webkit-transition: all 0.2s ease;
            transition: all 0.2s ease;
        }
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:not(:checked) + label:after {
            opacity: 0;
            -webkit-transform: scale(0);
            transform: scale(0);
        }
    .forms.testing form div.fline div.form-ans > div > input[type="radio"]:checked + label:after {
            opacity: 1;
            -webkit-transform: scale(1);
            transform: scale(1);
        }
.forms.testing form div.fline div.form-ans > div > label {
}
.forms.testing form div.fline div.form-ans > div > label small {
    background-color:#919191;
    color:#fff;
    width:30px;
    display:inline-block;
    display: none;
    text-align:center;
}

@media (max-width: 768px) {
    .forms:not(.testing) form {
        max-width:310px;
    }
    .fline {
    }
    .fline label {
    width: 100%;
    padding-right: unset;
    padding-bottom: 5px;
    }
        .fline.persdata label:first-of-type {
            display:none;
        }
        .fline.persdata label:last-of-type {
        width: calc(100% - 25px);
        padding-bottom: 0;
        }
    .fline input,
    .fline textarea,
    .fline select {
    width: 100% !important;
    }
    .fline input[type="checkbox"],
    .fline input[type="radio"] {
    width: unset !important;
    }
    .fline.form-buttons {
    }
    .fline button[type=submit],
    .fline input[type=submit],
    .fline input[type=button],
    .fline.form-buttons a {
    margin: 0 auto;
    }
    .fline.form-buttons a {
        margin:0;
    }
    .fline > span.error {
    margin-left: unset;
    }
    .fline > span.error span {
    }    
    .forms.testing form {
        font-size: 1.0rem;
    }
}

@media (max-width: 480px) {
    .forms.testing form {
        font-size: 0.9rem;
    }
}