* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

html {
height: 100%;
width: 100%;
background-image: url("./fieldcopy.gif");
background-size: cover;
}

body {
margin: 0;
height: 100%;
width: 100%;
-webkit-text-stroke: 1px lightcyan;
font-family: sans-serif;
font-weight: lighter;
font-size: 111px;
 -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

a {

text-decoration: none;
color: transparent;
}

a:visited {

color: transparent;

}


.name {
font-weight: lighter;
color: transparent;
-webkit-text-stroke: 1px lightcyan;
text-shadow: 55px 55px 5px rgba(255, 255, 255, 0.5);
position: fixed;
right: 11%;
font-family: sans-serif;
}

.name:hover {
color: lightcyan;

}


.contents {

padding-left: 1%;



}

a.about:hover {

color: white;
-webkit-text-stroke: 0px;
}

a.work:hover {

color: rgba(176, 196, 27, 1);
-webkit-text-stroke: 0px;
}

.graph1 {

position: fixed;
bottom: 10%;
right: 13%;
opacity: 20%;
}

.graph2 {

position: fixed;
bottom: 10%;
left: 13%;
opacity: 20%;
}


.graphabout1 {

position: fixed;
top: 5%;
right: 8%;
opacity: 20%;

}


.graphabout2 {

position: fixed;
top: 5%;
left: 8%;
opacity: 20%;


}


.aboutayo {
position: fixed;
text-align: justify;
width: 30%;
left: 33%;
top: 40%;
font-size: 22px;
-webkit-text-stroke: lightcyan;
color: white;


}



table {

font-size: 33px;
font-weight: normal;
color: transparent;
-webkit-text-stroke: 1px white;
width: 100%;
text-align: right;
position: absolute;
bottom: 0%;
}



th {
color: white;
-webkit-text-stroke: 0px white;
font-size: 35px;
font-weight: normal;
}

}

td {
font-size: 33px;

}

tr:hover {

color: rgba(176, 196, 27, 1);
-webkit-text-stroke: 0px;
}

.mobile_home {
display: none;


}

.back {
position: fixed;
left: 1%;
top: 1%;
color: transparent;
-webkit-text-stroke: 1px white;

font-family: sans-serif;
font-size: 44px;
}


.back:hover {
color: white;


}