@charset "UTF-8";
/* CSS Document */
body {
  margin: 0px; /* always zero out default browser margins and padding */
  padding: 0px;
  font-family: 'Montserrat', sans-serif !important;
}
p {
  font-size: 18px;
  margin-bottom: 20px;
  line-height: 1.5em;
}

span{
  font-size: 18px;
}

h1 {
  padding-top: 100px;
  font-size: 35px;
}
h2 {
  font-size: 30px;
}
h3{
  font-size: 18px;
  font-weight: bold;
}
.smallfont{
  font-size: 16px;
}
a{
	font-size: 20px;
	text-decoration: none;
}
a:hover {
	text-decoration: none !important;
  /* color:black !important; */
}
table{
  text-align: center;
  padding: 30px 0px 40px 0px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 35px;
  border-spacing: 20px;
}
th{
  color:#4e74c7;
  font-size: 20px;
}
td{
  padding: 15px;
  line-height: 35px;
  font-size: 18px;
}
ol li{
  font-size: 19px;
}
.container {
  width: 80%; 
  margin: 0 auto;
  overflow: hidden;
}
.container-75 {
  width: 75%; 
  margin: 0 auto;
  overflow: hidden;
}
.container-flex {
  width: 80%; 
  margin: 0 auto;
  display:flex; 
  flex-wrap:wrap;
}

/* Used by project preview photos */
.container img {
  margin:auto;
  display: block;
  max-width: 80%; /* Ensure the image doesn't exceed the container's width */
  height: auto; /* Maintain the image's aspect ratio */
}
/* For small screens */
@media (max-width: 768px) {
  .container {
    grid-template-columns: 1fr;  /* Make elements stack on small screens */
  }
}
.white{
  color:white;
}
.grey{
  color:#808080;
}
.blue{
  color:#4e74c7;
}

@media (min-width: 800px) {
  .row-to-column{
    display:flex; 
    justify-content:space-between;
    display: flex;
    flex-direction: row;
  }
} 
@media (max-width: 800px) {
  .row-to-column{
    display:flex; 
    justify-content:space-between;
    display: flex;
    flex-direction: column;
  }
} 


/*  #region Navigation Bar----------------------------*/
#navbar{
	position: fixed; 
	top: 0;
	width: 100%;
	height: auto;
	background-color: #ffffff;
  z-index: 2;
  display:block;
  text-align: center;
}	
ul{
  padding: 0px 0px;
}
ul#menu {
	list-style: none; /* eliminates bullets */
	/* adjust padding top to adjust nav bar vertical position */
	padding-top: 0px;
} 
ul#menu li {
	float: left; /* changes list from vertical to horizontal */
	padding: 20px 0px 10px 0px;
} 
ul#menu li a.navItem {
	font-size: 16px;
	text-decoration: none;
  color: #1d2026ce;
	/* this padding defines the size of the buttons */
	padding: 40px 10px 40px 10px; 
}
@media (max-width: 800px) {
  ul#menu li a.navItem {
    font-size: 2rem;
  }
  #menu {
    display:flex;
    justify-content:space-evenly;
  }
  #nameTitle {
    display: none;
  }
}
ul#menu li a.navItem:hover {
  background-color: rgb(236, 236, 236);
  border-radius: 15px;
  padding-top: 6px;
  padding-bottom: 6px;
}
ul#menu li a.navItem:active{
  background-color: rgb(222, 222, 222);
}
p#nameTitle{
  padding: 20px 0px 10px 0px;
  text-align: right;
  font-variant: small-caps;
  font-size: 20px;
}

/* #endregion */

/* #region Nav ----------------- */
/* #endregion */



/*  #region Alignment Classes----------------------------*/
.center{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left:auto;
  margin-right: auto;
}
.center_element{
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.vertical-center{
  margin-top:auto;
  margin-bottom:auto;
}
@media (max-width: 800px) {
  .center-mobile{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left:auto;
    margin-right: auto;
  }
}
/* #endregion */


/*  #region MOBILE-----------------------------------------------------------------------------*/
@media (min-width: 800px) {
  #mobile-only{
    display:none;
  }
  #desktop-only{
    display:block;
  }
} 
@media (max-width: 800px) {
  #desktop-only{
    display:none;
  }
  #mobile-only{
    display:block;
  }
  .mobile-remove-container{
    width:100%;
  }
  .mobile-remove-bottom-space{
    margin-bottom:0px !important;
    padding-bottom:0px !important;
  }
} 
/*  -------------------------------------------------------------------------------------------*/

/* #endregion */