
/* STRUCTURE */

.pageWrap {
	padding: 5px;
	max-width: 940px;
	width:100%;
	margin: 20px auto;
    text-align: center;
    box-sizing: border-box;
}

.bg-style {
     background-color: #dedede;
     float: right;
     border: none;
     width: 100%;
     height: 100%;
     padding: 15px 0 10px 0;"
     text-align: center;
     overflow: auto;
}

.btn-space { 
     padding: 2px 0 2px 0;
}

img {
     margin: 0px;
}


.subheads {
     padding: 0px;
     margin: 0px;
     font-weight: bold;
     font-size: 18px;
     line-height: 22px;
     font-family: "PNC Brand Bold", Arial, sans-serif;
     color: #484848;
}

.descriptions {
     padding: 4px;
     margin: 0px;
     font-size: 14px;
     line-height: 16px;
}

}
.topTitle {
	height: 100px;
	padding: 0 15px;
}

.titleStyle {
     font-size: 24px;
     color: #F58025;
     padding: 0 0 15px 0;
     margin: 0;
     font-family: "PNC Brand Bold", Arial, sans-serif;
}

.subtitle {
	margin:0;
    font-size:18px;
    }

.pageWrap [class*='column'] {
	float: left;
	padding: 5px 15px;
    box-sizing:border-box;
}

.column-1 {
    width:100%;
}

.column-2 {
    width:50%;
}

.column-3 {
    width:33%;
}

.pageWrap .btn-gray a {
	margin-right:0;
}

.pageWrap [class*='column'] p {
	color: #636363;
    font-size: 14px;
    line-height: 20px;
}


/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 940px or less */
@media screen and (max-width: 940px) {
	
	.pageWrap {
		width: 90%;
	}
	.content {
		width: 37%;
		padding: 1% 4%;
	}
	.middle {
		width: 37%;
		padding: 1% 4%;
		margin: 0px 0px 5px 5px;
		float: right;
	}
	
	.sidebar {
		clear: both;
		padding: 1% 4%;
		width: auto;
		float: none;
	}

	.topTitle, footer {
		padding: 1% 4%;
	}
}

/* for 700px or less */
@media screen and (max-width: 600px) {

	.content {
		width: auto;
		float: none;
	}
	
	.middle {
		width: auto;
		float: none;
		margin-left: 0px;
	}
	
	.sidebar {
		width: auto;
		float: none;
	}

}

/* for 480px or less */
@media screen and (max-width: 480px) {

.content {
		width: auto;
		float: none;
	}
	
	.middle {
		width: auto;
		float: none;
		margin-left: 0px;
	}
	
	.sidebar {
		width: auto;
		float: none;
	}
	.column-1, .column-2, .column-3 {
		width:100%;
		float:none;
	}

}

.topTitle, .content, .middle, .sidebar {
	margin-bottom: 5px;
}
