/*External style sheet makes its return... :) twice in one assignment... Well not really because this ocomment is copy + pasted :(*/
/* Style sheet is similar to "Bistro.css" but with changes */



/*Universal selector: styling the box size property to be "border-box"*/
*{ box-sizing: border-box; }

/*Styling elements within the body tag to have a blue background + specific fonts.*/
body 
{ 
    background-color: #00005D;
    font-family: Verdana, Arial, sans-serif; 
}

/* Styling the wrap id so that it has a specific size & minimum size, with a blue background */
#wrapper 
{ 
    margin: 0 auto; 
    width: 80%; 
    min-width: 940px;
    background-color: #B3C7E6; 
    color: #000066; 
}

/* CHANGED: The header was changed so that it will print black text with a font size of 20 pt*/
header 
{ 
 color: #000000; 
 font-size: 20pt; 
}

/*CHANGED: modified the nav part so that it doesn't display while printing.*/
nav 
{ 
    display: none;
}

/* Configuring the ul elements within the nav with some padding & margins, alongside making them have no list markers (bullet points). */
nav ul 
{ 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
}

/* Styling the "link text" or anchor tags to have no underline, some padding, and a white 1-pixel boarder. */
/* The "display:block" part essentially functions as a way of making each clickable link a button; you can
    click anywhere within the given box for the link to use it! */
nav a 
{ 
    text-decoration: none; 
    padding: 20px; 
    display: block;
    background-color: #B3C7E6;
    border-bottom: 1px solid #FFFFFF; 
}

/* Pseudo-classes again: basically changing the color of the link when it is used, hovered over, and not touched at all. */
/* Not the hover changes the background cover as if you're selecting a button. Fancy! */

nav a:link { color: #FFFFFF; }
nav a:visited { color: #EAEAEA; }

nav a:hover 
{ 
    color: #869DC7;
    background-color: #EAEAEA; 
}

/* CHANGED: modified the main so that it displays in limited font types and with a font size of 12pt */
main 
{ 
 font-family: "Times New Roman", serif; 
 font-size: 12pt; 
}

/*Footer styling: styling the footer so that it has a smaller font size, another blue background, padding, and "clear: both".*/
footer 
{ 
    font-size: 70%; 
    text-align: center;
    padding: 10px;
    background-color: #869DC7; 
    clear: both; 
}

/*Changing the header color to a blueish color and change the font style*/
h2 
{ 
    color: #869DC7;
    font-family: Arial, sans-serif; 
}

/* Configuring the float right id so that when used, there is a 10px margin + contents are right-oriented within their container.*/
#floatright 
{ 
    float: right; 
    margin: 10px; 
}