@import url(subpagesLeft.css);
@import url(subpagesAll.css);
/*colour block left*/
.headingHolder h1 {
    background-color: var(--contact);
}
iframe {
    max-width: 100%;
}
h2 {
    color: var(--contact);
}
form.easyContactForm {
    margin-top: 3rem;
}
.fa-user:before {
    content: "\f007";
}
.fa-envelope:before {
    content: "\f0e0";
}
.fa-info:before {
    content: "\f129";
}
.fa-comment:before {
    content: "\f075";
}
.btn-contact,
.btn-remove-contact {
    line-height: 14px !important;
    background-color: #182227;
    color: #ccc;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2);
    transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    cursor: pointer;
}
.easyContactSend,
.easyContactSendNot {
    position: fixed;
    text-align: center;
    color: var(--neutralLight);
    z-index: 10000;
    top: 0;
    right: 0;
    bottom: 0;
    font-size: 2rem;
    width: 24rem;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    background-color: var(--contactlementary);
}
.easyContactSendNot {
    background: var(--neutralDark);
}
.pairs {
    display: grid;
    grid-template-columns: 1fr 3fr;
}
input,
textarea {
    border: 1px solid var(--about);
    padding: 1rem;
    margin-bottom: 2rem;
}
textarea {
    height: 10rem;
    font-family: body;
}
.fa {
    font-size: 1.2rem;
    font-family: body;
}
.fa::before {
    color: var(--referral);
    font-size: 2rem;
    margin-right: 1.5rem;
    font-family: FontAwesome;
}
#submit {
    width: auto;
    height: auto;
    padding: 1rem;
    background-color: var(--contact);
    color: var(--neutralLight);
    font-size: 1.2rem;
    border: none;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .5);
    transition: .3s;
}
#submit:hover {
    opacity: .7;
    cursor: pointer;
}
.privacy-div {
    display: none;
}
#load .btn-contact,
#load .btn-remove-contact {
    line-height: 14px !important;
    background-color: #182227;
    color: #ccc;
    font-weight: bold;
    text-decoration: none;
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2);
    transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    cursor: pointer;
}
#load .easyContactForm input,
#load .easyContactForm textarea {
    width: 100%;
    border-radius: 5px;
    margin: 10px 0;
    padding: 10px;
    border: solid 1px rgba(0, 0, 0, 0.3);
}
#load .easyContactSend {
    position: fixed;
    bottom: 20px;
    left: 5%;
    padding: 10px;
    background: #506d2a;
    width: 90%;
    text-align: center;
    color: #fff;
    box-sizing: border-box;
    border-radius: 5px;
    z-index: 10000;
}
#load .easyContactSendNot {
    position: fixed;
    bottom: 20px;
    left: 5%;
    padding: 10px;
    background: red;
    width: 90%;
    text-align: center;
    color: #fff;
    box-sizing: border-box;
    border-radius: 5px;
    z-index: 10000;
}
@media only screen and (max-width: 1320px) {
    section,
    article>section {
        width: 95%;
    }
}
@media only screen and (max-width: 1170px) {
    main {
        padding: 0;
    }
    section {
        padding: 0;
    }
}
@media only screen and (max-width: 1115px) {
    section {
        display: block;
    }
}
@media only screen and (max-width: 1100px) {
    form {
        width: 95%;
    }
}
@media only screen and (max-width: 700px) {
    .easyContactForm {
         padding-right: 0; 
    }
    form {
        width: 100%;
    }
    .pairs {
        display: block;
    }
    label, 
    input, 
    textarea {
        display: table-row;
        width: 100%;
    }
}
@media only screen and (max-width: 615px) {
    textarea {
        width: 99%;
    }
}