/**
 * @filename	global-credentials-front.css
 * @purpose		To provide styles for the credentials pages on PSBA (Login/Register/Forgotten Password/Reset Password/Activation Code)
 * @project     PlayStation Brand Ambassador
 * @author      Will Roberts
 * @copyright   2017 PixelBeard.co
 * @contact		helloworld@pixelbeard.co
 *
 * @PlayStation Blue				- #003791 - Pantone 287C
 * @PlayStation Secondary Blue		- #0078c8 - Pantone 285C
 * @PlayStation Silver				- #84888b - Pantone 877C
 * @PlayStation Cool Grey Light		- #B1B3B3 - Pantone Cool Gray 5C
 * @PlayStation Cool Grey Dark		- #63666A - Pantone Cool Gray 10C
 * @PlayStation Black				- #222223 - Pantone Black
 */

/** PlayStation Font Faces **/
@font-face { font-family: SST; src: url('../psba-fonts/SST-Roman.ttf'); }
@font-face { font-family: SSTBold; src: url('../psba-fonts/SST-Bold.ttf'); }
@font-face { font-family: SSTHeavy; src: url('../psba-fonts/SST-Heavy.ttf'); }
@font-face { font-family: SSTLight; src: url('../psba-fonts/SST-Light.ttf'); }

.alert {
	position: fixed;
	right: 0;
	top: 20px;
	width: 370px;
	height: 70px;
	padding: 8px;
	background-color: #030b16;
	box-shadow: -2px 1px 7px 0 rgba(0, 0, 0, 0.22);
	border: solid 1px #3c3c3c;
	z-index: 999;
}
.alert .icon {
	width: 50px;
	height: 50px;
	float: left;
	background-color: #3c3c3c;
	margin-right: 20px;
}
.alert span {
	font-size: 11px;
	color: white;
	letter-spacing: 2.6px;
	display: block;
	line-height: 12px;
	margin-top: 8px;
	font-family: SSTBold;
}
.alert .alert-small-text {
	color: white;
	font-family: SST;
	display: block;
}
.alert .error {
	color: #ff001f;
	font-size: 22px;
	font-family: SSTHeavy;
	text-align: center;
	height: 50px;
	line-height: 50px;
}
.alert .success {
	color: #0078c8;
	font-size: 22px;
	font-family: SSTHeavy;
	text-align: center;
	height: 50px;
	line-height: 50px;
}
.alert .default {
	color: white;
	font-size: 22px;
	font-family: SSTHeavy;
	text-align: center;
	height: 50px;
	line-height: 50px;
}
.alert {
	right: -370px;
	opacity: 0;
}
.alert-active {
	right: 0px;
	opacity: 1;
}
.alert-animation {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;
}