/*DEMO CSS CODE STARTS HERE*/
html {}


/*COPY CODE BELOW INTO YOUR EXISTING STYLESHEET*/
#form {width: 100%;}

/*Error/Success*/
#error,#success {display:none;color:#FFF;padding: 5%;margin-bottom: 25px;}
#error {background: #e74c3c;}
#success{background: #2ecc71;}

/*Form*/
#easyform {float:left;margin: auto;}
#easyform label {font-size:14px;text-transform:uppercase;letter-spacing:1px;}
#easyform .input {width: 47.5%;float: left;margin: 0 0 20px 0;}
#easyform .textarea {width: 100%;}
#easyform .last {float: right;}
#easyform input.text, #easyform textarea {font-family: 'Source Sans Pro', sans-serif;font-size: 16px;padding: 11px;border-radius: 5px;border: 1px solid #cecece;-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;float: left;outline: none;}
#easyform input[type=text]:focus, #easyform input[type=tel]:focus, #easyform textarea:focus {margin-right: 0px;box-shadow: 0 0 3px #444444;border: 1px solid #5133a1;}
#easyform input:hover, #easyform textarea:hover {border: 1px solid #ff9400;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
#easyform textarea {height: 200px;}
#easyform span {color:red;}
#easyform .verification {width: 100%;float: left;}
#easyform #verify_image {width: 100px;height: 44px;float: left;border-radius: 5px;}
#easyform .refresh {width: 42px;height: 42px;display: block;float: left;margin: 0 7px;border:0;}
#easyform #verify {width: 145px;float: left;}
#easyform button {float: right;display: block;width: 150px;border-radius: 5px;text-transform: uppercase;letter-spacing: 1px;background: #444444;padding: 15px 20px;color: #fff;text-align: center;margin:0;border:0;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;cursor:pointer; height: auto; line-height: auto;}
#easyform button:hover {background: #ff9400;}


/*OPTIONAL RESPONSIVE STYLES BELOW*/

    @media only screen and (max-width: 1000px) {
    .wrap {width: auto;padding: 5px;line-height: 1.25em;}
    #easyform .verification {height: auto;}
    #easyform #verify_image {width: 99px;height: 42px;float: left;}
    #easyform .refresh {float: right;margin: 0;}
    #easyform #verify {width: 100%;margin: 25px 0;}
    }


    @media only screen and (max-width: 800px) {
    .wrap {width: auto;padding: 5px;line-height: 1.25em;}   
    #easyform .verification {height: auto;}
    #easyform #verify_image {width: 99px;height: 42px;float: left;}
    #easyform .refresh {float: right;margin: 0;}
    #easyform #verify {width: 100%;margin: 25px 0;}
    }


    @media only screen and (max-width: 600px) {
    .wrap {width: auto;padding: 5px;line-height: 1.25em;}
    #easyform .input {width: 100%;}
    #easyform .textarea {max-width: 100%;}
    #easyform .verification {height: auto;}
    #easyform #verify_image {width: 99px;height: 42px;float: left;}
    #easyform .refresh {float: right;margin: 0;}
    #easyform #verify {width: 100%;margin: 25px 0;}
    }


    @media only screen and (max-width: 500px) {
    .wrap {width: auto;padding: 5px;line-height: 1.25em;}
    #easyform .textarea {max-width: 100%;}
    #easyform .verification {height: auto;}
    #easyform #verify_image {width: 99px;height: 42px;float: left;}
    }

    @media only screen and (max-width: 400px) {
    .wrap {width: auto;padding: 5px;line-height: 1.25em;}
    #error {padding: 20px;}
    #success{padding: 20px;}
    #easyform .input {max-width: 48%;}
    #easyform .textarea {max-width: 100%;}
    }