/* Sticky footer styles
-------------------------------------------------- */


@font-face {
  font-family:'saira';
  src: url('fonts/saira-VariableFont_wdth_wght.ttf') format('truetype');,
  src: url('fonts/saira-italic-VariableFont_wdth_wght.ttf') format('truetype');
}



html {
  position: relative;
  min-height: 100%;
  font-family:'saira' !important;
  background-color: #000000 !important;
}
body {
  /* Margin bottom by footer height */
  font-family:'saira' !important;
  margin-bottom: 60px;
  color: black !important;
  background-color: #000000 !important;
}

.text-color {
      color: #0277fc;
}


.footer {
  position: absolute;
  bottom: 2%;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  line-height: 60px; /* Vertically center the text there */
  background-color: #000000;
}

.black {
    background-color: #000000 !important;
    color: white !important;
}

.navbar-expand-md {
      color: white !important;
      background-color: #ffffff !important;
}

.navbar-toggler {
      color: white !important;
      background-color: #ffffff !important;
}

/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */

body > .container {
  padding: 60px 15px 0;
  background-color: #000000 !important;
}
/* sets background for NAV bar */
.bg-yellow {
  font-size: 1.6em !important;
  color: black !important;
  background-color: #fcf005 !important;
}

.bg-dark {
  font-size: 1.6em !important;
  color: white !important;
  background-color: #000000 !important;
}


.nav-link {
    color: white !important;
}

.nav-link:hover {
    color: grey !important;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

code {
  font-size: 80%;
}

.responsive-image {
  position: relative;
  width: 100%;
  background-size: 100% 100%;
  z-index: 99;
}


.responsive-logo {
  position: relative;
  width: 100%;
  background-size: 100% 100%;
  z-index: 99;
}

.responsive-logo2 {
  position: relative;
  width: 70%;
  background-size: 100% 100%;
  z-index: 99;
}

.btn {
  font-size: 2em;
}

.emailbutton {
  font-size:2em;
}

.footertext {
  font-size: 1.5em;

}




.saira {
font-family:'saira' !important;
}

p {
font-family:'saira' !important;
}

.navbar {
font-family:'saira' !important;
}

.button {
font-family:'saira' !important;
}

.btn {
font-family:'saira' !important;
}

.modal {
font-family:'saira' !important;
}

.formspacing {
margin-top: 2%;

}

.modal-dialog {
  max-width: 90% !important;
  margin: 0 0 0 6% !important;
}

a:hover img {
 opacity:0.5;
}



.addr {
  font-size: 5em !important;
}


.bannertxt1 {
  font-size: 5em !important;
  padding-top: 2%;

}

.bannertxt2 {
    font-size: 3em !important;

}




/* RESPONSIVE CSS
-------------------------------------------------- */

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (max-width: 1200px) {

        .addr {
          font-size: 3em !important;
        }


        .bannertxt1 {
          font-size: 4.5em !important;

        }

        .bannertxt2 {
            font-size: 3em !important;

        }


}


/* Large devices (laptops/desktops, 992px) */
@media (max-width: 992px) {

        .emailbutton {
          font-size:1.5em;
        }

        .addr {
          font-size: 2em !important;
        }


        .bannertxt1 {
          font-size: 3em !important;

        }

        .bannertxt2 {
            font-size: 2em !important;

        }

}



@media (max-width: 768px) {

        .responsive-logo {
          position: relative;
          width: 100%;
          background-size: 100% 100%;
          z-index: 99;
        }

        .btn {
          font-size:1.2em;
        }

        .emailbutton {
          font-size:1.5em;
        }

        .footertext {
          font-size: 1.2em;

        }

        .addr {
          font-size: 1.5em !important;
        }


        .bannertxt1 {
          font-size: 3em !important;

        }

        .bannertxt2 {
            font-size: 2em !important;

        }


}

@media (max-width: 600px) {

        .footertext {
          font-size: 1.0em;
        }

        .emailbutton {
          font-size:1.5em;
        }


        .addr {
          font-size: 1.5em !important;
        }


        .bannertxt1 {
          font-size: 2.5em !important;

        }

        .bannertxt2 {
            font-size: 1.5em !important;

        }

}



@media (max-width: 500px) {

        .responsive-logo {
          position: relative;
          width: 100%;
          background-size: 100% 100%;
          z-index: 99;
        }

        .btn {
          font-size: 1.5em;
        }

        .emailbutton {
          font-size:1.5em;
        }

        .footertext {
          font-size: 1.0em;

        }

        .addr {
          font-size: 1.3em !important;
        }


        .bannertxt1 {
          font-size: 2.0em !important;

        }

        .bannertxt2 {
            font-size: 1.7em !important;

        }


}

@media (max-width: 400px) {

        .responsive-logo {
          position: relative;
          width: 100%;
          background-size: 100% 100%;
          z-index: 99;
        }

        .btn {
          font-size:1.8em;
        }

        .footertext {
          font-size: 0.8em;
        }  

        .emailbutton {
          font-size:1.0em;
        }

        .addr {
          font-size: 1em !important;
        }


        .bannertxt1 {
          font-size: 1.5em !important;

        }

        .bannertxt2 {
            font-size: 1.0em !important;

        }


}