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

html {
background-color: silver;

}

body {
margin: 0;
height: 133%;
color: white;
 -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
overflow: scroll;
}

a {

text-decoration: none;
color: white;
}

a:visited {

color: white;

}


.name {
font-weight: lighter;
color: transparent;
-webkit-text-stroke: 1px lightcyan;
text-shadow: 55px 55px 5px rgba(173, 216, 230, 0.3);
position: fixed;
right: 9%;
font-family: sans-serif;
display: none;
}


.contents {

padding-left: 2%;
padding-top: 1%;
display: none;

}

a.about:hover {

color: #cce0f9;

}

a.work:hover {

color: rgba(176, 196, 27, 1);

}

.graph1 {
display: none;
transform: scale(25%);
position: fixed;
top: -30%;
left: 10%;
opacity: 20%;
}

.graph2 {
display: none;
transform: scale(25%);
position: fixed;
top: -30%;
left: -10%;
opacity: 20%;
}


.graphabout1 {
display: none;
position: fixed;
top: 5%;
right: 5%;
opacity: 20%;

}


.graphabout2 {
display: none;
position: fixed;
top: 5%;
left: 5%;
opacity: 20%;


}


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


}

table {
display: none;
font-size: 16px;
color: lightcyan;
-webkit-text-stroke: 0px;
width: 100%;
text-align: right;
position: absolute;
bottom: 0%;
}

tr {
border-bottom: 1px solid lightcyan;

th {

font-size: 22px;
font-weight: normal;
}

}

td:hover {

color: white;

}



.mobile_home {
position: absolute;
top: 1%;
display: block;
font-size: 22px;
-webkit-text-stroke: 1px transparent;
overflow: scroll;
padding: 4.4%;
}



.mobilework {

border: 1px dotted white;
height: 50%;



}