﻿<html>
/*Lindsay Hamston, Version 2 */
/*

<style>

* {     box-sizing: border-box; }
body {
    font-family: Calibri;
    padding: 12px;
    background: royal blue;
}

/* Page title */
.header {
    padding:10px;
    text-align: center;
    background: white; }

.header h1 { font-size: 40px;
	     color: blue;
	     text-align: center; }


/* navigation bar */
.topnav {
    overflow: hidden;
    background-color: #00004d;  }


/* Style the navigation links */
.topnav a {
    float: left;
    display: block;
    color: white;
    text-align: center;
    padding: 15px 20px;
    text-decoration: none; }

/* Color when hovering over links in navigation bar */
.topnav a:hover {
    background-color: skyblue;
    color: black;
    font-weight: bold;
}

/* Create one column */
.leftcolumn {   
    float: left;
    width: 95%; }


/* Add a card effect for articles */
.card {
    background-color: white;
    padding: 20px;
    margin-top: 0px; }

/* Clear floats after the column */
.row:after {
    content: "";
    display: table;
    clear: both; }

/* Bullet points for a list */
ul.a {
    list-style-type: square;
}

/*expanding & collapsing section for topic page*/
.expand {
    background-color: #666699;
    color: White;
    font-weight: bold;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: solid;
    text-align: left;
    outline: none;
    font-size: 15px;
}

.active, .expand:hover {
    background-color: #b3b3cc;
    color: #000066;
    font-weight: bold;
}

.expand:after {
    content: '\002B';
    color: white;
    font-weight: bold;
    float: right;
    margin-left: 5px;
}

.active:after {
    content: "\2212";
}

.content {
    padding: 0 18px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    background-color: #f1f1f1;
}

</style>

</html>
