html, body{
height:100%;
width: 100%;
margin:0;
padding:0;
}

aside{
text-align:left;
padding:10px;
margin-right:10%;
font-family:monospace;
font-size: 120%;
letter-spacing:1px;
}


.ph_circlehold{
  display:flex;
  justify-content: center;
}

.ph_circle1{
  border-radius: 50%;
  width:185vh;
  height:140vh;
  background-color:black;
  box-shadow:0px 0px 40px 5px grey ;
  position:absolute;
  margin-top:-170px;
  z-index:-3;

}
.ph_circle2{
  border-radius: 50%;
  width:180vh;
  height:135vh;
  background-color: rgb(104, 104, 104);
  background-image:radial-gradient(farthest-corner, rgb(59, 59, 59), rgb(104, 104, 104) 75%);
  position:absolute;
  margin-top:-150px;
  z-index:-3;

}

.barhold{
display:grid;
position: absolute;
grid-template-columns:1fr 1fr 1fr;
column-gap:10px;
z-index:-1;
}

.bar1{
  height:100vh;
  width:380px;
  background-color:black;
  background-image:radial-gradient(farthest-corner, rgb(56, 56, 56),black 70%);
  border-left:10px solid black;
  border-right:10px solid black;
}
.bar2{

  height:100vh;
  width:380px;
  background-color:black;
  background-image:radial-gradient(farthest-corner, rgb(56, 56, 56),black 70%);
  border-left:10px solid black;
  border-right:10px solid black;
}
.bar3{

  height:100vh;
  width:380px;
  background-color:black;
  background-image:radial-gradient(farthest-corner, rgb(56, 56, 56),black 70%);
  border-left:10px solid black;
  border-right:10px solid black;
}


.personal_home_hold{
display:flex;
flex-direction:row;
justify-content:center;
color:aliceblue;
align-items:center;
justify-items:center;
height:100vh;
}

.reviews, .art, .write{
height:300px;
width:340px;
position:relative;
background-color:rgb(5, 5, 5);
text-align:center;
margin:10px;
display:flex;
justify-content:center;
transition: transform 1s;
overflow:hidden;
border-radius:10px;
z-index:3;
}

.art{
margin-left:50px;
margin-right:50px;
}

.reviews:hover, .art:hover, .write:hover{
transform:scale(1.1);
}

.expander{
display:flex;
flex-direction:column;
justify-content:center;
align-self:center;
position:absolute;
overflow:hidden;
height:300px;
width:340px;
z-index:2;
}

.expander h1{
  position:relative;
  z-index:3;
  padding:20px;
  margin:0;
  background-color:rgb(5, 5, 5);
  background-image:radial-gradient(farthest-corner at top, rgb(56, 56, 56),black 80%);
}

.slide{
bottom:100%;
position: relative;
z-index:2;
transition: all 1s ease-out;
background-color:transparent;
height: 100%;
z-index:1;
}

.expander:hover > .slide{
bottom:0;
}

.slide li{
list-style:none;
margin-bottom:20px;
border-radius:50%;
transition: transform 0.3s ease-in, text-shadow 1s;
}

.slide li:hover{
transform:scale(1.1);
text-shadow: 0 0 .5px aliceblue;
}

.p_home_link{
text-decoration:none;
font-size:large;
color:lightgrey;
padding:4px;
padding-left:20px;
padding-right:20px;
transition:color 0.5s;
}

.p_home_link:hover{
color:aliceblue;
}


/*Diary starts here*/

.diary { display: none; }
.active { display: block; }
.active-btn {background-color:rgb(35, 35, 35);transform:scale(1.05);}

.subnav{
position:absolute;
display:flex;
flex-direction:column;
justify-content:flex-start;
margin-left:210px;
background-color:black;
border-radius:5px;
height:100vh;
width:300px;
overflow-y:scroll;
}

.dnav{
margin-top:30px;
margin-left:50px;
font-size:130%;
padding:10px;
width:200px;
border-color:rgb(66, 66, 66);
border-radius:5px;
transition:transform 0.5s ease;
}
.dnav:not(.active-btn){
background-color:darkgrey;
}
.dnav:not(.active-btn) a{
color:black;
text-decoration:none;
}
.dnav:hover{
cursor:pointer;
transform:scale(1.05);
}
.active-btn a{
color:aliceblue;
text-decoration:none;
}


.darticles{
display:flex;
flex-direction:column;
align-items:center;
margin:auto;
background-color:darkgrey;
border-left:10px solid lightgrey;
border-right:10px solid lightgrey;
height:100vh;
width:800px;
overflow-y:scroll;
}
.darticles p{
margin-left:80px;
margin-right:80px;
font-size:115%;
font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
letter-spacing:1px;
line-height:140%;
}
.darticles h2{
text-align:center;
}

article{
margin-bottom:100px;
}

.dhold ul{
font-size:115%;
font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
letter-spacing:1px;
line-height:140%;
}

footer a{
color:black;
text-decoration:none;
font-size:larger;
}
footer a:hover{
font-style: italic;
}
footer{
text-align:center;
margin-top:-50px;
margin-bottom:50px;
transition:transform 0.5s ease-in;

}

/*Diary ends here*/


 /* booksrec here*/
 .hidden{
  display:none;
  }
  
  .navrec{
  padding:15px;
  margin-left:25px;
  margin-right:25px;
  border:3px solid grey;
  border-radius:5px;
  display:inline-block;
  }
  
  .filter-option{
  color:white;
  background-color:#262626;
  border:3px solid grey;
  padding:10px 20px;
  margin:5px;
  font-size:115%;
  border-radius:5px;
  display:inline-block;
  }
  
  .filter-option:hover{
  color:black;
  background-color:lightgrey;
  }
  
  .holdrec{
  margin-left:25px;
  margin-right:25px;
  padding:20px;
  padding-right:120px;
  padding-left:120px;
  }
  
  .liststyle{
  font-size:250%;
  background-color:#262626;
  padding:35px;
  }

  details summary{
  cursor:pointer;
  list-style:none;
  }

  .holdrec p{
    margin-left:80px;
    margin-right:80px;
    font-size:115%;
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    letter-spacing:1px;
    line-height:140%;
  }
 

   /*booksrec ends here*/
  

/*Essays start here*/

div[id^="rev_view"]
{
display: none;
}

div[id^="rev_view"]:target
{
display: block;
}

.listreviewhold{
display:flex;
flex-direction:row;
margin-left:100px;
margin-bottom:20px;
margin-top:-20px;
}

.listreviewhold li{
display:inline;
}

.rv{
color:white;
text-decoration:none;
}
.rv:hover{
font-weight:bolder;
}



.pc-tab > input,
.pc-tab section > div {
  display: none;
}

#tab0:checked ~ section .tab0,
#tab1:checked ~ section .tab1,
#tab2:checked ~ section .tab2,
#tab3:checked ~ section .tab3 {
  display: block;
}

#tab0:checked ~ nav .tab0,
#tab1:checked ~ nav .tab1,/*alters styling on click*/
#tab2:checked ~ nav .tab2,
#tab3:checked ~ nav .tab3 {
  color: aliceblue;
  filter:brightness(110%);
}

.pc-tab li{
display:inline-block;
word-spacing:20px;
}

.pc-tab label{
cursor:pointer;
}
.pc-tab label:hover{
text-decoration:underline;
}

.longreviewhold{
width:1200px;
height:73vh;
position:absolute;
margin-left:35vh;
margin-top:200px;
overflow-y:scroll;
scrollbar-width:none;
}
.longreviewhold::-webkit-scrollbar{
display:none;
}
.longreviewhold h2{
margin-top:40px;
}
.longreviewhold p{
text-indent:30px;
font-size:large;
}

.selecthold{
background-image:linear-gradient(grey, black);
position:absolute;
width:100%;
margin-bottom:200px;
}

._hide_{
color:transparent
}
/*Essays end here*/

/*Playground starts here*/



div[id^="write"]
{
display: none;
}

div[id^="write"]:target
{
display: block;
scroll-margin-top:80px;
}

.pg{
text-decoration:none;
color:aliceblue;
position:fixed;
left:3%;
margin:10px;
font-size: larger;
transition:all 0.5s ease-out;
}
.pg:hover{
transform:scale(1.2);
}


.pg_over_hold{
  display:flex;
  flex-direction:row;

}

.pg_select{
height:110vh;
width:12vw;
display:flex;
flex-direction:column;
align-content:center;
overflow-y:scroll;
scrollbar-width:none;
-ms-overflow-style: none;  /* IE and Edge */
top:50px;
}
.pg_select::-webkit-scrollbar{
display:none;
}
.pg_select p{
margin-bottom:40px;
}
.pg_select h2{
padding-top:50px;
margin-right:20px;
margin-bottom:-5%;
font-size:xx-large;
text-decoration:underline;
}

.pg_writehold{
height:110vh;
width:87vw;
left:12.15vw;
position:absolute;
right:13vw;
overflow-y:scroll;
scrollbar-width:none;
-ms-overflow-style: none;  /* IE and Edge */
font-size:large;
text-align:left;
scroll-padding-top: 6rem;
}
.pg_writehold::-webkit-scrollbar{
display:none;
}
.pg_writehold p{
margin-left:80px;
margin-right:80px;
}
.pg_writehold h1{
text-align:center;
}

.infobox{
text-align:center;
width:60vw;
color:black;
margin:auto;
background-color:darkgrey;
border:7px solid rgb(90, 90, 90);
border-radius:40px;
}

.footer{
padding:200px;
}

/*Playground ends here*/



/*Art Sketchbook Starts Here*/

div[id^="circview"]
{
display: none;
}
        
div[id^="circview"]:target
{
display: block;
scroll-margin-top:300px;
}



.circlehold{
height:100vh;
width:20vw;
overflow-y:scroll;
display:flex;
flex-direction: column;
text-align:center;
}
.circlehold a{
text-decoration:none;
}

.circle{
height:26vh;
width:15vw;
border-radius:50%;
background-color:aliceblue;
background-image:linear-gradient( rgb(46, 46, 46), lightgrey);
justify-content:center;
border:7px solid rgb(41, 41, 41);
margin:20px;
font-size: 500%;
transition:all 0.5s ease-out;
color: black;
}

.circle:hover{
cursor:pointer;
transform:scale(1.1);
}


.circviewhold{
height:110vh;
width:80vw;
margin-top:-1vh;
display:flex;
flex-direction:row;
justify-content:center;
overflow-y:scroll;
}


.overhold{
display:flex;
flex-direction:row;
}

.holdbox{
text-align:center;
width:60vw;
color:darkgrey;
display:flex;
flex-direction:row;
justify-content:center;
flex-wrap:wrap;
margin:auto;
background-color:darkgrey;
border:7px solid rgb(90, 90, 90);
border-radius:40px;
}

/*Art Sketchbook Ends Here*/