html {
    min-height: 100%;
}

:root{
background: linear-gradient(0deg, #210202 0%, #4d1010 100%);
}

body {
border: 10px solid #3c0a0a;
max-width: 80%;
margin: 0 auto;
color:#fbfbfb;
}
card { max-width: 70%; margin: 0 auto; border-style:solid; border-width:1px; text-align:left;}
h2 {padding:2% 0 0 2%;}
p {margin: 20px 0 0 40px ;}


.card {border-style:solid;border-width:1px;border-collapse:collapse;border-spacing:0;border-color:#00000060;margin: 15px;background-color:#00000040; }
.card th{font-family:Arial, sans-serif;font-size:14px;overflow:hidden;padding:5px 5px;word-break:normal;text-align:left;vertical-align:top}
.card .card-name{ color:#fbfbfb; background-color:#00000040;text-align:left;vertical-align:top;font-weight: bold;font-size:16px;padding:1% 0 1% 2%;}
.card .card-input{color:#b0b0b0; background-color:#00000020;text-align:left;vertical-align:top;font-weight: bold;font-size:16px;padding:1% 0 1% 2%;}
.card .card-image{color:#b0b0b0; background-color:#00000080;text-align:left;vertical-align:top}
.card .card-propeties1{color:#b0b0b0; background-color:#00000020;text-align:center;vertical-align:top; height: 20%;}
.card .card-propeties2{color:#b0b0b0; background-color:#00000040;text-align:center;vertical-align:top; height: 20%;}

characterinfo { float: left; border-bottom: 10px solid #3c0a0a; border-top: 10px solid #3c0a0a;
width: 100% ; color:#fbfbfb;}
portrait { float: right; border-left: 10px solid #3c0a0a; width:160px; height:240px; color:#fbfbfb;}
nav {position: fixed; top: 0; left: 90% ; width: auto;border: 10px solid #3c0a0a; color:#fbfbfb;}
nav a {color:#fbfbfb; text-decoration: none;}