body{ background-color: rgb(250,250,255);
      color: rgb(0,0,50);
      font-weight: plain;
      font-family: helvetica, sans-serif;
      font-size: 100%; }
h1#welcome{   text-align: center;
      background-color: rgb(240,240,240);
      color: rgb(150,30,80);
      font-size: 2em;
      font-weight: bold;
      //text-shadow: 3px 3px rgb(255,200,220); 
      text-shadow: 3px 3px rgb(180,180,180);
      width: 100%;
      height: 43px;
      margin: 0px;
      padding: 35px 0px 35px 0px;
      border: 5px solid rgb(150,20,100);
      border-radius: 10px; }
#myphoto{  border: 5px solid rgb(150,100,20);
      border-radius: 10px;
      }
h1{   text-align: center;
      background-color: rgb(245,245,255);
      color: rgb(100,20,40);
      font-size: 1.5em;
      font-weight: bold;
      text-shadow: 3px 3px rgb(255,200,220);
      width: 100%;
      height: 43px;
      margin: 0px;
      padding: 15px 0px 15px 0px;
      border: 3px solid rgb(150,20,100);
      border-radius: 10px; }
h2{   color: rgb(100,20,40);
      text-align: justify;
      padding: 0px 40px 0px 40px;
      font-size: 1.1em;
      font-weight: bold;
      font-style: italic;}
h3{   color: rgb(50,100,150);
      margin-left: 20px;
      font-size: 1.4em;
      font-weight: bold;}
strong{font-weight: bold;
       font-style: italic;}
p{     text-align: justify;
       text-indent: 30px;
       margin-left: 20px;
       margin-right: 20px;
       line-height: 1.3;}
a:link{color: rgb(0,0,180);}
ul{margin-left: 20px;}
#heading-main{display: grid;
         grid-template-columns: 120px auto 120px;}
#heading-page{display: grid;
         grid-template-columns: 135px auto 120px;}
#myphoto{display: block;}
#menu-right{display: grid;
            grid-template-rows: auto auto;}
#lang-but {width: 100px;
  height: 30px;
  background-color: rgb(255,245,255);
  color: rgb(30,60,100);
  margin: 10px 20px;
  border-style: groove;
  border-width: 2px;
  border-color: rgb(50,0,100);
  cursor: pointer;
} 
#lang-drop {
  //text-align: center;
  display: block; 
  grid-row: 1 / span 1;
  //width: 50%;
}
#lang-content {
  display: none;
  position: absolute;
  right: 100px;
  top: 10px;
  background-color: #f1f1f1;
  min-width: 120px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}
#lang-content a {
  color: rgb(50,50,150);
  padding: 6px 10px;
  text-decoration: none;
  font-style: italic;
  display: block;
}
#lang-content a:hover {background-color: #ddd;}
#lang-drop:hover #lang-content {display: block;}
#lang-drop:hover #lang-but {background-color: rgb(200,180,200);}
#author-but { grid-row: 2 / span 1;
  width: 100px;
  height: 40px;
  background-color: rgb(255,245,255);
  color: rgb(30,60,100);
  margin: 0px 20px; 
  border-style: groove;
  border-width: 2px;
  border-color: rgb(50,0,100);
  cursor: pointer;
}
#author-but:hover {background-color: rgb(200,180,200);}
#author-title{
  text-align: center;
  font-weight: bold;
  font-style: italic;
  padding: 2px 2px 2px 2px;
}
#author-close {      
      display: grid;
      grid-template: '. .';
      grid: auto / auto min-content;
}
#author-X {
  text-align: center; 
  padding: 2px 2px 2px 2px;
  border-style: groove;
  border-width: 1px;
  border-color: rgb(100,1000,100); 
  cursor: pointer;
}
#author-window {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  top: 100px;
  left: 400px;  
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1; 
  border-style: groove;
  border-width: 2px;
  border-color: rgb(50,0,100);
  border-radius: 5px;
} 
#author-content {
  width: 600px;
  height: 450px;
  margin: 10px;  
  overflow-x: auto;
  padding: 3px 3px 3px 3px;
  text-align: justify;
  text-indent: 20px;
}
#author-drop:hover #author-content {display: block;}
#author-drop:hover #author-but {background-color: rgb(100,20,50);} 
#home-but { //grid-row: 2 / span 1;
  width: 100px;
  height: 40px;
  background-color: rgb(255,245,255);
  color: rgb(30,60,100);
  margin: 10px 50px 10px 20px; 
  border-style: groove;
  border-width: 2px;
  border-color: rgb(50,0,100);
  cursor: pointer;
}
#home-but:hover {background-color: rgb(200,180,200);}
.link-but{
  display: block;
  width: auto;
  margin-left: 20%;
  margin-right: 20%;
  margin-top: 15px;
  margin-bottom: 15px;
  text-align: center;
  font-weight: bold;
  font-style: italic; 
  padding: 5px 5px 5px 5px;
  border-style: groove;
  border-width: 3px;
  border-color: rgb(200,100,100);
  border-radius: 10px; }
.link-but:hover {background-color: rgb(250,220,220);}
.link-but a{
  text-decoration-line: none;
  color: rgb(60,30,120);
  cursor: pointer;} 
.link-but a:visited{
  color: rgb(120,30,60);}