@charset "UTF-8";
/* CSS Document */


body {
	margin: auto;
	font-family: 'Source Sans Pro', sans-serif;
    background-color: #696969;
    width:960px;
}
header{
	border: 2px solid #BD6514;
	background-color:lightsalmon;
}
header img {
    padding: 5px;
    border: 10px solid #FFF8F8;
    margin: 5px;
    margin-bottom:20px;
}
h1 {
	font-family: 'Cardo', serif;
	font-size: 2em;
	padding-top: 4px;
	padding-left: 4px;
	margin-bottom: 40px;
	margin-left: 40px;
	margin-right: auto;
	margin-top: 40px;
	background-color: black;
	color: burlywood;
}
section {
	text-align: left;
}

h1, h2 {
	font-family: 'Source Serif Pro', serif;
	font-size: 1.5em;
}
h2 {
	padding: 20px;
    text-transform: uppercase;
    font-size: 2.5em;
    color:aliceblue;
}
ul {
	font-size: 1.5em;
	font-weight: 600;
    
}
.bottom ul{
    display:flex;
    flex-wrap:wrap;
}
li {
	padding: 10px;
}
div {
    display:flex;
    flex-wrap:nowrap;
    flex-direction:row;
}
section ul a {
	display: block;
	background: lightsalmon;
	padding: 20px 10px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	color: black;
	font-weight: bold;
    border-bottom: 2px solid tomato;
    border-right: 2px solid tomato;    
}
section ul a:hover { 
    color:#017c8d; }

@media only screen and (min-width: 450px){
     body{
         width:auto;
    }
    div {
        display:flex;
        flex-direction:column;
    }
    h1, h2 {
	    font-family: 'Source Serif Pro', serif;
	    font-size: 1.5em;
    }
    h2 {
        padding: 20px;
        text-transform: uppercase;
        font-size: 2em;
        color:aliceblue;
    }
    ul {
        font-size: 1.5em;
        font-weight: 600;
    }
    li {
        padding: 10px;
    }
    header img {
        width:380px;
        padding: 5px;
        border: 10px solid #FFF8F8;
        margin: 5px;
        margin-bottom:20px;
    }
}
@media only screen and (min-width: 650px){
    body{
        width:auto;
        margin:30px;
    }
    div {
        display:flex;
        flex-wrap:wrap;
        flex-direction:column;
    }
    h1, h2 {
	    font-family: 'Source Serif Pro', serif;
	    font-size: 1.5em;
    }
    h2 {
        padding: 20px;
        text-transform: uppercase;
        font-size: 2em;
        color:aliceblue;
    }
    ul {
        font-size: 1.5em;
        font-weight: 600;
    }
    header img {
        width:400px;
        padding: 5px;
        border: 10px solid #FFF8F8;
        margin: 5px;
        margin-bottom:20px;
    }
}
@media only screen and (min-width: 950px){
    div {
    display:flex;
    flex-wrap:nowrap;
    flex-direction:row;
}
}