@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');

:root {
  --primary-color:#2F2F2F;
  --primary-color-rgba:47, 47, 47;
  --secondary-color:#c9041b;
  --secondary-color-rgba:201, 4, 27;
  --tertiary-color:#BFB8AD;
  --tertiary-color-rgba:191, 184, 173;
  --quaternary-color:#056580;
  --quaternary-color-rgba:5, 101, 128;
  --white:#FFFFFF;
  --white-rgba:255, 255, 255;
  --black:#000000;
  --black-rgba:0, 0, 0;

  --header-font:"Figtree", Arial, Helvetica, sans-serif;
  --body-font:"Figtree", Arial, Helvetica, sans-serif;
}

body,
html {
  background:var(--white);
  margin:0;
  padding:0;
  height:100%;
  width:100%;
	font-weight:450;
  font-family:var(--body-font);
}

div.page-title {
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
  background-color:var(--tertiary-color);
}

body.home div.page-title + div {
  padding:12px 0 12px 0;
}

body.home div.page-title + div p {
  color:var(--secondary-color);
  text-transform:uppercase;
}

body.home div.page-title + div + div {
  background-color:var(--primary-color);
  padding:12px 0 12px 0;
}

footer p {
  font-size:15px;
}

footer div.col-12 > img.img-fluid:first-child {
  max-width:220px !important;
}

body.home div.page-title + div + div p {
  color:var(--white);
}

body.home div.page-title + div + div p strong {
  color:var(--white);
  font-size:40px;
}

header div.col-9 {
  font-size:18px;
  color:var(--primary-color);
  font-weight:400;
}

header div.col-9 span {
  font-size:36px;
  line-height:1em;
  text-transform:uppercase;
  display:block;
  color:var(--secondary-color);
  font-weight:800;
  margin:-6px 0 -5px;
}

header div.col-9 span + em {
font-size:15px;
  line-height:0.9em;
  text-transform:uppercase;
  font-weight:300;
  letter-spacing:3.5px;
}

header div.col-9:hover {
  cursor:pointer;
}

header div.col-3 {
  padding-top:23px;
}

header {
  padding:5px 0 5px 0;
  background-color:var(--white);
}

@media(min-width:992px) {
  header {
    padding:10px 0 10px 0;
  }

  header div.logo {
    padding-top:15px;
  }

  header nav {
    margin-top:20px;
    padding:0;
  }
}

header nav a,
header nav > span {
  display:inline;
  font:18px/1em var(--body-font);
	font-weight:500;
  color:var(--primary-color);
  text-transform:uppercase;
  z-index:10;
}

header nav a:hover,
header nav > span:hover {
  color:var(--secondary-color);
}

header nav a.on {
  color:var(--black);
}

@media(min-width:992px) {
  header nav a + a,
  header nav > a + span,
  header nav > span + a,
  header nav > span + span {
    margin-left:24px;
  }
}

header nav > span {
  position:relative;
  cursor:pointer;
}

header nav > span > span {
  display:none;
  position:absolute;
  top:20px;
  left:-12px;
  width:240px;
  text-align:left;
  padding-top:10px;
}

header nav > span:hover > span {
  display:block;
}

header nav > span > span a {
  display:block;
	font-weight:400;
  background:var(--secondary-color);
  color:var(--white) !important;
  margin:0;
  padding:6px 12px;
}

header nav > span > span a:hover {
  background:var(--primary-color) !important;
}

header nav > a:last-child {
  display:inline-block !important;
	font-weight:600;
  background:var(--quaternary-color);
  color:var(--white);
  font-size:20px;
  padding:8px 12px 8px 12px;
  text-transform:uppercase;
  border-radius:8px;
}

header nav a:last-child:hover {
  background:var(--secondary-color);
}

@media(max-width:991px) {
  header nav {
    width:100%;
    height:100%;
    position:fixed;
    background:rgba(0, 0, 0, 0.85);
    text-align:center;
    top:-101%;
    left:0;
    margin:0;
    overflow:auto;
    transition:all 0.7s;
    z-index:900;
  }

  header nav.on {
    top:0;
    transition:all 0.7s;
  }

  header nav a,
  header nav > span {
    font-size:24px;
    display:block;
    color:var(--white);
    margin:0 0 40px 0;
    font-weight:550;
  }

  header nav > span > span {
    display:block;
    position:relative;
    width:auto;
    text-align:center;
    top:0;
    left:0;
  }

  header nav > span > span a {
    font-size:18px;
    display:block;
    opacity:0.75;
    background:transparent !important;
    margin:10px 0 0 0;
    font-weight:550;
  }

  header nav > a:first-of-type {
    margin:10px 20px 10px 0;
    font-weight:600;
    text-transform:none;
    font-size:34px;
  }
}

header + div#photos {
  background-color:var(--primary-color);
  background-size:cover;
  background-position:center;
  position:relative;
  width:100%;
  overflow:hidden;
}

header + #photos .photo {
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  opacity:0;
  transition:opacity 1.5s ease-in-out;
  z-index:1;
}

header + #photos .photo.active {
  opacity:1;
}

@media(prefers-reduced-motion:reduce)
{
  header + #photos .photo {
    transition:none;
  }
}

header + div#photos {
  height:250px;
}

@media(min-width:768px) {
  header + div#photos {
    height:calc(80vh - 100px);
  }
}

main > div {
  padding-top:60px;
  padding-bottom:60px;
}

div.bg-gray {
  background-color:rgba(var(--tertiary-color-rgba), 0.3);
}

footer {
  background-color:var(--secondary-color);
  padding:25px 0 10px 0;
}

footer * {
  color:var(--white) !important;
}

footer div.col-12.col-md-6:first-child > img.img-fluid {
  max-width:300px;
}

footer + p {
  background-color:var(--primary-color);
  color:var(--white);
  font-size:13px;
  line-height:1em;
  text-align:center;
  padding:12px 5% 10px;
  margin:0;
	font-weight:300;
  letter-spacing:0.5px;
}

footer + p a,
footer + p a:hover {
  color:inherit;
}

img.img-fluid {
  margin-bottom:20px;
}

form input.text {
  padding:8px 0 2px 0;
  color:var(--white);
  font:16px/16px var(--body-font);
  -webkit-appearance:none;
  width:100%;
  border:none;
  border-bottom:1px solid var(--black);
}

@media(min-width:568px) {
  div.three-columns {
    column-count:2;
    column-gap:60px;
  }
}

@media(min-width:992px) {
  div.three-columns {
    column-count:3;
    column-gap:60px;
  }
}

/********************
  Text Styles
********************/

p, li {
  font:18px/1.5em var(--body-font);
  color:var(--black);
  margin:0px 0 1em 0;
}

li {
  margin:0px 0 0.33em 0;
}

header > table p + p {
  margin-top:48px;
}

h1 {
  font:70px/1.3em var(--header-font);
	font-weight:800;
  color:var(--white);
  text-align:center;
  padding:80px 0 80px 0;
  margin:0;
  text-transform:uppercase;
  text-shadow:3px 3px 6px rgba(0, 0, 0, 0.4);
}

@media(max-width:768px) {
  h1 {
    font-size:45px;
    padding-top:40px;
    padding-bottom:40px;
  }
}

h2 {
  font:36px/1.3em var(--body-font);
	font-weight:650;
  color:var(--primary-color);
  margin:1em 0 20px 0;
  text-transform:uppercase;
}

@media(max-width:768px) {
  h2 {
    font-size:34px;
  }
}

main > div.container > div.row > div > h2:first-child {
  margin-top:0;
}

h3 {
  font:24px/1.3em var(--body-font);
	font-weight:650;
  color:var(--secondary-color);
  margin:1em 0 8px 0;
  text-transform:uppercase;
}

h4 {
  font:20px/1.3em var(--body-font);
	font-weight:700;
  color:var(--primary-color);
  margin:1em 0 8px 0;
}

strong {
	font-weight:650;
}

/********************
  Form Styles
********************/

input[type=text] {
  width:100%;
  border-radius:8px;
  border:1px solid var(--tertiary-color);
}

a[href*=tel] {
  white-space:nowrap;
}

/********************
  Link Styles
********************/

a,
a:hover {
  color:var(--quaternary-color);
  text-decoration:none;
  transition:all 0.5s;
}

main a,
footer a {
  text-decoration:underline;
}

a.btn {
  background-color:var(--secondary-color);
  color:var(--white) !important;
  text-decoration:none;
}

a.btn:hover {
  background-color:var(--primary-color) !important;
}

a.btn.lg {
  font-size:18px;
  padding:14px 20px;
}

/********************
  Bootstrap Override Styles
********************/

.row {
  margin-left:-30px;
  margin-right:-30px;
}

.container, .col, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9 {
  padding-left:30px;
  padding-right:30px;
}

.row.thin-padding {
  margin-left:-15px;
  margin-right:-15px;
}

.row.thin-padding .col-lg-1, .row.thin-padding .col-lg-10, .row.thin-padding .col-lg-11, .row.thin-padding .col-lg-12, .row.thin-padding .col-lg-2, .row.thin-padding .col-lg-3, .row.thin-padding .col-lg-4, .row.thin-padding .col-lg-5, .row.thin-padding .col-lg-6, .row.thin-padding .col-lg-7, .row.thin-padding .col-lg-8, .row.thin-padding .col-lg-9, .row.thin-padding .col-md-1, .row.thin-padding .col-md-10, .row.thin-padding .col-md-11, .row.thin-padding .col-md-12, .row.thin-padding .col-md-2, .row.thin-padding .col-md-3, .row.thin-padding .col-md-4, .row.thin-padding .col-md-5, .row.thin-padding .col-md-6, .row.thin-padding .col-md-7, .row.thin-padding .col-md-8, .row.thin-padding .col-md-9, .row.thin-padding .col-sm-1, .row.thin-padding .col-sm-10, .row.thin-padding .col-sm-11, .row.thin-padding .col-sm-12, .row.thin-padding .col-sm-2, .row.thin-padding .col-sm-3, .row.thin-padding .col-sm-4, .row.thin-padding .col-sm-5, .row.thin-padding .col-sm-6, .row.thin-padding .col-sm-7, .row.thin-padding .col-sm-8, .row.thin-padding .col-sm-9, .row.thin-padding .col-1, .row.thin-padding .col-10, .row.thin-padding .col-11, .row.thin-padding .col-12, .row.thin-padding .col-2, .row.thin-padding .col-3, .row.thin-padding .col-4, .row.thin-padding .col-5, .row.thin-padding .col-6, .row.thin-padding .col-7, .row.thin-padding .col-8, .row.thin-padding .col-9 {
  padding-left:15px;
  padding-right:15px;
}

/********************
  Responsive Styles
********************/

@media (max-width:576px) {
  img.img-fluid {
    margin-bottom:0;
  }
}

@media (max-width:768px) {}

@media (max-width:992px) {}

@media (min-width:1200px) {
  div.container {
    max-width:1340px;
  }
}
