html {
display: table;
margin: auto;
height: auto;
width: 1080px;
}
body {
font-family: Ubuntu;
background: linear-gradient(#a88eec, #26264d );
background-attachment: fixed;
padding-right: 50px;
padding-left: 50px;
margin-top:0;
height: max-content;
width: 1080px;
}
h1 {
text-align: right;
font-size: 50px;
margin: 5px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
color: #8282ff;
}
h4 {
text-align: center;
margin-top: 0;
padding:4px;
margin-bottom: 0;
font-family: Courier;
border-width: thin;
border-bottom:double;
border-color:#8282ff;
background-color: aliceblue;
letter-spacing: 2px;
}
h3 {
text-align: center;
margin-top: 0;
padding:4px;
margin-bottom: 2px;
font-size: 12px;
font-family: Ubuntu;
background-color: transparent;
text-decoration: underline dotted;
}
h5 {
text-align: left;
margin-top:10px;
margin-bottom: 5px;
padding-left: 20px;
padding-right: 20px;
font-family: Ubuntu;
}
p {
padding: 10px;
margin: 10px;
margin-top: 0;
font-size: 13px;
line-height: 1.3;
}
.p2 {
padding: 10px;
margin: 0;
margin-top: 0;
font-size: 13px;
line-height: 1.3;
}
.gamepic{
display:block;
margin: auto;
width: 75%;
max-width: 90px;
max-height: 90px;
height: 100%;
object-fit:cover;
}
.iconpic {
max-height: 100px;
margin-right: auto;
margin-left: auto;
display:block;
}
.gametext {
text-align:center;
padding: 5px;
margin: 5px;
font-size: 11px;
line-height: 1.2;
}
.gametitle{
text-align:center;
background-color: thin;
border-bottom:double;
border-color:#8282ff
}
.quote{
font-size: 11px;
background-color: #b2bcff;
margin: 10px;
padding-bottom: 10px;
padding-left: 20px;
padding-right: 20px;
border-radius: 10px;
color: #59519b
}
.picdec {
position:absolute;
z-index:-1;
}
ul{ list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
display: flex;
justify-content: center;
background-color: #8282ff;
border-bottom:solid;
border-color: #5b4cdc;
}
.list {
padding-left: 40px;
padding-right: 40px;
padding-top: 4px;
padding-bottom: 5px;
font-size: large;
display:inline;
color: white;
text-shadow: 1px 1px 2px #5b4cdc;
font-variant: all-petite-caps;
}
.maingrid{
display: grid;
grid-template-columns: 1fr 2.5fr 1fr;
grid-gap: 15px;
width: 100%;
height: 100%;
}
.section1 { /*TITLE*/
background-color: #2e2e5f;
text-align: center;
grid-column: 1/4;
grid-row: 1/2;
}
.navigatornest {
display:grid;
grid-template-columns: 1fr 1fr 1fr;
}
.section1a {
grid-column: 1/4;
grid-row: 1;
}
.section1b {
grid-column: 1/4;
grid-row: 2/3;
}
.section2 { /*MEDIA*/
background-color: #8282ff;
text-align: left;
grid-column: 1/2;
grid-row: 2/5;
background: linear-gradient(#b2bcff, white);
border-width: thin;
border:solid;
border-color:#5b4cdc;
}
.nest2 { /*Nest para el media*/
display: grid;
height: auto;
width:100%;
justify-content: center;
grid-template-columns: 1fr;
grid-template-rows: auto auto;
}
.section2a { /*BOOKS*/
text-align: left;
}
.section2b { /*MEDIA*/
text-align: left;
border-width: thin;
border-top:solid;
border-color:#5b4cdc;
}
.section3 { /*INTEREST*/
background-color: #3d3d6e;
grid-column: 2/3;
grid-row: 2/4;
border-width: thin;
border:ridge;
border-color:#ffffff;
width: 100%;
overflow-y: scroll;
max-height: 558.5px;
}
.nest3 { /*Nest para el journal*/
display: grid;
height: auto;
width:100%;
justify-content: left;
grid-template-columns: 1fr 2fr;
grid-template-rows: 40px auto;
}
.section3a { /*TITULO*/
grid-column: 1/3;
grid-row: 1/2;
margin:0;
}
.section3bflex { /*ENTRY SECTION*/
display:flex;
flex-direction: column-reverse;
margin:0;
grid-column: 1/4;
grid-row: 2/3;
border-radius: 10px;
}
.entry1{
background-color: aliceblue;
height: auto;
border-radius: 11px;
text-align: justify;
display:grid;
grid-template-columns: 4fr 1fr;
grid-template-rows:25px auto;
margin-right: 10px;
margin-left: 10px;
margin-top: 10px;
}
.entry1a{
grid-column: 1/2;
grid-row: 1/2;
background-color: #8282ff;
border-top-left-radius: 10px;
margin-bottom:0;
border-color: #000000;
border-top:solid;
border-left:solid;
border-bottom:solid;
border-width: 2px;
display: flex;
justify-content: left;
align-items:center;
height: 100;
width: 100%;
}
.entry1b{
grid-column: 2/3;
grid-row: 1/2;
text-align: center;
background-color: #8282ff;
border-top-right-radius: 10px;
margin-bottom:0;
border-color: #000000;
border:solid;
border-width: 2px;
display: flex;
justify-content: center;
align-items: center;
}
.entry1c{
grid-column: 1/2;
grid-row: 2/3;
text-align: justify;
border-color: #000000;
border-top:solid;
border-left:solid;
border-bottom:solid;
border-width: 2px;
border-bottom-left-radius: 10px;
}
.entry1d{
grid-column: 2/3;
grid-row: 2/3;
text-align: justify;
border-color: #000000;
border:solid;
border-width: 2px;
border-bottom-right-radius: 10px;
display: flex;
justify-content: center;
align-items:center;
}
.entry2{
background-color: aliceblue;
height: auto;
border-radius: 11px;
text-align: justify;
display:grid;
grid-template-columns: 4fr 1fr;
grid-template-rows:25px auto;
margin-right: 10px;
margin-left: 10px;
}
.entry3{
background-color: aliceblue;
height: auto;
margin-right: 20px;
margin-left: 20px;
margin-top:10px;
margin-bottom:10px;
border-radius: 10px;
text-align: justify;
}
.section4 { /*ABOUT*/
background-color: #8282ff;
text-align: center;
grid-column: 3/4;
grid-row: 2/4;
background: linear-gradient(#b2bcff, white);
border-width: thin;
border:solid;
border-color:#5b4cdc;
}
.nest4 { /*Nest para about*/
display: grid;
grid-template-rows: auto 1fr;
height: auto;
width:100%;
justify-content: center;
align-content: center;
}
.section4a { /*ABOUT*/
text-align: justify;
}
.section4b { /*SOCIAL MEDIA*/
background-color: aliceblu;
height: auto;
border-radius: 11px;
text-align: justify;
margin-bottom:5px;
}
.nest4b{
display:grid;
width: auto;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows:25px auto;
margin-bottom:5px;
}
.section4b0 {
grid-column: 1/4;
grid-row: 1;
}
.section4b1 {
grid-column: 3/4;
grid-row: 2;
display: flex;
justify-content: center;
align-items: center;
}
.section4b2 {grid-column: 2/3;
grid-row: 2;
display: flex;
justify-content: center;
align-items: center;
margin:10px;
}
.section4b3 {grid-column: 1/2;
grid-row: 2;
display: flex;
justify-content: center;
align-items: center;
margin:10px;
}
.section5 { /*GAMES*/
background: linear-gradient(#b2bcff, white);
text-align: center;
grid-column: 2/4;
grid-row: 4/5;
height: auto;
border-width: thin;
border:solid;
border-color:#5b4cdc;
}
.nest5 { /*Nest para los videojuegos*/
display:flex;
flex-direction: row;
width:100%;
background-color: transparent;
margin-top: 15px;
margin-bottom: 10px;
flex-wrap:wrap;
justify-content:space-evenly;
}
.section5a { /*ACE ATTORNEY*/
background-color: transparent;
inline-size: 85px;
overflow-wrap: break-word;
}
.section6 { /*COMPLETE*/
background-color: #b2bcff;
grid-column: 1/4;
grid-row: 5/6;
background: linear-gradient(#b2bcff, white);
border-width: thin;
border:solid;
border-color:#5b4cdc;
}
.nest6 { /*Nest para el media*/
display: grid;
height: auto;
width:auto;
justify-content: center;
grid-template-columns: 1fr 1fr 1fr;
align-content: center;
margin: 5px;
}
.section6a { /*BOOKS*/
text-align: left;
background-color: #b2bcff;
border-color: #495582;
border-width:1.5px;
border-right-style: dashed;
border-left-style: dashed;
margin: 5px;
mix-blend-mode: multiply;
}
.section6b { /*MEDIA*/
text-align: left;
border-color: #495582;
border-width:1.5px;
border-right-style: dashed;
border-left-style: dashed;
background-color: #b2bcff;
margin: 5px;
mix-blend-mode: multiply;
}
.section6c { /*Games*/
text-align: left;
background-color: #b2bcff;
border-color: #495582;
border-width:1.5px;
border-right-style: dashed;
border-left-style: dashed;
margin: 5px;
mix-blend-mode: multiply;
}
.pixel {
padding-top:5px;
height: 52px;
display:inline-block;
}
.pixeldiv {
text-align: center;
}
a.navlink:link {text-decoration: none;
color: white;
}
a.navlink:visited {text-decoration: none;
color: white;}
a.navlink:hover {text-decoration: none;
color: #000000;
}