html{position:relative;height:100%;min-height:100%}
body{
background-image:url('img_index/fondo-.png');
background-size:cover;background-attachment:fixed;
color:#3A3A3A;
font:15px 'Rubik';
text-align:justify
}
a{color:inherit;text-decoration:inherit}
p{margin:0 0 20px 0;text-align:justify;line-height:25px}
li{margin-bottom:5px;list-style:disc;line-height:25px}
#header{
width:900px;min-height:150px;margin:auto;
position:relative;
& #title{
color:#FFFFFF;
font-size:25px;font-weight:600;
position:absolute;top:70px;left:280px;
&:hover{text-decoration:2px solid underline}
}
& #link{
font-size:14px;font-weight:700;
color:rgb(255, 255, 255);
text-transform:uppercase;
position:absolute;
bottom:15px;left:270px}
table tr td{
padding:5px 10px;
cursor:pointer;
&:hover{text-decoration:1px solid underline}}
}
#header-logo{
width:250px;height:70px;
background-image:url('img_index/logo-.png');
background-size:contain;background-repeat:no-repeat;
position:absolute;
bottom:20px;left:20px
}
#fanmade-wiki{
width:830px;min-height:950px;
margin:auto;padding:25px 35px;
background-color:rgb(227,213,202, 0.90);
position:relative;
& a{color:#02456E;text-decoration:solid underline;&:hover{color:#000609}}
}

#ii{width:270px;margin:0 0 20px 35px;float:right}

.gallery{margin:auto;text-align:center;
& img{width:98%;border:1px solid #C3C6C6}}
#navigation{display:flex;flex-direction:row;justify-content:center}
.button{
padding:5px;
font-size:15px;font-weight:600;
color:#686868;
border-bottom:2px solid transparent;
cursor:pointer;
&:hover{color:#3A3A3A}
&.active{color:#006CB0;border-bottom:2px solid #006CB0}
}

#section{
padding:9px 0 9px 9px;
border-bottom:1px solid #ADC7FA;
display:flex;flex-direction:row}
#iii{width:90px;font-weight:600}
.section-table{
padding:2px;
color:rgb(255, 255, 255);
font-size:14px;font-weight:700;
text-align:center;
border-radius:1.5em;
}
.section-table.i{background-color:#000000;
& a:hover{text-decoration:1px solid underline}}
.section-table.ii{background-color:#2E8B57}

h1{margin:0 0 15px 0;font-size:35px;font-weight:300}
h2, h3{font-family:'Roboto Slab';font-weight:400}
h2{
margin:15px 0 10px 0;
padding-bottom:5px;
font-size:24px;
border-bottom:1px solid #B9AEA6
}
h2.short{width:525px}
h3{margin-top:25px;font-size:18px}

#gallery-section{display:flex;justify-content:center}
.gallery-img{
width:200px;height:fit-content;
font-size:12px;text-align:center;
& p{margin:0;text-align:left;line-height:normal}
& img{width:150px;margin-bottom:10px}}
.gallery-img.left{float:left;margin-right:15px}
.gallery-img.right{float:right;margin-left:15px}


#content{
width:300px;
border:1px solid #B9AEA6;
border-radius:8px;
& #title{list-style:url('img_index/menu-.png') inside;margin:0;font-weight:600}
}
#content-title{display:flex;align-items:center;justify-content:space-between;margin:10px}
.content-show{
padding:10px;
border-top:1px solid #B9AEA6;
& button{
width:100%;padding:5px 10px;
background:none;border:none;
font:16px 'Rubik';color:#3A3A3A;
text-align:left;
border-radius:3px;
cursor:pointer;
&.ii{padding:5px 10px 5px 20px}
&.iii{padding:5px 10px 5px 30px}
& span{color:#7C7470;margin:0 10px 0 0}
&:hover{background-color:#BDB6B4;color:#02456E}
}
}
#hide-show{font-size:12px;color:#02456E;cursor:pointer;
&:hover{color:#000609}
&::before{content:'[ ';color:#3A3A3A}
&::after{content:' ]';color:#3A3A3A}}

.other-links{
width:830px;
margin:auto;padding:15px 35px;
background-color:#280033;
color:#FFFFFF;
font-size:13px;text-transform:uppercase;
& a{color:#FFC500;font-weight:700}
& a:hover{color:#FFFFFF}
& p{margin:3px;text-align:center}
& span{margin:0 10px;&::before{content:'|';}}
}

.quote{padding:0 0 30px 30px}

table.content{
width:270px;margin:0 0 0 30px;
background-color:#E3D5CA;
font-size:12px;
text-align:left;
float:right;
border-collapse:collapse;
border:1px solid #B22222;
border-radius:10px;
& th.title{margin:2px;padding:3px;background:#FF0000;color:#FFFFFF;font-weight:700;font-size:18px;text-align:center}
& td.i{width:35%;vertical-align:top;padding:5px 0 5px 5px;font-weight:700;border-bottom:1px solid #C38B6E}
& td.ii{padding:5px 0 5px 0;vertical-align:top;border-bottom:1px solid #C38B6E}
}

.gallery{margin:auto;text-align:center;
& img{width:270px;margin:0 -1px -4px -1px}}
#pics-nav{
width:100%;
display:flex;flex-wrap:wrap;
justify-content:flex-start;
border-bottom:1px solid #AAA097
}
#form-nav{
width:100%;margin-bottom:20px;
display:flex;flex-wrap:wrap;
justify-content:flex-start;
border-bottom:1px solid #AAA097
}
.button{
padding:10px 15px;
color:#64605E;
font-size:14px;font-weight:500;
cursor:pointer;
&:hover{color:#02456E;border-bottom:3px solid #02456E}
}