/*!
 * Start Bootstrap - The Big Picture (https://startbootstrap.com/template-overviews/the-big-picture)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-the-big-picture/blob/master/LICENSE)
 */
body {
  background: url('../img/landing2.jpg') no-repeat center center fixed;;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;
}


.navbar-dark .navbar-nav a.nav-link,
a{
  color: #FFF;
  text-decoration: none;
  opacity: .75;
  transition: .45s;
}

a:hover{
   opacity: 1;
   text-decoration: none;
   color: #FFF;
}

a.cta{
   font-weight: 500;
}

.title--404{
    color: #fff;
    margin: 3rem 0 0 0;
}

h2.title--secondary{
 font-weight: 200;
 margin: 1.75rem 0 0 0; 
 color: #cecccc;
}
.title--secondary.map__subtitle{
   color: #eaeaea;
   margin-bottom: 1rem;
}


ul.work__days{
  font-size: 1.25rem;
}
.location__flag{
    font-size: 4rem;
    color: #901422;
}

#content-area{
   margin-top: 2rem;
}

.main-section::before{
  content: '';
  display: block;
  
  background-image: linear-gradient(to top,transparent 40%,rgba(0,0,0,.55) 80%);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
}
.map-container{
   margin: 2rem 0 0 0;
}

.main-section .copy-container{
  color: #FFF;
}

.map-area{
  overflow: hidden;
  max-height: 75vh;
}
.map-area img{
  width: 100%;
}

.contacts-container, .main-body{
  color: #FFF;
  background-color: rgba(1,1,1, .35);
  height: 92vh;
}

.contacts-container hr{
  border-top: 1px solid rgba(225,225,225, .35);
}

.map-container{
  color: #FFF;
}

body nav.fixed-bottom{
  top: 0;
  bottom: unset;
}

section.main-section{
  margin-top: 3rem;
}

.logo-container{
    position: fixed;
    right: 10%;
    bottom: 5%;
}

.logo-container img{
    max-width: 200px;
    border-radius: 50%;
    border: 2px solid #4c1e1e;
    -webkit-box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 25px 5px rgba(0, 0, 0, 0.75);
}

.main-body__logo-container{
    padding: 2rem;
    background-color: #FFF;
    margin: 2rem 0;
    border-radius: 3px;
}
img.main-body__logo-container__logo{
   max-width: 100px;
   margin: 0 0 1rem 0;
}


@media screen and (max-width:768px){
  .main-section::before{
       background-image: linear-gradient(to top,transparent 15%,rgba(0,0,0,.65) 80%);
   }
  .logo-container img{
       max-width: 90px;
   }
   h2.title--secondary{
      font-weight: 300;
   }
   .title--secondary.map__subtitle{
      color: #FFF;
      font-weight: 300;
   }
   .contacts-container, .main-body{
     height: 100vh;
   }

}