body { margin: 0; font-family: sans-serif; color: #333; }

a { color: #007dbd; text-decoration: none; }
a:hover { color: #93268f; }

h2 { font-size: 30px; margin: 0 0 30px; }

.project-name { background: #007dbd; color: #fff; margin: 0 0 50px; padding: 40px; text-align: center; font-weight: normal; }

.main-content { margin: 0 auto; max-width: 900px; text-align: center; }

.site-footer { padding: 50px 20px; text-align: center; }

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

.brand { display: flex; justify-content: center; margin-bottom: 50px; }

.brand-color { float: left; font-size: 14px; }

.brand-color__item { width: 100px; height: 100px; line-height: 100px; text-align: center; border-radius: 3px; margin: 0 10px 10px 0; color: #fff; text-shadow: 0 0 1px rgba(0, 0, 0, 0.2); }
.brand-color__item:nth-of-type(2n + 1) { clear: left; }

.box-1 { background: #007dbd; }

.box-2 { background: #b9e5fb; }

.box-3 { background: #93268f; }

.box-4 { background: #a962a7; }

.box-5 { background: #53b698; }

.box-6 { background: #5c7b80; }

.box-7 { background: #e28b50; }

.box-8 { background: #d29871; }

.text-center { text-align: center; justify-content: center; }

.row { display: flex; }