body {
    font-family: Arial, Helvetica, sans-serif;
    background: url('../images/backpic.jpeg') ;
     /* You must set a specified height */
      background-position: center; /* Center the image */
      background-repeat: no-repeat; /* Do not repeat the image */
      background-size: cover;
      height: 600px;
       }
       #header-nav {
      background-color:#203C60  ;
      border-radius: 0;
      border: 0;
    }
    
    
    .navbar-brand {
      padding-top: 5px;
    }
    .navbar-brand h1 {
      font-family: 'Lora', serif;
      color: #557c3e;
      font-size: 3vw;
      text-transform: uppercase;
      text-align:center; 
      font-weight: bold;
      text-shadow: 1px 1px 1px #222;
      margin-top: 20px;
      margin-left: 280px; 
      margin-right: 180px;
      margin-bottom: 0;
      line-height: .75;
    }
    
    .navbar-static-top ul li{
      padding: 5px;
    
    }
    
    .btn{
      float: right;
      margin: 1px;
      padding-left:   15px;
      font-size: 15px;
    }
    
  /*Full-width input fields */
  input[type=text], input[type=password] {
      width: 50%;
      padding: 12px 20px;
      margin: 8px 0;
      display: inline-block;
      border: 1px solid #ccc;
      box-sizing: border-box;
    }

    .container-fluid {
      padding: 16px;
    }
    
    
    /*
    button {
      background-color: #4CAF50;
      color: white;
      padding: 14px 20px;
      margin: 8px 0;
      border: none;
      cursor: pointer;
      width: 80%;
    }
    
    button:hover {
      opacity: 0.8;
    }
    
    /* Extra styles for the cancel button 
    .cancelbtn {
      width: auto;
      padding: 10px 18px;
      margin-left: 10px;
      background-color: #f44336;
    }
    
    
    
    .container-fluid {
      padding: 16px;
    }
    
    span.psw {
      float: right;
      padding-top: 16px;
    }
    
    
    
/* Contact form */
.open-button {
  background-color: #555;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  opacity: 0.8;
  position: fixed;
  bottom: 23px;
  right: 28px;
  width: 280px;
}

/* The popup form - hidden by default */
.form-popup {
  display: none;
  position: fixed;
  bottom: 0;
  right: 15px;
  border: 3px solid #f1f1f1;
  z-index: 9;
}

/* Add styles to the form container */
.form-container {
  max-width: 300px;
  padding: 10px;
  background-color: white;
}

/* Full-width input fields */
.form-container input[type=text], .form-container input[type=password] {
  width: 100%;
  padding: 15px;
  margin: 5px 0 22px 0;
  border: none;
  background: #f1f1f1;
}

/* When the inputs get focus, do something */
.form-container input[type=text]:focus, .form-container input[type=password]:focus {
  background-color: #ddd;
  outline: none;
}

/* Set a style for the submit/login button */
.form-container .btn {
  background-color: #4CAF50;
  color: white;
  padding: 15px 20px;
  border: none;
  cursor: pointer;
  width: 100%;
  margin-bottom:10px;
  opacity: 0.8;
}

/* Add a red background color to the cancel button */
.form-container .cancel {
  background-color: red;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}



  /* FOOTER SECTION */
footer{
  
  background: #2c4762;

}

  .fa {
  padding: 8px;
  font-size: 30px;
  width: 40px;
  text-align: left;
  text-decoration: none;
  margin: 5px 2px;
  border-radius: 50%;
}

.fa:hover {
    opacity: 0.7;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-twitter {
  background: #55ACEE;
  color: white;
}

.fa-google {
  background: #dd4b39;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}



.fa-instagram {
  background: #125688;
  color: white;
}

.fa-envelope-o{
  background: #ffffff;
  color:#FF6347;
}


.footer-copyright{
  color: #ffffff;
  padding-right: 3px;
}

