.form-control {
    background-color: #f0f0f0;
    color: var(--main-dark-blue);
    border: none;
    height: 3.2rem;
}

input[type=submit] {
    background-color: var(--main-green);
}


form {
    margin-bottom: 0;
}

form button, form [type="submit"] {
    background-color: var(--main-dark-blue);
    border: none;
    padding-left: 80px;
    padding-right: 80px;
    border-radius: 50px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 1.3rem;
}

label {
    color: #696868;
    margin-bottom: 0;
}

.form-control:focus {
    background-color: #f0f0f0;
    color: var(--main-dark-blue);
    border: none;
    outline: 0;
    box-shadow: none;
}

.leaveamessage {
    background-color: var(--main-dark-blue);
    width: max-content;
    border-radius: 50px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    /* font-weight: 100; */
    font-size: 1.3rem;
}

.email,
.phoneNumber,
.email a,
.phoneNumber a,
.email a:visited,
.phoneNumber a:visited,
.email:focus,
.phoneNumber:focus {
    color: white;
}



.btn-primary:focus,
.btn-primary.focus {
    box-shadow: none;
    border: none;
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--main-green);
    border: none;
}

.btn-primary:hover {
    color: #fff;
    background-color: var(--main-green);
    border: none;
}

.email figure,
.phoneNumber figure {
    display: inline;
    margin-right: 10px;
}


select {
    background: red;
    border: 1px solid #F0F3FB;
    border-radius: 4px;
    width: 100%;
    padding: 20px;
    font-size: 16px;
    color: #3F3F3F;

    /* Here's the code we need */
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}



.select-wrapper {
    position: relative;
}

.select-wrapper:after {
    font-family: FontAwesome;
    content: '\f107';
    font-size: 2rem;
    position: absolute;
    top: 0px;
    right: 20px;
    color: #434B67;
    pointer-events: none;
}

select option {
    background: #f00;
    color: #fff;
    box-shadow: inset 20px 20px #f00
}

select option:hover {
    color: #000;
    box-shadow: inset 20px 20px #00f;
}

.thanks {
    font-size: 3rem;
    color: var(--main-dark-blue);
    margin-top: 10rem;
    margin-bottom: 10rem;
    margin-left: auto;
    margin-right: auto;
}

@media(max-width: 1023px) {

    .email,
    .phoneNumber {
        display: grid;
        text-align: center;
        margin-bottom: 0;
    }


    .leaveamessage {
        margin-left: auto;
        margin-bottom: 3rem;
    }

    button,
    [type="submit"] {

        margin-right: auto;
    }

}

/* SPINNER */

.spinner {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    background: #00000075;
    /* height: min-content; */
    /* width: auto; */
    z-index: 1;
    display: none;
}

.lds-ellipsis {
    display: inline-block;
    position: absolute;
    width: 80px;
    height: 80px;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    left: 0;
}

.lds-ellipsis div {
    position: absolute;
    top: 33px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #fff;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(24px, 0);
    }
}


/* The container must be positioned relative: */
.customSelect {
    position: relative;
    font-family: Arial;
}

.customSelect select {
    display: none;
    /*hide original SELECT element: */
}

.select-selected {
    /*  background-color: DodgerBlue;*/
}

/* Style the arrow inside the select element: */
.select-selected:after {
    position: absolute;
    content: "";
    top: 14px;
    right: 10px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #fff transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
    border-color: transparent transparent red transparent;
    top: 7px;
}

.select-selected:after {
    border-color: transparent transparent red transparent;
    display: none;
}

/* style the items (options), including the selected item: */
.select-items div,
.select-selected {
    /*color: #ffffff;*/
    color: var(--main-dark-blue);
    padding: 8px 16px;
    /* border: 1px solid transparent;*/
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
}

/* Style items (options): */
.select-items {
    position: absolute;
    /*background-color: DodgerBlue;*/
    background-color: #f0f0f0;

    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
}

/* Hide the items when the select box is closed: */
.select-hide {
    display: none;
}

.select-items div:hover,
.same-as-selected {
    background-color: var(--main-green);
}

.captchamsg {
    display: none;
    color: red;
    font-size: 1rem;
}