body{
  background-repeat: no-repeat;
background-size:cover;
background-attachment: fixed;
display: grid;
  grid-template-areas:
  "header header header"
  "nav nav nav"
  "subject subject subject"
  "table table photo"
  "erling erling photo-erling"
  "footer footer footer";
  grid-template-rows:auto auto auto;
}
   nav{
      grid-area:nav;
    position: sticky;
    top: 0;
    margin-top:10px;
    z-index: 1000;
     grid-area:nav;
      width: 1300px;
      height: 90px;
      background-color: rgb(230, 250, 232);
      border:black;
          border-width: 2.5px;
      border-style: solid;
          padding-left: 10px;
          padding-bottom: 2px;
          padding-top: 10px;
          margin-right: auto;
          margin-left:  auto ;
     margin-top:10px;
          position: sticky;
          top: 0;
      }
      nav div {
          font-family: Arial, Helvetica, sans-serif;
          display:inline; 
          padding-left: 20px;
          position: relative;
          bottom: 10px;
       font-weight: bolder;

        } 
        span.h{
          position:relative;
          top: 20px;
          right: 70px;
        }
        span.g{
          position:relative;
          top: 20px;
          right: 85px;
        }
        span.s{
          position:relative;
          top: 20px;
          right: 80px;
        }
        span.l{
          position:relative;
          top: 20px;
          right: 80px;
        }
        span.la{
          position:relative;
          top: 20px;
          right: 75px;
        }
        span.e{
          position:relative;
          top: 20px;
          right: 65px;
        }
        span.settings{
          position:relative;
          top: 20px;
          right: 75px;
        }
h2{
text-align: center;
}
table img{
padding-left: 20px;
}
.subject{
   grid-area:subject;
padding: 10px 15px;
  width: 1300px;
  height: auto;
border-radius: 20px;
font-weight: bolder;
  font-size: 29px; 
  color:yellow;
  line-height: 40px;
  background-color: green;
  display:inline-flex;
  text-align: right;
  direction: rtl;
  size:80%;
  margin-left: auto;
  margin-right: auto;
font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
float:inline-end;
}
  header{
     grid-area:header;
      text-align: left;
      transform: none;
      background-image: linear-gradient(to right, rgb(154, 156, 20),rgb(160, 170, 17),rgb(185, 204, 18),rgb(224, 248, 6));      height: 200px;
      padding: 20px;
  }
  .photo{
  grid-area:photo;
overflow:hidden;
/* width: 400px;  */
height: auto;
float: right;
width: 400px;
border-radius: 20px;
float: right;
/* margin-left: 200px; */
  }
  .photo img{
    overflow: hidden;
  width: 400px;
  float: right;
    height: 250px;
    transition: 0.7s;
  }
.photo img:hover{
overflow: hidden;
 transform:scale(1.33);
 cursor:pointer;
padding-bottom: 30px;
  }

 .photo p {
    height:auto ;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    width: 400px;
    text-align: right;
    padding-top: 5px;
    padding-bottom: 10px;
    padding-right: 15px;
    color: rgb(255, 255, 255);
    font-size: large;
    font-weight: bolder;
    background-color: rgba(0, 0, 0, 0.575);
  }
    
/*       
     .issay1{
          grid-area:issay1;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

      border-radius: 10px;
      height:50px ;
    margin-top: -10px;
      width: 460px;
      text-align: right;
      padding-top: 1px;
      padding-bottom: 1px;
      padding-right: 15px;
      color: rgb(255, 255, 255);
      font-size: large;
      font-weight: bolder;
      background-color: rgba(0, 0, 0, 0.575);
      
     }  */
 
/* .summary{
color: white;
  size: 70%;
  background-color: seagreen;
  text-align: center;
  font-size: 40px;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
 border-radius: 30px;
 padding: 6px;
 width: 200px;
 font-weight: bolder;
 margin-left: auto;
 margin-right: auto;
 float: inline-start;
} */
    a{
text-decoration: none;
 bottom: 100px;
left: 50px;
    }

a:hover{
   color: orangered;
    }

table{
 width: 100%;
  float: left;
 grid-area:table;
/* margin-left: 160px; */
background-repeat: no-repeat;
background-size: 1800px 1750px;
background-position: right;
background: chocolate;
border: darkblue;
border-style: solid;
border-width: 7px;
tab-size: 1350px;
/* display: inline-table;  */
}

p.e{
  padding: 10px 15px;
/*   margin-right: 500px; */
  width: 800px;
  height: auto;
border: black;
border-radius: 20px;
font-weight: bolder;
  font-size: 20px; 
  color:rgb(0, 0, 0);
  line-height: 40px;
  text-align: right;
  direction: rtl;
font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
background-color: rgb(230, 204, 61);

 }

 .erling{
   grid-area:erling;
  width: 50%;
  float: right;
 
  }
  .photo-erling{
   grid-area:photo-erling;
  width: 100%;
  float: right;
 
  }
  figure{
  background: url("pngs/icons/card\ \(2\).png");
  width: 400px;
  background-repeat: no-repeat;
  background-size: cover;
  height: 640px;
float: right;
/* margin-left: 200px;
   */
     }
     figcaption{
      text-align: center;
      font-size: 40px;
      color: rgb(255, 255, 255);
      background-color: seagreen;
      font-weight: bolder;
  width: 400px;
    padding: 4px;
   float: right;
    border-radius: 20px;
    margin-top: 90px;
     }
     footer{
        grid-area:footer;
        height: 200px;
       width:auto;
      padding: 20px;
     }
 

 ::-webkit-scrollbar-thumb{

  background-color: seagreen;
}
::-webkit-scrollbar{

width: 10px;
}
::-webkit-scrollbar-track{
   background-color: rgb(70, 68, 68);
}

*{
  text-decoration: none;
};