@charset "utf-8";

 /* Kevin Original Styles */



 /* Sallie added Styles */


.header{
  background-color: #293241;
 margin-bottom: -100px;
}


.logo {
float:left;
width:120px;
margin-left: auto;
margin-right: auto;
display: inline-block;

}

.modules{
  background-color: #293241;
  text-align: center;
  overflow: auto;
  padding-top:10px;
  padding-bottom: 10px;
}

.menubutton {
  text-align: center; 
  color: white;
  background-color: #293241;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  overflow: hidden;
  display: inline-block;
  vertical-align: top; 
  border-radius: .5rem;
   cursor: pointer;
}

.menubutton:hover
{
   background-color: #ee6c4d;
   color: #e0fbfc;
}

.headerimg{
background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("richmondoverview.jpg");
height: 50%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
}

.headertext {
 
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  
}

.headertext button {
  margin-top: 30px;
  margin-bottom: 30px;
  border: none;
  outline: 0;
  display: inline-block;
  padding: 10px 25px;
  color: white;
  background-color: #ee6c4d;
  text-align: center;
  cursor: pointer;
  border-radius: .5rem;
  cursor: pointer;
  font-size: 17px;
}

.headertext button:hover {
  background-color: #e0fbfc;
  color: #293241;
    
}

.headertext h1 {
  margin-top: 15px;
  margin-bottom: 15px;
  font-family: 'Abril Fatface';
  color: white;
  text-align: center;
  font-size: 50px;
  text-shadow: 2px 2px 4px #000000;
}

.headertext h4 {
  font-family: 'Montserrat';    
  color: white;
  text-align: center;
  font-size: 20px;
  text-shadow: 2px 2px 4px #000000;
  line-height: 1.6;
}

.visionheaderimg{
background-image: url("veteran.jpg");
height: 50%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
}

.objectivesheaderimg{
background-image: url("objectives.jpg");
height: 50%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
}


.blurheaderimg{
background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("richmondoverview.jpg");
height: 50%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
filter: blur(2px);
  -webkit-filter: blur(2px);
}

.address{
background-color: #8a716a;

}



/* Styles for Foundations page */


.row {
  display: flex;
}

.column {
  flex: 30%;
  padding: 5px;
}
.php {
  padding-top: 50px;
  padding-bottom: 50px;
  text-align: center;
 background-color: #8a716a;
} 
.phpconfig{
 
  color: white;
 font-size: 50px;
}

/* Styles for About page */


.about{

 padding-top: 20px;
  padding-bottom: 20px;
  color: #293241;
 font-size: 15px;
  margin-left: 30px;
  margin-right: 30px;
  line-height: 1.6;
}

.missionstatement{

 padding-top: 20px;
  padding-bottom: 20px;
  color: #293241;
 font-size: 15px;
  margin-left: 30px;
  margin-right: 30px;
  line-height: 1.6;
  text-align: center;
}

.footer{

padding-top: 5px;
padding-bottom: 5px;
font-size: 13px;
overflow: auto;
line-height: 1.6;    
color: white;
background-color:#293241;
left: 0;
bottom: 0;
width: 100%;

}


/* Styles for forms and set up */

:root{
   --bg-color:#eee;
   --dark-bg:rgba(0,0,0,.7);
   --box-shadow:0 .5rem 1rem rgba(0,0,0,.1);
   --border:.1rem solid #999;
}

*{
   font-family: 'Montserrat';        
   margin:0; padding:0;
   box-sizing: border-box;
   outline: none; border:none;
   text-decoration: none;
   
}


html{
   font-size: 62.5%;
   overflow-x: hidden;
}

.container{
   max-width: 1200px;
   margin:0 auto;
   /* padding-bottom: 5rem; */
}

section{
   padding:2rem;
}

.heading{
   text-align: center;
   font-size: 3.5rem;
   color:var(--black);
   margin-bottom: 2rem;
}

.btn{
   display: block;
   width: 100%;
   text-align: center;
   background-color: #3d5a80;
   color:white;
   font-size: 1.7rem;
   padding:1.2rem 3rem;
   border-radius: .5rem;
   cursor: pointer;
   margin-top: 1rem;
}

.btn:hover{
   background-color: #ee6c4d;
}



#menu-btn{
   margin-left: 2rem;
   font-size: 3rem;
   cursor: pointer;
   color:white;
   display: none;
}

.add-product-form{
   max-width: 50rem;
   background-color: var(--bg-color);
   border-radius: .5rem;
   padding:2rem;
   margin:0 auto;
   margin-top: 2rem;
}

.add-product-form h3{
   font-size: 2.5rem;
   margin-bottom: 1rem;
   color:black;

   text-align: center;
}
.add-product-form h4{
   font-size: 2rem;
   margin-bottom: 1rem;
   color:black;
   text-align: center;
}
.add-product-form p{
   font-size: 1.7rem;
   margin-bottom: 1rem;
   color:black;
   text-align: center;
}
.add-product-form .box{
   text-transform: none;
   padding:1.2rem 1.4rem;
   font-size: 1.7rem;
   color:black;
   border-radius: .5rem;
   background-color: white;
   margin:1rem 0;
   width: 100%;
}