/*----------------------------------------------------------------------------------*/
/* Reference Content Page Classes							                        */
/*----------------------------------------------------------------------------------*/
.wrapper .left .content .page .topiclist, .wrapper .left .content .page .referencelist
{
	width: 100%;
	float: left;
	margin: 30px 0px 30px 0px;
	padding: 0px 0px 0px 0px;
}



.wrapper .left .content .page .topiclist h1, .wrapper .left .content .page .referencelist h1
{
	width: 100%;
	float: left;
	margin: 20px 0px 0px 0px;
	padding: 5px 10px 5px 10px;
	font-size: 22px;
	color: #000000;
	font-weight: 500;
	background-color: #ffffff;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	border-bottom: 1px solid #cccccc;
}


.wrapper .left .content .page .topiclist nav, .wrapper .left .content .page .referencelist nav
{
	width: 100%;
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

.wrapper .left .content .page .topiclist nav .row, .wrapper .left .content .page .referencelist nav .row
{
	width: 100%;
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	background-color: #ffffff;
}

.wrapper .left .content .page .topiclist nav .row a, .wrapper .left .content .page .referencelist nav .row a
{
	width: 100%;
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;	
}

.wrapper .left .content .page .topiclist nav .row a h1, .wrapper .left .content .page .referencelist nav .row a h1
{
	width: 100%;
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 5px 10px 5px 10px;
	font-size: 22px;
	color: #000000;
	font-weight: 500;
	border-bottom: 1px solid #cccccc;
}



/*----------------------------------------------------------------------------------*/
/* Reference Display Classes									                        */
/*----------------------------------------------------------------------------------*/
.wrapper .left .content .reference
{
	width: calc(100% - 20px);
	float: left;	
	margin: 20px 10px 30px 10px;
	padding: 0px 0px 10px 0px;	
}


.wrapper .left .content .reference .top
{
	width: 100%;
	float: left;
	border-bottom: 5px solid #cccccc;
}

.wrapper .left .content .reference .top h1
{
	width: calc(100% - 10px);
	float: left;
	margin: 10px 0px 10px 0px;
	padding: 0px 0px 0px 5px;
	font-size: 22px;
	color: #000000;
	font-weight: 500;
	border-left: 5px solid #000000;
}


.wrapper .left .content .reference .top p
{
	width: 100%;
	float: left;
	font-size: 18px;
	font-weight: 500;
	color: #5a5d60;
}






/*----------------------------------------------------------------------------------*/
/* Split Layout Breakpoints For Large Screens										*/
/* 48em = 768px, 62em = 992px                                                       */
/* Breaking mobile after common vertical tablets ~62em                              */
/*----------------------------------------------------------------------------------*/

@media (min-width: 62em) 
{

	.wrapper .left .content .page .topiclist h1
	{		
		font-size: 28px;		
	}	
	
	.wrapper .left .content .page .referencelist h1
	{		
		font-size: 28px;		
	}	
	
	.wrapper .left .content .reference .top h1
	{		
		font-size: 38px;		
	}
	
	.wrapper .left .content .reference .top p
	{		
		font-size: 22px;		
	}
}