body {
   background-image: url('/img/bg.png') ;
   font-family: Helvetica, sans-serif;
   color: white;
}

a {
   color: rgb(211, 0, 0);
}

/* custom hero */
.hero-image {
   /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
   background-image: url("/img/onstairshero.jpg");
   
   /* Set a specific height */
   height: 200px;
   
   /* Position and center the image to scale nicely on all screens */
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   position: relative;
}

.red-separator {
   background-color: rgb(181, 0, 0);
   height: 5px;
}

.separator {
   height: 1em;
}

.contact-container {
   background-color: rgb(96, 4, 4);
   padding-top: 2em;
   padding-bottom: 2em;
}

.contact-container h1{
   text-align: center;
}

@media screen and (max-width: 480px) {
   input {
      font-size: 0.60em;
   }

   textarea {
      font-size: 0.60em;
   }
}

.contact-form input[type=text],  .contact-form input[type=email] {
   padding: 1em;
   border-radius: 15px;
   border: none;
   width: 100%;
}

.contact-form textarea {
   padding: 1em;
   border-radius: 15px;
   border: none;
   width: 100%;
}

.contact-form input[type=submit] {
   text-transform: uppercase;
   text-align: center;
   border: 2px solid white;
   border-radius: 15px;
   padding: 0.5em;
   width: 100%;
   background-color: transparent;
   color: white;
   font-weight: 700;
}

.about-container {
   background-color: rgb(26, 26, 26);
   padding-top: 2em;
   padding-bottom: 2em;
}

/* Index specific styles*/
.card-container {
   padding: 3em;
}

.top-bottom-padding {
   padding-top: 2em;
   padding-bottom: 2em;
}

.card-container a, .card-container a:link, .card-container a:visited, .card-container a:hover, .card-container a:active{
   text-decoration: none;
}

.service-title {
   text-transform: uppercase;
   color: rgb(211, 0, 0);
   text-align: center;
   font-size: 1.5em;
   font-weight: bolder;
   padding-top: 1.5em;
   /*padding-bottom: 1.5em;*/
}

.service-summary {
   text-align: center;
   font-size: large;
   padding-top: 1.5em;
   padding-bottom: 1.5em;
}

.service-button {
   text-transform: uppercase;
   color: rgb(181, 0, 0);
   border: solid 4px;
   padding: 0.8em;
   text-align: center;
   cursor: pointer;
   border-radius: 15px;
   font-family: Helvetica;
   font-weight: bold;
   padding-top: 1.5em;
   padding-bottom: 1.5em;
}

/* Custom bootstrap */
.navbar-toggler-custom {
   border: none;
}

.navbar-toggler-custom:focus {
   box-shadow: none;
}

.navbar-toggler-icon-custom {
   background-image: url("/img/hamburger.svg");
}

.nav-custom {
   background-color: rgb(181, 0, 0);
   color: white;
   padding: 1em;
}

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