.widget-area {
	background-color: #f5f5f5;
	overflow: auto;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	justify-content: space-around;
	flex-direction: column;
	align-items: center;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.widget-container {
    margin: 13px 0;
    vertical-align: top;
}

.widget {
	margin: 0;
	line-height: 18px;
	min-width: 250px;
	
	.widget-title {
		font-weight: normal;
		margin: 0 0 12px 0;
		font-size: $small-header-font-size;
		color: black;
	}
	
	ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
	}
	
	a {
		display: block;
	    text-decoration: none;
	    color: $main-color;
	    font-size: $small-font-size;
	}
}

@media only screen and (min-width: 550px) {
	.widget-area {
		padding: 20px 5vw;
		flex-direction: row;
		align-items: stretch;
	}
	
	.widget-container {
	    display: inline-block;
	    margin: 0;
	}
	
	.widget {
	    float: none;
	    left: 0;
	}
}

@media only screen and (min-width: 783px) {
	.widget-area {
		padding: 30px 10vw;
	}
}