movie.css

body{
    background-image:url("background.png");
    background-repeat: repeat;

}
h1{
    text-align: center;
    font-family: Tahoma Verdana sans-serif;
    font-size: 24pt;
    font-weight: bold;
    text-shadow: 3px 3px  #999999;
}
div.banner{
    background-image: url("bannerbg.png");
    background-repeat: repeat-x;
    text-align: center;
}
div.grid-container{
    display: grid;
    grid-template-areas:
    'top-header left-comment'
    'comment left-comment'
    'footer footer';
    width: 800px;
    border-radius: 20px;
    border: 4px gray solid;
    margin: 0 auto;
    overflow: hidden;
}
div.header{
    grid-area:top-header;
    display: inline;
    width: 550px;
    background-image: url("rbg.png");
    background-repeat: repeat-x;
    border-radius: 20px 0px 0px 0px;
}
div.overview{
    grid-area:left-comment;
    width: 250px;
    background-color: #A2B964;
    font-family: Arial sans-serif;
    font-size: 8pt;
    padding-right: 5px;
    padding-top: 0px;
}

div.comment-area{
    grid-area: comment;
    display: grid;
    grid-template-columns:repeat(2,1fr);
    grid-column-gap: 11px;
    width: 540px;
    margin-top:0px;
    margin-left: 5px;
    padding:0px;
}

div.footer-area{
    grid-area: footer;
    background-color: #A2B964;
    text-align: center;
    padding: 0px;
}
dt{
    font-weight: bold;
    font-family: Arial sans-serif;
    font-size: 8pt;
    line-height: 10pt;
    padding: 5px;
}
p.box{
    font-family: Tahoma Verdana sans-serif;
    font-size: 10pt;
    font-weight: bold;
    background-color: #E8DC9B;
    border-radius: 10px 10px 10px 10px;
    border: gray solid 2px;
    padding: 6px;
}
span.percent{
    font-size: 48pt;
    color: red;
    font-weight: bold;
    vertical-align: top;

}
.comment-area .box img{
    float:left;
    margin-right: 2px;
}
img.pictures{
    float:left;
    margin-right: 2px;
}

div.validator-position{
    opacity: 50%;
    position:fixed;
    bottom: 0px;
    right: 0px;


}