html{
position:relative;
height:100%;min-height:100%
}

[data-theme="fanmade-wiki"]{
/* GENERAL */
--image-background:url('img_tartan-clovers/fondo-wiki.png');
--color-text:#3A3A3A;
--link-color:#006CB0;
--link-hover:#002D4A;
--selection:var(--link-color);

/* CHANGE-BUTTOM */

/* NAVIGATION-BUTTONS */
--button-menu-i:#B53A4D;
--button-background:#000000;
--border-menu:2px solid #B53A4D;
--border-button:1px solid #B53A4D;
--button-text:#FFFFFF;
--border-text-i:2px 1px 1px #000, 1px -2px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px 0px 0 #000, 0px 2px 0 #000, -2px 0px 0 #000, 0px -2px 0 #000, 2px 2px 2px #DD658B00;
--border-text-ii:2px 1px 1px #B53A4D, 1px -2px 0 #B53A4D, -1px 1px 0 #B53A4D, -1px -1px 0 #B53A4D, 1px 0px 0 #B53A4D, 0px 2px 0 #B53A4D, -2px 0px 0 #B53A4D, 0px -2px 0 #B53A4D, 2px 2px 2px #DD658B00;

/* HEADER-SECTION */
--header-background:linear-gradient(to bottom, #7AC1C100 25%, #7AC1C1);
--hover-menu:#FFF000;
--title-header:var(--color-text);
--title-header-filter:none;
--title-deco-i:none;--title-deco-ii:none;
--link-shadow:none;

/* TABLE-SECTION */
--title-table-background:#B22222;
--title-text-color:var(--button-text);
--title-text-border:none;
--title-box-shadow:none;
--table-background:#F5F5F5;
--section-border-bottom:1px solid #ADC7FA;
--sub-title-table-i:#000000;
--sub-title-table-ii:#2E8B57;
--section-hover:#006CB0;
--section-border:2px solid #006CB0;


}

[data-theme="valentines-day"] {
/* GENERAL */
--image-background:url('img_tartan-clovers/fondo-.png');
--color-text:#523829;
--link-color:#FF889D;
--link-hover:rgb(204, 96, 116);
--selection:var(--link-color);

/* NAVIGATION-BUTTONS */
--button-menu-i:#FFD0D5;
--button-background:#FFAEBD;
--border-menu:2px solid #FFD0D5;
--border-button:1px solid #FFD0D5;
--button-text:#FFAEBD;
--border-text-i:2px 1px 1px #FFAEBD, 1px -2px 0 #FFAEBD, -1px 1px 0 #FFAEBD, -1px -1px 0 #FFAEBD, 1px 0px 0 #FFAEBD, 0px 2px 0 #FFAEBD, -2px 0px 0 #FFAEBD, 0px -2px 0 #FFAEBD, 2px 2px 2px #DD658B00;
--border-text-ii:2px 1px 1px #FFF, 1px -2px 0 #FFF, -1px 1px 0 #FFF, -1px -1px 0 #FFF, 1px 0px 0 #FFF, 0px 2px 0 #FFF, -2px 0px 0 #FFF, 0px -2px 0 #FFF, 2px 2px 2px #DD658B00;

/* HEADER-SECTION */
--header-background:linear-gradient(to bottom, #7AC1C100 25%, #FFAEBD);
--hover-menu:#FF889F;
--title-header:linear-gradient(#FFD1D4 20%, #FF889D 80%);
--title-header-filter:drop-shadow(0px 0px 1px #FFF) drop-shadow(0px 0px 0px #FFF) drop-shadow(0px 0px 1px #FFF) drop-shadow(0px 0px 0px #FFF) drop-shadow(0px 0px 1px #FFF) drop-shadow(0px 0px 1px #FFF);
--title-deco-i:'ೀ ';--title-deco-ii:' ೀ';
--link-shadow:var(--border-text-i);

/* TABLE-SECTION */
--title-table-background:url('img_tartan-clovers/fondo-título.gif');
--title-text-color:var(--color-text);
--title-text-border:var(--border-text-ii);
--title-box-shadow:-1px -1px 1px inset #0000004D, 2px 2px 1px inset #FFF, 0px 0px 2px #0000001A;
--table-background:#FFF6F7;
--section-border-bottom:1px solid #FFC6CC;
--sub-title-table-i:#FF889F;
--sub-title-table-ii:#FFAEBD;
--section-hover:var(--sub-title-table-i);
--section-border:2px solid #FFC6CC;

/* SUB-TILE */
}

body {
background-image:var(--image-background);
color:var(--color-text);
background-attachment:fixed;
font:15px 'Rubik'
}
::selection{color:#FFF;background-color:var(--selection)}
a{color:inherit;text-decoration:inherit}
#link-i{color:var(--link-color);&:hover{color:var(--link-hover);text-decoration:underline solid}}
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;
background:var(--header-background);
position:relative;
& #title{
background:var(--title-header);
-webkit-background-clip:text;-webkit-text-fill-color:transparent;
filter:var(--title-header-filter);
font-size:25px;font-weight:600;
position:absolute;top:70px;left:280px;
&:hover{color:rgb(49, 88, 92);text-decoration:underline solid 2px}
&::before{content:var(--title-deco-i)} &::after{content:var(--title-deco-ii)}}
& #link{
font-size:13px;font-weight:700;
letter-spacing:1px;
color:rgb(255, 255, 255);
text-transform:uppercase;
text-shadow:var(--link-shadow);
position:absolute;
bottom:15px;left:270px}
table tr td{padding:5px 10px;
&:hover{color:rgb(255, 255, 0);
cursor:pointer}}
}
#header-logo{
width:250px;height:80px;
background-image:url('img_tartan-clovers/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(255, 255, 255);
position:relative
}
#content-i{width:100%;display:flex;flex-direction:row}
#i{width:64%;margin:0 25px 0 0}
#ii{width:270px;position:relative}
table.information{
width:100%;padding:2px;
background-color:var(--table-background);
border:1px solid rgb(195, 198, 198);
border-radius:1.5em;
vertical-align:top;font-size:12px
}
#table-title{
padding:12px 9px;
background:var(--title-table-background);
color:var(--title-text-color);
text-shadow:var(--title-text-border);
font-size:20px;font-weight:700;
text-align:center;
box-shadow:var(--title-box-shadow);
border-radius:1em
}

.gallery{margin:auto;text-align:center;
& img{width:98%;border:1px solid rgb(195, 198, 198)}
& #button{padding:5px;font-size:15px;font-weight:600;color:#686868;border-bottom:2px solid transparent; &:hover{color:var(--section-hover);border-bottom:var(--section-border)}}
& #navigation{display:flex;flex-direction:row;justify-content:center}}

#section{
padding:9px 0 9px 9px;
border-bottom:var(--section-border-bottom);
display:flex;flex-direction:row}
#iii{width:90px;font-weight:600}
#black, #green{
padding:2px;
color:rgb(255, 255, 255);
font-size:14px;font-weight:700;
text-align:center;
border-radius:1.5em
}
#black{background-color:var(--sub-title-table-i)}
#green{background-color:var(--sub-title-table-ii)}
#touou{
width:28px;height:21px;
background-image:url('img_tartan-clovers/touou-.png');
position:absolute;
top:-5px;right:-10px
}
#name{margin-bottom:15px;font-size:35px;font-weight:300}
#sections{width:fit-content;border-bottom:var(--border-button-menu);margin-bottom:20px}
#sections button{
width:166px;padding:10px 0;
background-color:var(--button-background);
font:600 18px 'Rubik';
color:var(--button-text);
border:var(--border-menu);
border-radius:10px 10px 0 0;
cursor:pointer
}
#sections button.i{
background-color:var(--button-menu-i);
font-weight:900;color:rgb(255, 255, 255);
text-shadow:var(--border-text-i)
}
#sections button.ii{
text-shadow:var(--border-text-ii);
&:hover{color:var(--hover-menu)}
}

#fanmade-wiki #theme-button{
padding:5px 10px;
background:transparent;
font:600 14px 'Rubik';
border:var(--border-menu);
border-radius:20px;
position:absolute;
right:35px;
}

.sub-title {
width:100%;
margin:15px 0 10px 0;
padding-bottom:5px;
font-size:24px;
font-weight:500;
border-bottom:1px solid #CECECE;
}

#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}


#content{
width:300px;
border:1px solid #CECECE;
border-radius:8px;
& #title{list-style-image:url('img_tartan-clovers/menu-.png');margin:0;font-weight:600}
}
#content-title{display:flex;align-items:center;justify-content:space-between;margin:10px}
.content-show{
border-top:1px solid #CECECE;
& li{
padding:5px 10px;
list-style:decimal-leading-zero;
font:15px 'Rubik';color:var(--color-text);
text-align:left;
border-radius:3px;
& span{margin:0 0 0 5px}
&:hover{background-color:#D9E9F3;color:#006CB0}}}

#hide-show{font-size:12px;color:#006CB0;cursor:pointer;text-decoration:none;
&:hover{color:#002D4A}
&::before{content:'[ ';color:var(--color-text)}
&::after{content:' ]';color:var(--color-text)}}

#quote{margin:auto;text-align:center;font-family:'Times New Roman';border:none}
#quote-left, #quote-right{font-size:45px;color:#B2B7F2;font-weight:bold;}
#quote-left{vertical-align:top;padding:.3em 0em 0em 0em}
#quote-right{vertical-align:bottom;padding:0}
#quote-center{padding:1em 1em;font-size:16px;font-style:italic;line-height:2}