body {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  letter-spacing: 0.12em;
  word-spacing: 0.16em;
}
header {margin-bottom: 90px;}
footer nav {background-color: #75bfb8;}
footer a {font-weight: 600;}
.nav-link:hover {color: #fff}
.nav-link.disabled {color: #3d3d3d;}
#tagLine {font-weight: 500; z-index: 3;}
.calendly-badge-widget {bottom: 20%;}
h1 {
    font-weight: 200;
}
h2 {
    font-weight: 400;
    margin-bottom: 30px;
}
h3 {
    font-weight: 500;
    font-style: italic;
    margin-bottom: 40px;
}
h4 {
    font-weight: 600;
    letter-spacing: 4px;
    word-spacing: 7px;
    margin-bottom: 21px;
}
p {
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 28px;
}
ul {padding-left: 2px;}
ul li, ol li {font-weight: 500;
    font-size: 14px;
    line-height: 21px;
}
ol li {margin-bottom: 14px;}
.picLogo {fill: #3d3d3d;}
.btn-primary, .btn-primary:focus {
    background-color: #025851;
    color: #75bfb8;
    font-weight: 500;
    border: 3px solid #025851;
}
.btn-primary:hover {
    background-color: #75bfb8;
    color: #025851;
    font-weight: 500;
    border: 3px solid #025851;
}
/* Nav Bars -----------------------------------------------------------------------------------------------------*/
#yellowNav {
    background-color: #f29f05;
    border-bottom: 1px solid #fff;
}
#yellowNav a {color: #373c40;}
#yellowNav .navbar-brand {font-weight: 500;}
/* White Background ----------------------------------------------------------------------------------------*/
.white {
    background-color: #fff;
}
.white h1 {
    color: #3d3d3d;
}
.white h2 {
    color: #f25c05;
}
.white h3 {
    color: #025951;
}
.white h4 {
    color: #732002;
}
/* Yellow Background ----------------------------------------------------------------------------------------*/
.yellow {
    background-color: #f29f05;
}
.yellow h2 {
    color: #400101;
}
.yellow h3 {
    color: #373c40;
}
.yellow h4 {font-weight: 400;}
.yellow p {
    color: #010326;
}
.yellow a {
    text-decoration: underline ;
}


/* Mauve Background ---------------------------------------------------------------------------------------------*/
.mauve {
    background-color: #732002;
}
.mauve h3 {
    color: #04bfbf;
}
.mauve p, .mauve li {
    color: #d0f2f2;
}

/* Dark Grey Background -------------------------------------------------------------------------------------------*/
.dGrey {
    background-color: #0d0000;
}
.dGrey h2 {color: #fff;}
.dGrey h3 {color: #f29f05;}
.dGrey p, .dGrey li {color: #04bfbf;}

/* Light Turquoise Background -------------------------------------------------------------------------------------*/
.lTurq {
    background-color: #75bfb8;
}
.lTurq h2 {
    color: #0d0000;
}
/* POLICES ===============================================================================*/
#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 70px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #333; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 9pt; /* Increase font size */
}

#myBtn:hover {
  background-color: #fab71e; color: #3e3e3e; font-weight: 600; /* Add a dark-grey background on hover */
}
/* MEDIA QUERIES =====================================================================================*/
/*/ `xs` returns only a ruleset and no media query*/

/*`sm` applies to x-small devices (portrait phones, less than 576px)*/
@media only screen
and (max-width: 575.98px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {
    #tagLine {font-size: 2.4em; margin-top: -15%;}
    h3 {font-size: 2em;}
    h4 {font-size: 0.88em;}
    #services {margin-top: 0px;}
    p{font-size: 14px; line-height: 21px;}
    ul li, ol li {font-size: 18px; line-height: 27px;}
    
}

/* `md` applies to small devices (landscape phones, less than 768px) */
@media only screen 
and (min-width: 575.99px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) {
    #tagLine {font-size: 2.7em; margin-top: -8%;}
    
}

/*/ `lg` applies to medium devices (tablets, less than 992px)*/
@media only screen 
and (min-width: 767.99px)
and (-webkit-min-device-pixel-ratio: 2) {
    #tagLine {font-size: 4em; margin-top: -7%;}
    h3 {font-size: 3em;}
 }

/*/ `xl` applies to large devices (desktops, less than 1200px) */
@media only screen 
and (min-width: 991.99px) {
    #tagLine {font-size: 3.3em; margin-top: -7%;}
}

/*/ `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media only screen 
and (min-width: 1199.99px)
and (-webkit-min-device-pixel-ratio: 1) {
    #tagLine {font-size: 4em; margin-top: -7%;}
    h2 {font-size: 3em;}
    h3 {font-size: 2em;}
    h4 {font-size: 1.4em;}
}