*{
    box-sizing:border-box;
}
.social {
    height: 44px;
    display: flex;
    background: black;
    top: 0;
    left: 0;
    width: 100%;
}

.social a {
float:left;
display: block;
padding: 5px;
}

.header {
    margin: 0px;
    border: 0px;
    padding: 0px;
    padding-top: 20px;
    padding-left: 450px;
}

#navigation {
    left: 0;
    width: 100%;
}
.topnav {
    overflow: hidden;
    background-color:  black;
}
.topnav a {
    float: left;
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

.topnav a:hover {
    background-color: gold;
    color: black;
}
.topnav a:active{
    background-color: white;
}

.column {
    float: left;
    padding-top: 30px;
    padding: 50px;
    
}
.left, .right {
    width: 25%;
}
.middle {
    width: 50%;
}

.row:after {
    content: "";
    display: table;
    clear: both;
}

@media screen and (max-width: 600px){
    .column{
        width: 100%;
    }
}
.carousel {
    width: 600px;
    height: 600px;
}
section {
    width: 400px;
    padding-top: 300px;
	margin: 0 auto;
}

section textarea {
	width: 100%;
	height: 70px;
	padding: 5px;
	outline: none;
	font-size: 80%;
	margin-bottom: 20px;
    border: 1px solid gold;
	border-bottom: 4px solid gold;
}

section p {
	float: left;
	line-height: 30px;
}

section span {
	font-weight: bold;
}

section button {
	border: 0;
	width:	30%;
	color: white;
	height: 35px;
	float: right;
	outline: none;
	cursor: pointer;
	font-weight: 700;
	background-color: gold;
	border-bottom: 3px solid gold;
}

section button:hover {
	background-color: gold;
	border-bottom: 3px solid gold;
}

section button:disabled {
	background-color: teal;
	border-bottom: 3px solid teal;
}

section ul {
	margin-top: 60px;
	list-style: none;
	padding-left: 0px;
}

section ul li {
    padding: 10px 10px;
    word-wrap: break-word;
	border-bottom: 3px solid gold;
}

section ul li:hover {
	border-bottom: 3px solid gold;
}