/* logo */
.logo { position: relative; width: 100%; }
.logo img {
	width: 100%;
	height: auto;
	padding: 30px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

/* logo white */
.logo.white { width: 100%; margin: 20px 0; text-align: center; }
.logo.white img { padding: 0px; max-width: 101px; margin: 0 auto; }
.logo.white .slogan {
	color: #FFFFFF;
	font-weight: 100;
	font-size: 14px;
	position: relative;
	display: inline-block;
	padding-top: 8px;
	margin-top: 10px;
	line-height: 20px;
}
.logo.white .slogan:before {
	content: '';
	width: 36px;
	height: 1px;
	position: absolute;
	top: 0;
	background-color: #FFFFFF;
}

/* logo footer */
.logo.footer { text-align: center; }
.logo.footer img { width: auto; margin: 0 auto; }
.logo.footer .slogan {
	color: #FFFFFF;
	font-weight: 100;
	font-size: 14px;
	position: relative;
	display: inline-block;
	padding-top: 8px;
	margin-top: 10px;
	line-height: 20px;
}
.logo.footer .slogan:before {
	content: '';
	width: 36px;
	height: 1px;
	position: absolute;
	top: 0;
	background-color: #FFFFFF;
}

	/* media specific styles */
	@media(min-width: 768px){
		/* logo */
		.logo img { padding: 45px 0 45px 0; width: 266px; }

		/* logo white */
		.logo.white {
			float: right;
			position: absolute;
			right: 50px;
			bottom: 0;
			width: auto;
		}
	}
	@media(min-width: 1024px){
		/* logo white */
		.logo.white { bottom: auto; top: 35px; }
		.logo.white .slogan { width: 100px; text-align: left; }

		/* logo footer */
		.logo.footer img { padding: 0; float: right; margin-left: 50%; }
		.logo.footer .slogan { width: 100px; margin-top: 13px; text-align: left; float: right; }
	}