/* ================================================================================================= */

/* Reset */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0b1 | 201101 
   NOTE: WORK IN PROGRESS
   USE WITH CAUTION AND TEST WITH ABANDON */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}


/* ================================================================================================= */


body      { font-size: 9pt; color: #333333; font-family: Verdana; text-decoration: none }
body a:link { font-size: 9pt; color: #999999; font-family: Verdana }
body a:visited     { font-size: 9pt; color: #999999; font-family: Verdana}
body a:hover     { font-size: 9pt; color: #cc0000; font-family: Verdana }



ul {
 margin-left: 10px;
 padding: 5px;
 margin-top: 5px;
 list-style-image:url(http://www.londondirectory.co.uk/graphics/square.gif); 
 list-style-type: circle
   }



.tp
	{
    margin-top: 0;
    margin-bottom: 20px;
    margin-left: 0px;
    margin-right: 0px;
    background-color: #ffffff;
    border-style:solid;
    border-width:1px;
    border-color:#cc0000;
    color:#333333;
    padding:10px;
    width:150px;
	}


.feat	{
    background-color: #ffffff;
    border-style:solid;
    border-width:1px;
    border-color:#eeeeee;
    color:#333333;
    padding:10px;
    margin-top: 8pt;
    margin-bottom: 8pt;
	}


.textListing	{
    background-color: #ffffff;
    border-style:solid;
    border-width:1px;
    border-color:#eeeeee;
    color:#333333;
    padding:10px;
    margin-top: 8pt;
    margin-bottom: 8pt;
	}

.mp	{
    background-color: #ffffff;
    border-style:solid;
    border-width:1px;
    border-color:#eeeeee;
    color:#333333;
    padding:10px;
    margin-top: 8pt;
    margin-bottom: 8pt;
	}





h1{
    letter-spacing:-1px;
    color:#222;
    line-height:35px;
    margin:0 0 0px 0;
    font:normal 200% "arial black",arial,helvetica,sans-serif;
}

h2		{ font-family: Verdana, sans-serif; color: #333333; font-size: 10pt; ; margin-bottom: 0}

h3{
    letter-spacing:-1px;
    color:#666;
    line-height:35px;
    margin:0 0 10px 0;
    font:normal 180% "arial black",arial,helvetica,sans-serif;
}

p		{  margin-bottom: 0; margin-top: 0}

.smalllightgrey      { font-size: 10px; color: #666666; font-family: Verdana; text-decoration: none }
.smalllightgrey a:link { font-size: 10px; color: #666666; font-family: Verdana; text-decoration: none }
.smalllightgrey a:visited     { font-size: 10px; color: #666666; font-family: Verdana; text-decoration: none}
.smalllightgrey a:hover     { font-size: 10px; color: #666666; font-family: Verdana; text-decoration: none }


	body {
		margin:10px 10px 0px 10px;
		padding:0px;
		}
	
	#leftcontent {
		position: absolute;
		left:0px;
		top:200px;
		width:120px;
		background:#fff;
		border:0px solid #fff;
		}

	#centercontent {
		background:#fff;
   		margin-left: 1px;
   		margin-right:330px;
		border:0px solid #fff;



		voice-family: "\"}\"";
		voice-family: inherit;
   		margin-left: 1px;
   		margin-right:330px;



		padding-bottom: 200px;


		}
	html>body #centercontent {
   		margin-left: 1px;
   		margin-right:330px;
		}

	#rightcontent {
		position: absolute;
		top:130px;
		right:163px;
		width:160px;
		background:#fff;
		border:0px solid #fff;
		}




	
	#header {
		background:#fff;
		border-top:0px solid #fff;
		border-right:0px solid #fff;
		border-left:0px solid #fff;
		voice-family: "\"}\"";
		voice-family: inherit;
		}

	#breadcrumb {

		padding:5px;

		}

	#skyscraper {
		position: absolute;
		right:0px;
		top:160px;
		width:160px;
		background:#fff;
		border:0px solid #fff;
		}

	html>body #banner {
		height:39px;
		}
		

		

		
	#header h1 {
		font-size:14px;
		padding:10px 10px 0px 10px;
		margin:0px;
		}
	
	#rightcontent p {
		font-size:10px
		}





/* ================================================================================================= */
// Grid

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }

/*  GRID OF THREE  */
.span_3_of_3 {
	width: 100%;
}
.span_2_of_3 {
	width: 66.1%;
}
.span_1_of_3 {
	width: 32.2%;
}

/*  GRID OF FOUR  */
.span_4_of_4 {
	width: 100%;
}
.span_3_of_4 {
	width: 74.6%;
}
.span_2_of_4 {
	width: 49.2%;
}
.span_1_of_4 {
	width: 23.8%;
}

/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}



/* ================================================================================================= */




/*  GO FULL WIDTH AT LESS THAN 768 PIXELS FOR PHONES AND TABLETS */

@media only screen and (max-width: 768px) {
	.span_4_of_4 {
		width: 100%; 
	}
	.span_3_of_4 {
		width: 100%; 
	}
	.span_2_of_4 {
		width: 100%; 
	}
	.span_1_of_4 {
		width: 100%; 
	}
}

