body {
    height: 100%;
    font-family: 'Source Sans Pro', sans-serif;
    background-image: url("/img/Background.jpg");
    background-color: #B6010A;
    background-position: top; /* Centertop: 0px; left: 0px; position:absolute; the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

footer {
    position: fixed;
    bottom: 0;
    color: #ffffff;
    width: 100%;
    height: 5rem;            /* Footer height */
    font-size: 11px;
    background-color: #363636;
}

@media only screen and (min-width:480px) and (max-width:767px) {
    .modal-content {
        margin: 25px 70px;
    }
}

@media only screen and (max-width:479px)  {
    .modal-content {
        width: 90%;
    }
}

#page-container {
  position: relative;
  min-height: 100vh;
}
#content-wrap {
  overflow: hidden; 
  padding-bottom: 5rem;    
  /* Footer height */
}

#navbarToggleExternalContent {
    top: 0px; 
    left: 0px; 
    position: absolute;
    width: 400px;
    z-index:99;
}

.navSideBar {
    position: fixed; 
    height: 100%;
}

.text-sub-header {
    color: #ffffff;
    font-size: 14px;
    font-weight: 400;
}

.text-sub-header2 {
    color: #ffffff;
    font-size: 24px;
    font-weight: 700;
}

.text-button {
    color: #000000;
    font-size: 24px;
    font-weight: 800;
}

.button-image {
    position: relative;
    text-align: center;
    color: white;
  }
  
  /* Bottom left text */
  .bottom-left {
    position: absolute;
    bottom: 8px;
    left: 16px;
  }
  
  /* Top left text */
  .top-left {
    position: absolute;
    top: 8px;
    left: 16px;
  }
  
  /* Top right text */
  .top-right {
    position: absolute;
    top: 8px;
    right: 16px;
  }
  
  /* Bottom right text */
  .bottom-right {
    position: absolute;
    bottom: 8px;
    right: 16px;
  }
  
  /* Centered text */
  .centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

.navbar {
    /*   z-index should be above .close-navbar-toggler */
      z-index:2;
    }
    .close-navbar-toggler{
      position:absolute;
      top:0;
      left:0;
      height:100%;
      width:100%;
      z-index:1;
      cursor:pointer;
    }
    .close-navbar-toggler.collapsed{
      z-index:-1;
    }

.modal {
    z-index: 1;
  }
  
  .modal-dialog {
    margin-top: 120px;
  }
  
  .modal-header, .modal-body {
    padding: 0px;
  }
  
  .modal {
    z-index: 99999;
  }
  
  .modal-header {
    min-height: 100%;
    border: 0px;
  }
  .modal-header .close {
    margin-top: -2px;
    position: absolute;
    top: -22px;
    right: 0px;
    opacity: 1;
    color: #aeaeae;
  }
  .modal-header .close:hover {
    color: #bfa67a;
  }
  
  .modal-content {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    border-radius: 0px;
    background: transparent;
  }
  
  .vertical-alignment-helper {
      display:table;
      height: 100%;
      width: 100%;
  }
  .vertical-align-center {
      /* To center vertically */
      display: table-cell;
      vertical-align: middle;
  }
  .modal-content {
      /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
      width:inherit;
      height:inherit;
      /* To center horizontally */
      margin: 0 auto;
  }
  .navbar-toggler-icon {
    background-image: url(/img/menu-icon.png) !important;
  }

.btn-danger {
    background-color: #e60000;
}

.btn-outline-danger {
    color: #fff;
    border-color: #fff;
}

.btn-rounder-c {
    background-color: #E44D4C;
    border: 4px solid #fff;
    border-radius: 40px;
    width: 300px;
}