/*custom font*/
@import url(https://fonts.googleapis.com/css?family=Montserrat);

/*basic reset*/
* {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
    background: #f5f5f5; /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #6441A5, #2a0845); /* Chrome 10-25, Safari 5.1-6 */
}

body {

    background: transparent;
}


input[type=file] {
    display: none;
}

.optional_email{
    padding-left: 25px !important;
}


.require_text,.require_email,.require_select{
    padding-left: 25px !important;
    background: url(../images/exclamation-mark.svg) ;
    background-size: 15px ;
    background-repeat: no-repeat ;
    background-position: 5px 9px ;
}


.empty_input{

    background: url(../images/exclamation-mark.svg) !important;
    background-size: 15px !important;
    background-repeat: no-repeat !important;
    background-position: 5px 9px !important;
}

.true_input{
    background: url(../images/checked.svg) !important;
    background-size: 15px !important;
    background-repeat: no-repeat !important;
    background-position: 5px 9px !important;
}
.false_input{
    background: url(../images/multiply.svg) !important;
    background-size: 15px !important;
    background-repeat: no-repeat !important;
    background-position: 5px 9px !important;
}






/*form styles*/

#msform {

    text-align: center;

    position: relative;

    margin-top: 30px;

}



#msform fieldset {

    background: white;

    border: 0 none;

    border-radius: 0px;

    box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);

    padding: 20px 30px;

    box-sizing: border-box;

    width: 90%;

    margin: 0 5%;



    /*stacking fieldsets above each other*/

    position: relative;

}



/*Hide all except first fieldset*/

#msform fieldset:not(:first-of-type) {

    display: none;

}



/*inputs*/

#msform input, #msform textarea {

    padding: 15px;

    border: 1px solid #ccc;

    border-radius: 0px;

    margin-bottom: 10px;



    box-sizing: border-box;

    font-family: montserrat;

    color: #2C3E50;

    font-size: 13px;

}



#msform input:focus, #msform textarea:focus {

    -moz-box-shadow: none !important;

    -webkit-box-shadow: none !important;

    box-shadow: none !important;

    border: 1px solid #02ad88;

    outline-width: 0;

    transition: All 0.5s ease-in;

    -webkit-transition: All 0.5s ease-in;

    -moz-transition: All 0.5s ease-in;

    -o-transition: All 0.5s ease-in;

}



/*buttons*/

#msform .action-button {

    width: 100px;

    background: #02ad88;

    font-weight: bold;

    color: white;

    border: 0 none;

    border-radius: 25px;

    cursor: pointer;

    padding: 10px 5px;

    margin: 10px 5px;

}



#msform .action-button:hover, #msform .action-button:focus {

    box-shadow: 0 0 0 2px white, 0 0 0 3px #02ad88;

}



#msform .action-button-previous {

    width: 100px;

    background: #02ad8863;

    font-weight: bold;

    color: white;

    border: 0 none;

    border-radius: 25px;

    cursor: pointer;

    padding: 10px 5px;

    margin: 10px 5px;

}



#msform .action-button-previous:hover, #msform .action-button-previous:focus {

    box-shadow: 0 0 0 2px white, 0 0 0 3px #02ad8863;

}



/*headings*/

.fs-title {

    font-size: 18px;

    text-transform: uppercase;

    color: #2C3E50;

    margin-bottom: 10px;

    letter-spacing: 2px;

    font-weight: bold;

    margin-bottom: 2em;

}



.fs-subtitle {

    font-weight: normal;

    font-size: 13px;

    color: #666;

    margin-bottom: 20px;

}



/*progressbar*/

#progressbar {

    margin-bottom: 30px;

    overflow: hidden;

    /*CSS counters to number the steps*/

    counter-reset: step;

    padding-left: 0px;

}



#progressbar li {


    list-style-type: none;
    display: inline-block;
    color: #000000;

    text-transform: uppercase;

    font-size: 9px;

    width: 32.33%;

    position: relative;

    letter-spacing: 1px;

    font-weight: bold

}



#progressbar li:before {

    content: counter(step);

    counter-increment: step;

    width: 24px;

    height: 24px;

    line-height: 26px;

    display: block;

    font-size: 12px;

    color: #333;

    background: white;

    border-radius: 25px;

    margin: 0 auto 10px auto;

}



/*progressbar connectors*/

#progressbar li:after {

    content: '';

    width: 100%;

    height: 2px;

    background: white;

    position: absolute;

    left: -50%;

    top: 9px;

    z-index: -1; /*put it behind the numbers*/

}



#progressbar li:first-child:after {

    /*connector not needed before the first step*/

    content: none;

}



/*marking active/completed steps green*/

/*The number of the step and the connector before it = green*/

#progressbar li.active:before, #progressbar li.active:after {

    background: #02ad88;

    color: white;

}





/* Not relevant to this form */

.dme_link {

    margin-top: 30px;

    text-align: center;

}

.dme_link a {

    background: #FFF;

    font-weight: bold;

    color: #02ad88;

    border: 0 none;

    border-radius: 25px;

    cursor: pointer;

    padding: 5px 25px;

    font-size: 12px;

}



.dme_link a:hover, .dme_link a:focus {

    background: #02ad8863;

    text-decoration: none;

}

input[type=file] {

    display: none;

}



label {



    font-weight: 500;

}

#msform  input[type=checkbox], input[type=radio] {

    margin-top: -2px;

    margin-top: 1px\9;

    line-height: normal;

    height: 25px;

}