/* ------------------------------------------------------
	Family Guy
	
	Last updated: 2014.01.27
-------------------------------------------------------*/

@import url("reset.css");



/* --- Header
-------------------------------------------------------*/

header {
	box-sizing: border-box;
	position: relative;
	height: 64px;
	background: url(../img/fg_support_bannerBG.png);
	background-size: 512px 64px;
}
	
	/* --- | Edges | --- */
	
	.header-left,
	.header-right {
		position: absolute;
		width: 64px;
		height: 64px;
	}
		
		.header-left {
			background: url(../img/fg_support_banner_cap_left.png) no-repeat;
			background-size: 64px 64px;
		}
		
		.header-right {
			right: 0;
			background: url(../img/fg_support_banner_cap_right.png) no-repeat;
			background-size: 64px 64px;
		}
	
	/* --- | Logo | --- */
		
	header #logo {
		position: absolute;
		left: 23px;
		top: 3px;
	}
		
		header #logo img {
			width: 84px;
			height: 56px;
		}
	
	header h1 {
		font-size: 24px;
		line-height: 45px;
		text-align: center;
		text-transform: uppercase;
		color: #ffd006;
		
		text-shadow:
			0 2px 0 #973f04,
			0 -2px 0 #973f04,
			-2px -2px 0 #973f04,  
			-2px 2px 0 #973f04,
			2px -2px 0 #973f04,
			2px 2px 0 #973f04;
	}
		
		header h1 .icon {
			position: relative;
			top: 11px;
			display: inline-block;
			width: 45px;
			height: 45px;
			margin-right: 10px;
			background-repeat: no-repeat;
			background-size: 45px 45px;
		}
		
		/* --- | Sections | --- */
				
		header h1.how-to-play .icon { background-image: url(../img/fg_support_titleIcon_howToPlay.png); }
		header h1.billing .icon { background-image: url(../img/fg_support_titleIcon_billingInfo.png); }
		header h1.help .icon { background-image: url(../img/fg_support_titleIcon_getHelp.png); }
		header h1.accounts .icon { background-image: url(../img/fg_support_titleIcon_accounts.png); }


/* --- Content
-------------------------------------------------------*/

.content {
	margin: 0 30px;
	padding-bottom: 30px;
}
	
	/* --- | Questions | --- */
	
	.content dl {}
		
		.content dl dt {
			font-size: 18px;
			font-weight: bold;
			padding: 9px 0;
			background: url(../img/fg_support_buttonCollapsed.png) no-repeat right center;
			background-size: 30px 30px;
			border-bottom: 1px solid #909295;
		}
			
			.content dl dt.show {
				background: url(../img/fg_support_buttonExpanded.png) no-repeat right center;
				background-size: 30px 30px;
				border-bottom: 0;
			}
			
			.content dl dt a {
				display: block;
			}
		
		.content dl dd {
			display: none;
			padding-bottom: 9px;
			border-bottom: 1px solid #909295;
		}
	
	/* --- | Form | --- */
	
	.content form {
		padding-top: 7px;
	}
		
		.content form h2 {
			font-size: 18px;
			font-weight: bold;
			color: #14588c;
		}
		
		.content .input-container {
			margin: 0 15px;
		}
		
			.content form textarea {
				color: #666;
				box-sizing: border-box;
				width: 100%;
				margin: 5px 0 10px;
				background: #fffcdf;
				border: 2px solid #a8a8a8;
				border-radius: 5px;
			}
		
			input[type="submit"].btn-submit {
				float: right;
				padding: 0;
				box-sizing: border-box;
				box-shadow:inset 0px 1px 0px 0px #bbdaf7;
				background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1d7ea8), color-stop(1, #1d7ea8) );
				background:-moz-linear-gradient( center top, #1d7ea8 5%, #1d7ea8 100% );
				background-color:#1d7ea8;
				border-radius: 5px;
				border:2px solid #10334d;
				display:inline-block;
				color:#aad9e8;
				font-size:20px;
				font-weight:bold;
				height:40px;
				line-height:40px;
				width:100px;
				text-align:center;
				text-shadow:0px 2px 0px #2a6993;
				text-transform: uppercase;
			}