body{background-color:#DEB887;
     font-family: Verdana, sans-serif;
     font-size: 0.95em;
}

h2{color: #fff ;
   text-decoration: underline;
   font-style: oblique;
   }

h3 {color:#fff;
   background-color:#ffa900;
   padding-left:5px;
   }

video {height: 235px;
       width:400px;

}

#page-top-liner{display: flex;
                flex-flow: row wrap;
                align-content: flex-start;
                align-items: center;
}

#site-header{display: flex;
}

#footer{background-color: lightgrey;
        border: 1px outset gold;


}


/***********************************
* #nav CSS
***********************************/
#nav{display: flex;
     flex-flow: row wrap;
     justify-content: space-between;
     align-items: center;
     height: 1.5em;
     width: 100%;
     border: 2px outset gold;
     background-color: black;
     }

#nav a:link{font-size:0.9em;
            font-weight:bold;
            color: white;
            }

#nav a:visited{text-decoration:none;
               color: white;
               }

#nav a:hover{text-decoration:underline;
             color: gold;
             }

#nav a:active{text-decoration:underline;
              color:#ffa900;
            }

/***********************************
* Infobox classes
***********************************/
.infobox{margin-left: 1.5em;
         margin-bottom: 0.5em;
         border: 2px outset gold;
         border-collapse: collapse;
         }

.infobox-picture{width: 100%;
                }

.infobox-header-header{border: 1px solid black;
                       background-color: slategrey;
                       color: white;
                       text-align: center;
                       font-size: 0.7em;
                       }

.infobox-header{border: 1px solid black;
                background-color: grey;
                font-size: 0.7em;
                }

.infobox-item{border: 1px solid black;
              background-color: lightgrey;
              font-size: 0.7em;
              padding: 0.33em;
              }

/***********************************
* Statbox classes
***********************************/
.statbox-section{border: 2px outset gold;
                 border-collapse: collapse;
                 margin-top: 0;
                 margin-bottom: 0;
                 margin-left: auto;
                 margin-right: auto;
                 font-size: 0.8em;
                 width: 75%;
                 }

.statbox-classes-section{border: 2px outset gold;
                 border-collapse: collapse;
                 margin-top: 0;
                 margin-bottom: 0;
                 margin-left: auto;
                 margin-right: auto;
                 font-size: 0.8em;
                 width: 95%;
                 }

.statbox-towns{border: 2px outset gold;
               border-collapse: collapse;
               margin-top: 0;
               margin-bottom: 0;
               margin-left: auto;
               margin-right: auto;
               font-size: 0.9em;
               width: 95%;
               }

.statbox-battles-section{border: 2px outset gold;
                 border-collapse: collapse;
                 margin-top: 10px;
                 margin-bottom: 10px;
                 margin-left: auto;
                 margin-right: auto;
                 font-size: 0.8em;
                 width: 75%;
                 }

.statbox-header-header{border: 1px solid black;
                       background-color: slategrey;
                       color: white;
                       text-align: center;
                       }

.statbox-header{border: 1px solid black;
                background-color: grey;
                text-align: center;
                }

.statbox-item{border: 1px solid black;
              background-color: lightgrey;
              text-align: center;
              }


/***********************************
* Next-Previous Banner id and classes
***********************************/
#next-previous-banner{width: auto;
                      height:25px;
                      background-image:url(images/header_bg.gif);
                      background-repeat:repeat-x;
                      padding-top: 2px;
                      }

.previous-scene{margin-left: 10px;
                float: left;

}

.next-scene{margin-right: 10px;
            float: right;

}


/***********************************
* Game specific override classes
***********************************/
.MOTBQ-resistance{width: 16.66%;
                  }

.MOTBQ-stat{width: 25%;
            }

.MOTBQ-unit{width: 24%;

}

.POLC-default-equip{width: 50%;
                    }

.POLC-stat{width: 14.28%;
           }

.LUCT-description{width: 75%;
                  }
.hide-until-built{display: none;
                  }
/***********************************
* semi-generic classes
***********************************/
.new-section{clear: both;
             }

.image-caption{padding: .25em 1em;
               font-family: serif;
               font-size: 80%;
               background: rgba(0, 0, 0, .1);
               }

.left-side-figure{float: left;
                  }

.right-side-figure{float: right;
                   }

.figure-border{border: 2px outset gold;

}

.low-margin-figure{margin: 10px;}

.put-in-center{margin-left: auto;
               margin-right: auto;
               }

.left-column{float: left;
             width: 48%;
             }

.right-column{float: right;
              width: 48%;
              }

.a-quote{text-align: center;
         margin-left: auto;
         margin-right:auto;
         width: 66%;
         font-size: 0.9em;
         font-style: italic;
         }

.flavor-text{font-style: italic;
             font-size: 0.95em;

}

.dialogue{font-size: 1em;
          font-style: italic;

}

.dialogue-other-person{font-size: 0.8em;
                       font-weight: bold;

}

.bold-text{font-weight: bold;

}

.full-height-picture{height: 100%;
                     }

.standard-width{width: 40%;
                }

.header-needs-adjusting-small{width: 45%;
                              }

.hidden{display: none;
        }


/***********************************
* Category classes
***********************************/
.category-episode{list-style: none;
                 padding-left: 0;
                 }


.category-header-header{color:#fff;
                        background-color: slategrey;
                        font-size: 1.1em;
                        font-weight: bold;
                        border: 2px outset gold;
}
.category-header-header-active{border: 2px inset gold;

}

.category-header{color:#fff;
                 background-color:#ffa900;
                 font-size: 1.1em;
                 font-weight: bold;
                 padding-left: 3px;
                 padding-right: 3px;
}

.category-list{list-style: none;
               padding-left: 0;

}

.category-list a:link{font-size:0.9em;
                      font-weight:bold;
                      text-decoration: none;
}

.category-list a:visited{text-decoration:none;
                         color: purple;
}

.category-list a:hover{text-decoration:underline;
                       color: white;
}

.category-list a:active{text-decoration:underline;
                        color:gainsboro;
}

/***********************************
* Japanese
***********************************/
.katakana{font-size: 1.05em;
          font-weight: bold;
          }

.translate-romanji{font-size: 0.8em;
                   font-style: italic;
                   }

/*///////////////////////////////////////////////////////////////*/
@media screen and (min-width: 600px)
{

    .statbox-section{border: 2px outset gold;
        border-collapse: collapse;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: auto;
        margin-right: auto;
        font-size: 1em;
        width: 55%;
    }

    .statbox-towns{border: 2px outset gold;
        border-collapse: collapse;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: auto;
        margin-right: auto;
        font-size: 1em;
        width: 65%;

    }

    .header-needs-adjusting-medium{width: 70%;
                                   }

}
/*///////////////////////////////////////////////////////////////*/
@media screen and (min-width: 1050px)
{
    body{background-color:#008500;
        font-family: Verdana, sans-serif;
        font-size: 1em;
        }

    #container{width: 820px;
               height:auto;
               margin:auto;  /*centers webpage*/
               background-color:#DEB887;
               padding:7px
               }

    #nav{display: flex;
        flex-flow: row wrap;
        justify-content: space-between;
        align-items: center;
        margin-left: 3em;
        width: 50%;
        height: 1.5em;
        border: 2px outset gold;
        background-color: black;
    }

    .infobox-header{border: 1px solid black;
                   background-color: grey;
                   }

    .infobox-item{border: 1px solid black;
                 background-color: lightgrey;
                 font-size: 1em;
                 padding: 0.33em;
                 }

    .header-needs-adjusting-large{width: 66%;

    }

    .statbox-section{border: 2px outset gold;
        border-collapse: collapse;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: auto;
        margin-right: auto;
        font-size: 0.9em;
        width: 60%;
    }

    .statbox-towns{border: 2px outset gold;
        border-collapse: collapse;
        margin-top: 0;
        margin-bottom: 0;
        margin-left: auto;
        margin-right: auto;
        font-size: 1em;
        width: 75%;

    }

    .statbox-battles-section{border: 2px outset gold;
        border-collapse: collapse;
        margin-top: 25px;
        margin-bottom: 25px;
        margin-left: auto;
        margin-right: auto;
        font-size: 0.8em;
        width: 60%;
    }

    #category-page-container{width: 820px;
                             height: 67em;
                             margin: auto;  /*centers webpage*/
                             background-color:#DEB887;
                             padding:7px
                             }

    #footer{background-color: lightgrey;
            border: 1px outset gold;
            width: 820px;
            height:auto;
            margin:auto;
            padding: 6px;


    }

}