/*
  Theme Name: Site Name TODO: Add Site Name
  Author: Lucas Jordan, Stephen Arias
  Description: Form Styles
  Version: 0.0.1
  Copyright: Raremedia Pty Ltd (Andrew Davidson)'
*/


/*--------------------------------------------------------------
  # Form
--------------------------------------------------------------*/

.contact-form label {
    color: #ffffff;
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.875em;
    font-weight: 300;
}

.contact-form .columns {
    padding-right: 0;
}

.contact-form textarea {
    min-height: 100px;
}

[type=color],
[type=date],
[type=datetime-local],
[type=datetime],
[type=email],
[type=month],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=time],
[type=url],
[type=week],
textarea,
select {
    color: #fff;
    border: 1px solid #ffffff;
    border-radius: 3px;
    background-color: rgba(0, 0, 0, 0);
    font-size: .9rem;
}

[type=color]:focus,
[type=date]:focus,
[type=datetime-local]:focus,
[type=datetime]:focus,
[type=email]:focus,
[type=month]:focus,
[type=number]:focus,
[type=password]:focus,
[type=search]:focus,
[type=tel]:focus,
[type=text]:focus,
[type=time]:focus,
[type=url]:focus,
[type=week]:focus,
textarea:focus,
select:focus {
    color: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 3px;
    background-color: rgba(0, 0, 0, 0);
}

select:focus option {
    color: #000000;
}
/* Hide number inputer type increase/ decrease arrows */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
.button.submit {
    margin: 0.188em 0 1rem 0;
    padding: 0.625em 2.296em;
    color: #ffffff;
    border-radius: 3px;
    background-color: #3fa8f4;
    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 0.938em;
    font-weight: 300;
    font-weight: 500;
}
.button.submit:hover {
    background-color: #152733;
}
@media screen and (max-width: 639px) {
    .button.submit {
        display: block;
        position: relative;
        width: 100%;
    }
}
.callout {
    padding: 0rem;
    text-align: left;
    text-transform: uppercase;
    color: #ffffff !important;
    border-radius: 0;
    font-size: 12px;
    font-weight: 500;
    border:none;
}

.alert.callout {
    background-color: transparent; /* rgba(255, 0, 0, 0.3)*/
    border: none;
}

.success.callout {
    background-color: transparent; /*rgba(7, 197, 25, 0.3)*/
}

.is-invalid-input:not(:focus) {
    background-color: rgba(255, 0, 0, 0.3);
}

.is-invalid-input:not(:focus)::-webkit-input-placeholder, .is-invalid-input:not(:focus):-moz-placeholder,
/* Firefox 18- */

.is-invalid-input:not(:focus)::-moz-placeholder,
/* Firefox 19+ */

.is-invalid-input:not(:focus):-ms-input-placeholder {
    color: #fff;
}

@media only screen and ( min-width: 930px ) and ( max-height: 780px ) {

    [type=color],
    [type=date],
    [type=datetime-local],
    [type=datetime],
    [type=email],
    [type=month],
    [type=number],
    [type=password],
    [type=search],
    [type=tel],
    [type=text],
    [type=time],
    [type=url],
    [type=week],
    textarea {
        height: 2.1rem;
    }
    .contact-form textarea {
        min-height: 100px;
    }
}

@media only screen and ( max-width: 930px) {
    .contact-form form>.columns {
        padding-left: 0px;
    }
}