html
{
  overflow: scroll;
}

html.index {
  height: 500px;
}

html.writing {
  height: 1300px;
}

html.about {
  height: 2500px;
}

html.code {
  height: 550px;
}
                  
body
{
  background: $ffffff;
  height: 99%;
  margin: 0;
  padding: 0;
  line-height: 150%;
  text-align: center;
}

*
{
  font-size: 8pt; 
  font-family: Tahoma, Verdana, sans-serif; 
  color: #000000;
  text-align: left;
}

/* === Containers === */

#mainContentArea
{
  margin: 0 auto 0 auto; 
  display: table; 
  height: 100%;  
  position: relative; 
  overflow: hidden; 
  width: 600px;
}

.link,.linkActive
{
width:75px;
margin-right:10px;
float: left;
margin-top:45px;
text-align:center;
font-family:Georgia, "Times New Roman", Times, serif;
background-image:url(media/tab.gif);
position:relative; bottom:0px;
}

.link:hover
{
background-image:url(media/tab2.gif);
}

a
{
text-decoration:none;
}

.link a {
font-family:'Inconsolata';
font-size:12px;
font-weight:bolder;
}

#linkGroup
{
margin-right:10px;
height:40px;
width:600px;
}

#title
{
width:215px;
height:46px;
margin-right:20px;
margin-top:15px;
font-family:'Montserrat';
font-size:20px;
font-weight:bolder;
text-align:center;
float:left;
}

.contentTitle
{
font-family:'Playfair Display';
color:#213E74;
font-size:35px;
margin-left:15px;
margin-right:12px;
margin-bottom:12px;
width:573px;
font-weight: bold;
}

.subTitle 
{
  font-family:'Montserrat';
  color:#213E74;
  font-size:20px;
  margin-left:17.2px;
  margin-right:16px;
  margin-bottom:12px;
  margin-top: 20px;
  font-weight: bold;
  width:573px;
}

.aboutSubTitle 
{
  font-family:'Montserrat';
  color:#213E74;
  font-size:20px;
  margin-left:17.2px;
  margin-right:16px;
  margin-bottom:12px;
  margin-top: 20px;
  font-weight: bold;
  width:573px;
  line-height: 1.1;
}

.pageContent
{
font-family: Arial, Helvetica, sans-serif;
color:#000000;
font-size:12px;
margin-left:20px;
margin-right:20px;
width:560px;
}

.pageContentText
{
  font-size: 14px;
  font-family:'Open Sans';
  color:#1e3867;

}

.pageName
{
  font-size: 300px;
  font-family:'Open Sans';
  color:#1e3867;

}

#blueBox
{
	position: absolute;
	vertical-align: middle;
	background-color:#E7EDF8;
	width:600px;
	clear:both;
  margin-top: 20px;
}

#header
{
width:600px;
height:20px;
background-color:#FFFFFF;
background-image:url(media/header.gif);
background-repeat:no-repeat;
}

#footer
{
width:600px;
height:20px;
background-color:#FFFFFF;
background-image:url(media/footer.gif);
background-repeat:no-repeat;
text-align:center;
padding-right:10px;
color:#BDCDEC;
}

#footer a
{
font-size:9px;
color:#BDCDEC;
}

#contentBox
{
margin-top:25px;
}

html, body {
text-align: center;
}
p {text-align: left;}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;

}


/* image hover  */

.image-link {
  display: inline-block;
  position: relative;
  top: -47px;
  left: 185px;
}

.image-link img {
  width: 25px;
  height: auto;
  position: absolute;
  left: 0;
  right: 0;
  transition: opacity 0.3s ease-in-out;

}

.image-link img.hover {
  opacity: 0;
}

.image-link:hover img.default {
  opacity: 0;
}

.image-link:hover img.hover {
  opacity: 1;
}

/* scroll bar */

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
::-webkit-scrollbar-thumb {
  background: #d1d6e1; 
}

::-webkit-scrollbar-thumb:hover {
  background: #1e3867; 
}

/* embedding pdf  */

.pdf {
  width: 100%;
  height: 500px;
}

/* team pictures */

 .grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr); 
  grid-template-rows: repeat(2, auto); 
  gap: 15px; 
  padding-left: px;
}

.grid-item {
  position: relative;
  padding: 10px;
  text-align: center;
}

.grid-item img {
  max-width: 100%;
  height: auto;
  display: block; 
}

.grid-item p {
  margin-top: 10px;
  font-size: 16px;
  color: #333;
  text-align: center;
  line-height: 1.5;
}