:root {
    /**
    @font family declaration
    */
    --tp-ff-body: 'OpenSans', sans-serif;
    --tp-ff-heading: 'Bondie Regular', sans-serif;
    --tp-ff-p: 'Bondie Regular', sans-serif;
    --tp-ff-fontawesome: "Font Awesome 5 Pro";
    /*
    @color declaration
    */
    --tp-common-white: #ffffff;
    --tp-common-black: #070707;
    --tp-common-dark: #0b0b0b;
    --tp-common-primary: #d4a27e;
    --tp-heading-primary: #070707;
    --tp-theme-main-bg: rgb(182, 215, 228);
    --tp-theme-nav-text-dark: #d4a27e;
    --tp-theme-nav-text-dark-hover: #ddb19d;
    --tp-theme-nav-text-light: red;
    --tp-theme-nav-bg-dark: black;
    --tp-theme-nav-bg-light:white;
    --tp-grey-1: #414042;
    --tp-grey-2: #6d6e71;
    --tp-text-body: #000;
    --tp-text-1: #000;
    --tp-theme-bg: #f8fcfc;
    --tp-theme-bg-2: #f6f6f6;
    --tp-theme-bg-3: #f8fbff;
    --tp-theme-bg-4: #d3dbdf;
    --tp-theme-bg-5: #eef4f7;
    --tp-theme-bg-6: #f7f7f7;
    --tp-theme-bg-7: #f2f5f7;
    --tp-theme-bg-8: #e5eaee;
    --tp-theme-bg-9: #ecf8ff;
    --tp-border-1: #e6e6e6;
    --tp-border-2: #dce9e9;
    --tp-border-3: #ececec;
    --tp-border-4: #efefef;
    --tp-border-5: #f0f0f0;
    --tp-border-6: #f3f3f3;
    --tp-border-7: #e4e4e4;
    --tp-border-8: #ededed;
    --tp-border-9: #f0f0f0;
    --tp-border-10: #1c1c1c;
    --tp-border-11: #ebebeb;
    --tp-border-12: #e7e7e7;

}

@media only screen and (max-width: 600px) {
    .navbar-dark .navbar-nav .nav-link {
        font-size: 26px;
    }
    .navbar-dark .navbar {
        align-items: center;
    }
    h2 {
        font-size: 24px;
    }
    /*.hero {
        background-image: url('../../assets/img/about/mm_headshot.jpg');
            height: 100vh;
            opacity: 0.6;
            z-index: 1;
            background: black;
    }*/
    .card-body h3 {
        font-size: 36px;
    }
    .card-text {
        font-size: 20px;
    }
    h3 {
        font-size: 36px !important;
    }
}
@font-face {
    font-family: "Bondie Regular";
    src: url("../fonts/Bondie-Regular.otf") format("opentype");
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--tp-ff-body);
}

main {
    background-color: rgb(182, 215, 228);
}

h1, h2, h3, h4, h5 {
    font-family: var(--tp-ff-heading);
}

h3 {
    font-size: 36px;
}
footer a {
    color: var(--tp-common-primary);
    text-decoration: none;
    font-family: var(--tp-ff-heading);
    font-size: 32px;
    
    &:hover {
        color: var(--tp-common-primary);
        text-decoration: none;
    }
}
.h1-secondary {
    line-height: 1;
    font-size: 34px;
    font-family: var(--tp-ff-heading);
}
.navbar-dark .navbar-nav .nav-link {
    color: var(--tp-common-primary);
    font-size: 40px;
    font-family: var(--tp-ff-heading);
    display: block;
    padding-left: 60px;

    &:hover {
        color: var(--tp-theme-nav-text-dark-hover);
        text-decoration: underline;
    }
}

.featured:hover {
        box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.bookacall button {
  background-color: rgb(240, 232, 178);
  color:rgb(55,70,134);
  box-shadow: rgba(149, 157, 165, 0.9) 0px 8px 24px;
  margin-top: 20px;

  &:hover {
    background-color:rgb(176, 62, 62);
    color: rgb(255,255,255);
  }
}

.newsletter-signup button {
    background-color: rgb(240,232,178);
    
    &:hover {
        background-color:rgb(176, 62, 62)
    }
}

#contactForm form input {
    height: 45px;
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    font-size: 16px;
    border: 2px solid var(--tp-border-8);
    border-radius: 8px;
    margin-bottom: 5px;
}
#contactForm form input::-webkit-input-placeholder {
    color: var(--tp-grey-1);
}
#contactForm form input:-moz-placeholder {
    color: var(--tp-grey-1);
}
#contactForm form input::-moz-placeholder {
    color: var(--tp-grey-1);
}
#contactForm form input:-ms-input-placeholder {
    color: var(--tp-grey-1);
}
#contactForm form button {
    position: relative;
    top: 50%;
    font-size: 16px;
    font-weight: 700;
    color: rgb(255,255,255);
    border-radius: 8px;
}
#contactForm form button:hover {
    color: var(--tp-theme-mandalay);
}
#contactForm form textarea {
    border: 2px solid var(--tp-border-8);
    border-radius: 8px;
    width: 100%;
    height:80px;
    padding-left: 10px;
    padding-right: 10px;
}
#contactForm form textarea::-webkit-input-placeholder {
    color: var(--tp-grey-1);
}
#contactForm form textarea:-moz-placeholder {
    color: var(--tp-grey-1);
}
#contactForm form textarea::-moz-placeholder {
    color: var(--tp-grey-1);
}
#contactForm form textarea:-ms-input-placeholder {
    color: var(--tp-grey-1);
}