/* CSS Document */
#content{
border-right-color:#ffcc00;}
/***********************************************/
.room_details{
margin: 0px 0px 0px 20px; /*removes indent IE and Opera*/ padding: 0px; /*removes indent Mozilla and NN7*/
list-style-type: none; /*turns off display of bullet*/
font-size: 12px;}
#doubleBedroom{margin:10px 0px 0px 0px;}
#singleBedroom{margin:60px 0px 0px 0px;}
#livingRoom{margin:65px 0px 0px 0px;}
#kitchen{margin:25px 0px 0px 0px;}
#bathroom{margin:30px 0px 0px 0px;}
#etc{margin:40px 0px 0px 0px;}
/***********************************************/
.room_intro{
width:100%;
position:relative;
margin-top: 10px;
background:#F9F7F2;}
.room_intro:after{content:"."; clear:both; display:block; height:0; visibility:hidden;}
.roomTextL{
	width:40%;
	height:auto;
	position:absolute;
	top:30px;
	left:50px;
	background:#F9F7F2;}
.roomTextR{
	width:40%;
	height:auto;
	position:absolute;
	top:30px;
	right:50px;
	background:#F9F7F2;}
.left{
float:left;
margin: auto 10px;}
.right{
float:right;
margin: auto 10px;}
#mainBedroomPic, #backBedroomPic, #livingRoomPic, #kitchenPic, #bathroomPic {
border:1px solid #665531;}
/* how can these images/anchors be implemented from css only???
#mainBedroomPic{
background-image:url("Exported_Images/flatInteriors/mainBedroom200.jpg");
width: 200px; 
height: 180px;
float:right; }
#mainBedroomPic{
position:relative;
background: url("Exported_Images/flatInteriors/backBedroom200.jpg") no-repeat;
height: 179px; width: 200px;}
#livingRoomPic{
position:relative;
background: url("Exported_Images/flatInteriors/livingRoom200.jpg") no-repeat;
height: 181px; width: 200px;}
#kitchenPic{
position:relative;
background: url("Exported_Images/flatInteriors/kitchen200.jpg") no-repeat;
height: 150px; width: 200px;}
#bathroomPic{
position:relative;
background: url("Exported_Images/flatInteriors/bathroom200.jpg") no-repeat;
height: 238px; width: 200px;}
*/