/* CSS Document */

html{
height:100%;
margin:0;
padding:0px;
background-image: url("/rac_bgperimeter.gif");
background-repeat: repeat;
}

body {
 
	
height:100%;
z-index:0;
margin:0;
padding:0px;

background-repeat: no-repeat;
background-position: 50% 100%;


}



#perimeter {
z-index:10;

position:relative;
margin-left: auto ;
margin-right: auto ;
margin-top: auto ;
margin-bottom: auto ;
overflow:hidden;
width:100%;
height:100%;
max-width:1200px;


background-position: center;
background-repeat:no-repeat;
}

#name {
display:inline-block;
margin-top: 5px;
margin-right: 5px;
float:right;
min-width:460px;
}


#namecontent{
	/*position:relative;
	z-index:100;*/
	
}



#name h1 {
	color:#FFFFFF;
	font-size: 40px;
	outline: 0;
	font-family: arial black, arial, helvetica; 
	font-weight: 900;
	letter-spacing:-1px; padding: -4 4 -4;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0px;
	margin-left: 0;
	}
#name #namecontent {
}
#name #namecontent .nametitle {
	outline: 0;
	font-family: arial black, arial, helvetica; 
	font-weight: 900;
	letter-spacing:-1px; padding: -4 4 -4;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0px;
}
#name #namecontent .nametitle.first {
	margin-top: 0;
}
#name #namecontent .nametitle a {
	text-decoration: none; outline: 0;
	color:#FFFFFF; padding: -4 4 -4;
}
#name #namecontent .nametitle a:hover {
	color: #000000;} 
	
	#name #namecontent .thumb.first {
	margin-top: 0;
}
#name #namecontent .thumb a {
	text-decoration: none; outline: 0;
	
}
#name #namecontent .thumb a:hover {
	} 



#info {
overflow:hidden;


margin-left:auto;
margin-right:auto;

}

#content{
	position:relative;
	z-index:0;
	
}



	#street_box {
	 border-style: dashed;
	border-width: 1px; 
	border-color: #666666;
	float: left;
	width: 230px;
	
	
	max-height: 565px;
	padding: 5px;
	margin-left: 10px;
	margin-top: 15px;
	z-index:0;
	background-color:rgba(255,255,255,0.7);
	background-repeat: repeat;
	overflow-x:hidden; /* scroll horizontal */

overflow-y:scroll; /* hidden or scroll*/
	
}


#street_box h2 {
	font-size: 38px;
	outline: 0;
	font-family: arial black, arial, helvetica; 
	font-weight: 900;
	letter-spacing:-4px; padding: -4 4 -4;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;}

#street_box h1 {
	font-size: 13px;
	outline: 0;
	font-weight: bold;
	font-family: Arial, sans-serif;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
}

#street_box p {
	font-size: 11px;
	color:#666666;
	font-family: Arial, sans-serif;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
}

#street_box #contenti{
}

#street_box #contenti .title {
}
#street_box #contenti .title.first {
	margin-top: 0;
}
#street_box #contenti .title a {
	text-decoration: none; outline: 0;
	color: #000000; padding: -4 4 -4;
}
#street_box #contenti .title a:hover {
	color: #666666;} 

#street_box #contenti img.thumb {
		border: 1px solid #CCCCCC;
		padding: 1px;
		margin-bottom: 0px;
	}
	

-------------------------
	
	#street_head {
	 
	float: left;
	width: 190px;
	
	padding: 5px;
	
	margin-bottom: 5px;
	background-image: url(http://www.rafcanedo.info/urfront_newboxbackground.png);
	background-repeat: repeat;
	
}


#street_head h2 {
	font-size: 38px;
	outline: 0;
	font-family: arial black, arial, helvetica; 
	font-weight: 900;
	letter-spacing:-4px; padding: -4 4 -4;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;}

----------

#street {
	 
	 border-style:dashed;
	border-width:1px;
	border-color: #666666;
	
	display: inline;
	float: left;
	width: 190px;
	
	padding: 5px;
	margin-left: 10px;
	margin-top: 15px;
	background-image: url(http://www.rafcanedo.info/urfront_newboxbackground.png);
	background-repeat: repeat;
	
}


#street h3 {
	font-size: 13px;
	outline: 0;
	font-weight: bold;
	font-family: Arial, sans-serif;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	}
	
#street #content .title {
}
#street #content .title.first {
	margin-top: 0;
}
#street #content .title a {
	text-decoration: none; outline: 0;
	color: #000000; padding: -4 4 -4;
}
#street #content .title a:hover {
	color: #666666;} 

#street #content img.thumb {
		border: 1px solid #CCCCCC;
		padding: 1px;
		margin-bottom: 0px;
	}
	
	#mapcontent{
	/*position:relative;
	z-index:100;*/
	border-style:dashed;
	border-width:1px;
	border-color: #666666;
	padding: 4px;
	display: inline;
	float: left;
	width: 900px;
	height:500px;
	padding: 5px;
	margin-left: 15px;
	
	margin-top: 15px;
	
	
	background-image: url(http://www.rafcanedo.info/urfront_newboxbackground.png);
	background-repeat: repeat;
	overflow:scroll;  /* cater to the older browsers */
z-index: 50;
overflow: -moz-scrollbars-horizontal; /* for FF */

overflow-y:scroll; /* scroll horizontal */

overflow-x:scroll; /* Hide vertical*/
}

#map_box {

	padding-bottom: 50px;
	 width: 900px;

 border-style: dashed;
	border-width: 1px; 
	border-color: #cccccc;
	display: inline;
	float: left;
	padding: 5px;
	margin-left: 15px;
	margin-top: 15px;
	
}
#london {
position: absolute; top:0;
vertical-align: 0;
z-index:0;
	float: left;
	width: 970px;
	height: 700px;
}

#belgrave {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#buxton {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#cityroad {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#commercial {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#guilford {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#hackney {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#jamaica {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#kennington {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#kent {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#kings {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#moorgate {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#oxford {
position: absolute; top:0;
vertical-align: 0;
z-index:51;
	float: left;
	width: 970px;
	height: 700px;
}

#piccadily {
position: absolute; top:0;
vertical-align: 0;
z-index:51;
	float: left;
	width: 970px;
	height: 700px;
}

#queen {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#smithfield {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#southwark {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#thames {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#union {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#victoria {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#wandsworth {
position: absolute; top:0;
vertical-align: 0;
z-index:0;
	float: left;
	width: 970px;
	height: 700px;
}

#waterloo {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}

#whitewall {
position: absolute; top:0;
vertical-align: 0;
z-index:50;
	float: left;
	width: 970px;
	height: 700px;
}




#scrollhide{
position:absolute;
margin-left: auto ;
  margin-right: auto ;
  width: 100%;
	height: 183px;
	margin-left: 0px;
	margin-top: 00px;
	margin-right: 0;
	margin-bottom: 64px;
	overflow:hidden;  /* cater to the older browsers */
z-index: 100;

overflow-x:hidden; /* scroll horizontal */

overflow-y:hidden; /* Hide vertical*/
}

#subbox {
 position:absolute;
   bottom:0;
  left:0;
	margin-left: auto ;
  margin-right: auto ;
	width: 100%;
	height: 220px;
	margin-left: 0px;
	margin-top: 00px;
	margin-right: 0;
	margin-bottom: 64px;
	overflow:scroll;  /* cater to the older browsers */
z-index: 50;
overflow: -moz-scrollbars-horizontal; /* for FF */

overflow-x:scroll; /* scroll horizontal */

overflow-y:hidden; /* Hide vertical*/
}


#boxcontent{
	/*position:relative;
	z-index:100;*/
	
	background-color:rgba(0,0,0,0.7);
	padding: 4px;
	display: inline-block;
	float: left;
	width: 4500px;
	height: 320px;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	outline: 0;
}
#boxcontent h4 {
	color:#FFFFFF;
	font-size: 14px;
	outline: 0;
	font-family: arial, helvetica; 
	font-weight: 500;
	letter-spacing:-1px; padding: -4 4 -4;
	margin-top: 10px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;}

#boxcontent h2 {
border:none;
	font-size: 16px;
	color:#FFFFFF;
	outline: 0;
	font-family: arial, helvetica; 
	font-weight: 900;
	letter-spacing:-1px; padding: -4 4 -4;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: -10px;
	margin-left: 0;
	}



#boxcontent p {
	font-size: 11px;
	color:#CC0000;
	font-family: Arial, sans-serif;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
}

#boxcontent #newcontent {
}
#boxcontent #newcontent .prev {
}
#boxcontent #newcontent .prev.first {
	margin-top: 0;
}
#boxcontent #newcontent .prev a {
	text-decoration: none; outline: 0; border:none;
	color: #FFFFFF;
}
#boxcontent #newcontent .prev a:hover { border:none;
	color: #666666;}
	
	
	#boxcontent #newcontent .subtitle {
}
#boxcontent #newcontent .subtitle.first {
	margin-top: 0;
}
#boxcontent #newcontent .subtitle a { border:none;
	text-decoration: none; outline: 0;
	font-color: #FFFFFF;
}
#boxcontent #newcontent .subtitle a:hover {
	color: #666666; outline: 0;}


#projectprev{

display: inline;
	outline: 0;
	float: left;
	width: 220px;
	height: 292px;
	padding: 5px;
	margin-top: 0px;
	margin-right: 5px;
	margin-bottom: 0;
	margin-left: 0px;	
}

#menu {z-index: 100;
overflow:hidden;
display:inline-block;
position:absolute;
   bottom:0;

margin-bottom:20px;
    display:block;
   

float:left;
height: 44px;	/* 97 - 33 */
list-style: none;

margin-top:auto;

margin-right:auto;
width:1440px;
background-color:rgba(0,0,0,0.7);
}

#nav {z-index: 100;
	
	margin:auto;
	
	list-style: none;
	padding-left: 50px;
	
	
}
#nav li {
	float: left;
	height: 50px;
	text-indent: 0px;
	margin-top: 0px;
	padding-right: 40px;
	overflow: hidden;

}
#nav li a {
	display: block;
	height: 30px;

	
}




#nav #h_projects {   }
#nav #h_cv {  }
#nav #h_bio { }
#nav #h_contact { }





#nav #h_projects a {
	
	font-size: 30px; letter-spacing:-2px; padding: -4 4 -4; outline: 0;
font-family: arial black, arial, helvetica; font-weight: 800; color: #FFFFFF; text-decoration: none;
}
#nav #h_cv a {
	font-size: 30px; letter-spacing:-2px; padding: -4 4 -4; outline: 0;
font-family:  arial black, arial, helvetica; font-weight: 800; color: #FFFFFF; text-decoration: none;
}
#nav #h_bio a {
	font-size: 30px; letter-spacing:-2px; padding: -4 4 -4; outline: 0;
font-family: arial black, arial, helvetica; font-weight: 800; color: #FFFFFF; text-decoration: none;
}
#nav #h_contact a {
	font-size: 30px; letter-spacing:-2px; padding: -4 4 -4; outline: 0;
font-family:  arial black, arial, helvetica; font-weight: 800; color: #FFFFFF; text-decoration: none;
}


#nav #h_projects a:hover {color: #CC3333;} 
#nav #h_cv a:hover {color: #CC3333;}
#nav #h_bio a:hover{color: #CC3333;}
#nav #h_contact a:hover{color: #CC3333;}

#footer {
overflow:hidden;
display:inline-block;
width:100%;
height: 50px;
}


 
.hidden { display: none; }
.unhidden { display: inline; }