﻿body {
    padding: 20px;
}

.wFormContainer {
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    -webkit-animation: fadein 1.5s;
    /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1.5s;
    /* Firefox < 16 */
    -ms-animation: fadein 1.5s;
    /* Internet Explorer */
    -o-animation: fadein 1.5s;
    /* Opera < 12.1 */
    animation: fadein 1.5s;
    margin-top: 70px;
}

@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Firefox < 16 */

@-moz-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Safari, Chrome and Opera > 12.1 */

@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Internet Explorer */

@-ms-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Opera < 12.1 */

@-o-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.sv-form-group {
    padding-left: 20px;
    padding-right: 20px;
}

.RequiredField {
    color: #FE6263;
}

legend {
    font-family: "Roboto Slab";
    border: 0;
    padding-top: 10px;
}

fieldset > div {}

fieldset fieldset > legend {
    font-size: 1.3em;
    float: right;
}

fieldset fieldset {
    border: 1px solid #DDDDDD !important;
    border-radius: 5px !important;
    padding: 10px !important;
    margin: 0.4em;
    background-color: #F5F5F5 !important;
}

fieldset > div > fieldset {
    margin-left: 1.4em;
    margin-right: 1.4em;
}
.htmlContent {

padding:0 20px 0 20px;

}
input,
select {
    border-radius: 3px !important;
}

.wFormTitle {
    margin-left: -15px;
    margin-right: -15px;
    margin-top: 0;
    margin-bottom: 0;
    padding: 20px;
    background-color: #F5F5F5;
    border-top-left-radius: 4px !important;
    border-top-right-radius: 4px !important;
}

.logo {
    text-align: left;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: -80px;
    margin-left: -15px;
}

.logo-image {
    height: 60px
}

.lengthIndicator[style] {
    display: none !important;
}

.required {
    background-color: white;
    transition: background-color 0.4s ease-in, color 0.4s ease-in;
}

.full {
    background-color: #DD0B15 !important;
    color: white;
    transition: background-color 0.4s ease-out, color 0.4s ease-out;
}

.phone-element-dial {
    float: left;
    width: 170px;
}

.phone-element-number {
    float: left;
    width: calc(100% - 170px);
}

ul[style] {
    background-color: whitesmoke;
    border: 1px solid #DDDDDD;
    border-bottom-left-radius: 4px !important;
    border-bottom-right-radius: 4px !important;
    width: calc(100% - 75px) !important;
    font-size:100% !important;
}

li,
li > a {
    cursor: pointer !important;
}


/* RADIO AND CHECK BOXES */

.select-item > input {
    display: none;
}

.select-item > label {
    padding: 0px;
    margin: 0;
    display: block;
    transition: background-color 0.2s ease, color 0.2s ease;
    word-wrap: break-word !important;
}

.select-item:first-of-type > label {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.select-item:last-of-type > label {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.select-item {
    padding: 0px;
    margin: auto;
}

input[type=checkbox]:checked + label,
input[type=radio]:checked + label {
    color: white;
    background-color: #227C0E;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}


/* Buttons */

.actions {
    padding-top: 30px;
    padding-bottom: 50px;
}

.invisible {
    visibility: hidden !important;
}

.lowercase {
    text-transform: lowercase !important;
}


/* Disclaimer */

.supportInfo,
.hint {
    font-size: 0.7em;
}


/* ERROR MESSAGES */

.errMsg {
    color: #DD0B15
}

@media (min-width: 805px) {
    ul[style] {
        width: 675px !important;
    }
}

@media (min-device-width: 1px) and (max-device-width: 400px) { 
    
    .phone-element-dial {
        display: block;
        width: 100%;
    }
    
    .phone-element-number {
        display: block;
        width: 100%;
    }
    .select-item {
        display: block !important;
        width: 100% !important;
    }
    .select-item > label {
        padding-top: 7px;
        padding-bottom: 7px;
        transition: background-color 0.1s ease, color 0.1s ease;
    }
    .select-item:first-of-type {
        border-top-left-radius: 4px !important;
        border-top-right-radius: 4px !important;
        border-bottom-right-radius: 0px !important;
        border-bottom-left-radius: 0px !important;
    }
    .select-item:last-of-type {
        border-bottom-right-radius: 4px !important;
        border-bottom-left-radius: 4px !important;
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }
    .select-item:first-of-type > label {
        border-top-left-radius: 3px !important;
        border-top-right-radius: 3px !important;
        border-bottom-right-radius: 0px !important;
        border-bottom-left-radius: 0px !important;
    }
    .select-item:last-of-type > label {
        border-bottom-right-radius: 3px !important;
        border-bottom-left-radius: 3px !important;
        border-top-left-radius: 0px !important;
        border-top-right-radius: 0px !important;
    }
    
    
}