@charset "UTF-8";
/*
Purpose: Basic style sheet for Web Project 2
Author: Andrew Addens
Course: ITWP 1100
*/

/* adds 10 pixels of padding around the header and main elements, sets the width to 100% */
header, main {
    padding: 10px;
    width: 100%;
}

h1, h2 {
    text-align: center;
}

/* adds 10 pixels of padding around the nav element and displays a 2 pixel solid black border below and above the nav element, sets width to 100% */
nav {
    padding: 20px;
    width: 100%;
    text-align: center;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
}

body {
    background-color: #646D7F;
    color:#FFF;

}

p {
    text-align:center;
    padding-left: 10px;
    padding-right: 40px;
}

.center {
    text-align: center;
}

.left {
    text-align: left;
}

/* adds 10 pixels of padding around the footer element and creates a 2 pixel solid black border above the footer, centers the footer text, sets the width to 100% */
footer { 
    padding: 10px;
    border-top: 2px solid #000;
    width: 100%;
    text-align:center;
    position: absolute;
}

/* Positions the footer at the bottom of the screen when there isn't a lot of content */
.footer {
    left: 0;
    bottom: 0;
    width: 100%;
}

#player {
    margin: auto;
    border: 3px solid #333;
    padding: 10px;
}

/* main table tag */
table {
    margin: auto;
    border: 5px solid #2EA7EC;
    width: 100%;
    border-spacing: 0;
}

.shrink { /* scales down size by 25%, specifically for tables */
    transform: scale(0.75);
}

td, th {
    border-style:groove;
    padding: 0.5em;
    width:auto;    
    text-align:center;
    }
        
tfoot td {
    font-size: 10px;
    font-style: italic;
    text-align: center;
    }
        
tr:nth-of-type(even) {
    background-color: #000;
    }
        
thead:first-of-type {
    background-color: #2EA7EC;
    color:#FFF;
    }

/* responsive image class */
img.responsive {
    max-width: 100%; /* allows the image to scale down if it has to, but it will not scale up in size to be larger than its original size */
    height: auto;
}

/* used to format form/picture into a table */
.container {
      display: flex;
    }
.column {
      flex: 1;
      padding: 20px;
    }









span.plusminus img {
    display: inline-block;
    width: 30px;
    margin: -5px 30px -5px 10px;
    }
    dl#faq {
    display: block;
    width: 85%;
    margin: 0 auto;
    padding-bottom: 10px;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
    }
    
    dl#faq dt {
    background: url("minus.png") left center/25px no-repeat ;   
    font-size: 1.4em;
    display: block;
    margin: 10px 0 10px;
    text-indent: 60px;
    color: rgba(91,155,213,1.00); 
    cursor: pointer;
    user-select: none;
    }
    
    dl#faq dt.hiddenAnswer {
    background: url("plus.png") left center/25px no-repeat ;
    }
    
    
    dt + dd {
    display: none;
    }
    
    dl#faq dd p {
    font-size: 1.2em;
    line-height: 1.2;
    margin: 0 0 15px 65px;
    font-family: "Gill Sans", Helvetica, Arial, sans-serif;
    text-align: justify;
    }