@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i');

/* ======================================
        FOOTER
====================================== */
.contactform-iframe_1{
    width: 80%;
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    margin-left: 20px;
}

.contactform-iframe_1 input, .contactform-iframe_1 textarea{
    width: 100%;    
    margin-bottom: 15px;
    padding: 5px;
    font-family: 'Roboto', sans-serif;
}

.contactform-iframe_1 textarea{
    height: 50px;
}

.contactform-iframe_1 input[type="submit"]{
    color: white;
    background: #14ba0c;
    display: inline-block;
    padding: 15px 20px;
    width: 150px;
    border: none;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: normal;
    font-size: 15px;
    background: linear-gradient(to right, #5BD77B 50%, #005daa 50%);
    background-size: 200% 100%;
    background-position: left bottom;
    transition: all 0.3s ease;
}

.contactform-iframe_1 input[type="submit"]:hover{
    background-position: right bottom;
}

.contactform-iframe_1 .voornaam, .contactform-iframe_1 .familienaam{
    width: calc(50% - 15px);
    float: left;
}

.contactform-iframe_1 .voornaam{
    margin-right: 15px;
}

.contactform-iframe_1 .familienaam{
    margin-left: 15px;
}

.contactform-iframe_1 .voornaam::before{
    display: block;
    content: 'Voornaam:';
    font-weight: bold;
    margin-bottom: 5px;
}

.contactform-iframe_1 .familienaam::before{
    display: block;
    content: 'Familienaam:';
    font-weight: bold;
    margin-bottom: 5px;
}

.ccontactform-iframe_1 .email::before{
    display: block;
    content: 'E-mail:';
    font-weight: bold;
    margin-bottom: 5px;
}

.contactform-iframe_1 .bericht::before{
    display: block;
    content: 'Uw bericht:';
    font-weight: bold;
    margin-bottom: 5px;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color: transparent;
}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: transparent;
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: transparent;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
   color: transparent;
}

textarea::-webkit-input-placeholder { /* WebKit browsers */
    color: transparent;
}

textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: transparent;
}

textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: transparent;
}

textarea:-ms-input-placeholder { /* Internet Explorer 10+ */
   color: transparent;
}

/* ======================================
        OFFERTE
====================================== */
.contactform-iframe_2{
    width: 95%;
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    margin-left: 20px;
}

.contactform-iframe_2 input,
.contactform-iframe_2 textarea, 
.contactform-iframe_2 select{
    width: 100%;    
    margin-bottom: 15px;
    padding: 5px;
    font-family: 'Roboto', sans-serif;
    box-sizing: border-box;
}

.contactform-iframe_2 select{
    width: 250px;
}

.contactform-iframe_2 textarea{
    height: 50px;
}

.contactform-iframe_2 input[type="submit"]{
    color: white;
    background: #14ba0c;
    display: block;
    padding: 15px 20px;
    margin-top: 20px;
    width: 200px;
    border: none;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: normal;
    font-size: 15px;
    background: linear-gradient(to right, #5BD77B 50%, #005daa 50%);
    background-size: 200% 100%;
    background-position: left bottom;
    transition: all 0.3s ease;
}

.contactform-iframe_2 input[type="submit"]:hover{
    background-position: right bottom;
}

.contactform-iframe_2 label{
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
}

.contactform-iframe_2 .voornaam, 
.contactform-iframe_2 .familienaam,
.contactform-iframe_2 .email,
.contactform-iframe_2 .telefoonnummer
{
    width: calc(25% - 15px);
    float: left;
}

.contactform-iframe_2 .voornaam,
.contactform-iframe_2 .familienaam,
.contactform-iframe_2 .email{
    margin-right: 15px;
}

.contactform-iframe_2 .labels{
    margin-bottom: 15px;
}

.contactform-iframe_2 .custom{
    width: calc(50% - 15px);
    float: left;
    margin-right: 15px;
}

.contactform-iframe_2 .bericht{
    margin-right: 15px;
}