html,body {
  font-family: Helvetica, Arial, sans-serif;
  background-color: #e9ebee;
  height:100%;
  margin-top:0px;

}
a {
  text-decoration: none;
  color: #008AE6;
}

a:hover{
  text-decoration: underline;
}

.titleBar{
  width: 100%;
  max-width: 62.5rem;
  min-width: 20rem;
  margin:0px auto 20px auto;
  clear: both;
  text-align:center;
  position:relative;
  display:block;
  -moz-box-shadow: 2px 4px 6px rgba(0, 0, 0,0.5);
  -webkit-box-shadow: 2px 4px 6px rgba(0, 0, 0, .5);
  box-shadow: 2px 4px 6px rgba(0, 0, 0, .5);
  background-color: #FFFFFF;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  overflow: hidden;
}

.photo{
  text-align: center;
  margin-left:10px;
  margin-right: 15px;
  display: inline-block;
  vertical-align: top;
}

.photo h1, .photo h2{
  color:#008AE6;
  margin-bottom:0.1rem;
  text-shadow: 0.125rem 0.125rem #D9D9D9;
}
.photo h1{
  margin-top:1.2rem;
}
 .photo h2 {
  margin-top:0.4rem;
}

.menu {
  display: inline-block;
  min-width: 20rem;
  width: 60%;
  height: 6rem;
  font-size: 1.1rem;
  text-shadow: 0.125rem 0.125rem #D9D9D9;
  font-weight: bold;
  color: #242424;
}

.menuSmall{
  display: inline-block;
  min-width: 20rem;
  width: 94%;
  height: 6rem;
  font-size: 1rem;
  text-shadow: 0.125rem 0.125rem #D9D9D9;
  font-weight: bold;
  color: #242424;
}


.menu table, .menuSmall table {
  height: 6.40rem;
  margin: 0px 0px 0px 0px;
  border-spacing: 0px;
  width: 100%;
  text-align: center; 
  cursor: pointer;

}

.menu td, .menuSmall td{
  position: relative;
  line-height: 5.9rem;
    width: 25%;
    margin:0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.selected {
  border-bottom: .20rem solid #008AE6;
  color: #008AE6;
}

.menu a, .menuSmall a, .menu a:visited, .menuSmall a:visited, .menu a:link, .menuSmall a:link  {
  text-decoration: none;
  color:inherit;
}

.menu p, .menuSmall p{
  margin: 0px 0px 0px 0px;
}

.menu p:hover, .menuSmall p:hover{
  border-bottom: .20rem solid #008AE6;
}

.menu a:hover , .menuSmall a:hover {
  color:#008AE6;
}

.content{
  width: 100%;
  max-width: 62.5rem;
  margin: 10px auto 10px auto;
  
  clear: both;
  text-align:center;
  position:relative;
  display:block;
  -moz-box-shadow: 2px 4px 6px rgba(0, 0, 0,0.5);
  -webkit-box-shadow: 2px 4px 6px rgba(0, 0, 0, .5);
  box-shadow: 2px 4px 6px rgba(0, 0, 0, .5);
  background-color: #FFFFFF;
  border-radius: 15px;
  overflow: hidden;
}


.contentProjs{
  width: 100%;
  max-width: 62.5rem;
  margin: 10px auto 10px auto;
  
  clear: both;
  text-align:center;
  position:relative;
  display:block;
  
}

.pane {
  width: 100%;
  margin: 25px auto 15px auto;
  padding-bottom: 10px;
  position:relative;
  display:block;
  direction: rtl;
}

.pane h5 {
  text-align: center;
  
}
.imgpane {
  margin-right: 20px;
  position: relative;
  display: inline-block;
  width: 200px;
  height: 200px;
  border: 3px solid #008AE6;
  direction: ltr;
}

.imgpaneCenter {
  display: block;
  text-align: center;
}

.imgpaneProj {
  float:top;
  margin-right: 10px;
  position: relative;
  display: inline-block;
  vertical-align:top;
  direction: ltr;


}
.contentProjs p, .content p{
  text-align: left;
  margin: 5px 10px 0px 10px;
}

.imgpaneProj p {
  text-align: center;
}

.textpane {
  margin-bottom: 20px;
  position: relative;
  display: inline-block;
  margin-right: auto;
  margin-left: auto;
  text-align: left;
  width: 60%;
  direction: ltr;
}

.textpaneSmall {
  position: relative;
  display: inline-block;
  margin-right: auto;
  margin-left: auto;
  text-align: left;
  width: 90%;
  /*min-height: 12rem;*/
  direction: ltr;
}



.projs {
  margin: 5px 5px 5px 5px;
  width: 48%;
  min-width: 20rem;
  min-height: 18.75rem;
  display: inline-block;
  word-wrap: break-word;
  -moz-box-shadow: 2px 4px 6px rgba(0, 0, 0,0.5);
  -webkit-box-shadow: 2px 4px 6px rgba(0, 0, 0, .5);
  box-shadow: 2px 4px 6px rgba(0, 0, 0, .5);
  background-color: #FFFFFF;
  border-radius: 15px;
  overflow: hidden;
}

.projs a{
  color:black;
}
.projs a:hover {
  text-decoration: none;
  color: #008AE6;
}

.readmore {
  text-decoration: none;
  color: #008AE6;
}

.readmore:hover {
  text-decoration: underline;
  color: #008AE6;
}

#back {
  text-shadow: 2px 2px #D9D9D9;
}
