* { box-sizing: border-box; }
body { position: relative; margin: 0; padding: 0; font-family: "Overpass", Arial, Helvetica, "sans-serif"; color: #999; text-align: center; font-size: 16px; font-weight: 300; }
.hidden { display: none; }
.red { color: #d80036; }
img { border-right: 0; }
a { color: #808080; }
a:hover { color: #505050; }
a:hover b { color: #333; }
.clear { clear: both; }
h1 { font-size: 36px; color: #d80036; margin: 0 275px 30px 0; line-height: 45px; font-weight: 800; }
h2 { font-size: 22px; color: #d80036; margin: 40px 0 20px 0; line-height: 32px; }
h3 { font-size: 22px; color: #999; margin: 20px 275px 20px 0; line-height: 32px; font-weight: 300; }
p, li { line-height: 25px; }
b, strong { font-weight: 600; color: #808080; }
#container { margin: 100px auto; width: 960px; text-align: left; }
#container .col { float: left; width: 400px; margin-right: 80px; }
#clients { width: 100%; list-style: none; margin: 20px 0; padding: 0; display: -webkit-flex; display: -ms-flexbox; display: -ms-flex; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; }
#clients li { padding: 0 19px 0 0; margin: 0 20px 30px 0; width: calc(20% - 20px); line-height: 16px; border-right: 1px solid #eee; }
#clients li:last-of-type { border-right: 0; }
#clients li a { cursor: pointer; display: block; text-decoration: none; font-size: 12px; padding-top: 120px; background-repeat: no-repeat; background-position: 0 0; background-size: contain; }
#clients li b { display: block; margin: 0 0 10px 0; }
#clients li b i { font-weight: 300; font-style: normal; color: #bbb; }
#footer { background: url("footer-logo.png") no-repeat top left; margin: 100px 0 0 0; padding: 0 0 0 50px; line-height: 33px; }
#cookie-bar { position: fixed; bottom: 0; left: 0; right: 0; background: #d80036; line-height: 20px; color: rgba(255,255,255,0.75); text-align: center; padding: 10px 20px; z-index: 99; }
#cookie-bar a { color: #fff; text-decoration: none; }

@media only screen and (min-width : 1200px) {
	#clients li:nth-child(5n) { border-right: 0; }
}

@media only screen and (max-width : 1199px) {
	#container { margin: 100px; width: auto; text-align: left; }
	#container .col { float: left; width: 400px; margin-right: 80px; }
}

@media only screen and (max-width : 1159px) {
	#clients li { width: calc(25% - 20px); border-right: 1px solid #eee; }
	#clients li:nth-child(4n) { border-right: 0; }
}

@media only screen and (max-width : 999px) {
	h1 { margin-right: 100px; }
	h3 { margin-right: 100px; }
	#clients li { width: calc(33.33% - 20px); border-right: 1px solid #eee; }
	#clients li:nth-child(3n) { border-right: 0; }
	#container .col { float: none; width: auto; margin-right: 100px; }
}

@media only screen and (max-width : 767px) {
	h1 { margin-right: 0; }
	h3 { margin-right: 0; }
	#container .col { margin-right: 0; }
	#clients li { width: calc(50% - 20px); border-right: 1px solid #eee; }
	#clients li:nth-child(2n) { border-right: 0; }
}

@media only screen and (max-width : 674px) {
	#container { margin: 50px; }
	#clients li { width: 100%; border-right: 0; padding: 0 0 30px 0; margin: 0 0 30px 0; border-bottom: 1px solid #eee !important; }
	#clients li a { max-width: 175px; }
}

@media only screen and (max-width : 400px) {
	h1 { font-size: 28px; line-height: 36px; }
	h2 { font-size: 18px; line-height: 24px; }
	h3 { font-size: 18px; line-height: 24px; }
	p, li { font-size: 13px; line-height: 20px; }
	#footer { font-size: 12px; line-height: 20px; }
}