/*	villacalpe-screen.css	Style sheet for Web pages
	Begun 11/08/10
*/

*	{
	margin:		0;
	padding:	0;
}

body	{
	font-family:	'Trebuchet MS', Helvetica, sans-serif;
	font-size:		0.8em
}

.central	{
	text-align:	center
}

.closed	{
	line-height:	125%
}

.column	{
	float:		left;
	margin:		0 20px 0 0
}

.inset	{
	float:	left
}

.new-row	{
	clear:	both
}

.open	{
	line-height:	150%
}

.outset	{
	float:	right
}

/*	divisions	*/

div.boxout	{
	padding:	2px 0 2px 4px;
	border:		1px solid
}

div.boxout1	{
	margin:		12px 0 47px 585px;
	padding:	4px
}

.boxout1 p	{
	padding-bottom:	4px
}

div#boxout2	{
	margin:		8px 0 0 460px
}

div#expo	{
	padding:	0 15px
}

div#expo-lead	{
	width:	440px;
	margin:	8px 20px 8px 0
}

#expo-lead ol	{
	margin-left:	20px
}

div.expo-main	{
	width:			565px;
	padding-bottom:	5px
}

.expo-main h3	{
	margin-top:	8px
}

.expo-main p	{
	margin-bottom:	8px;
	text-align:		justify
}

div#info1	{
	width:	565px;
}

div#info1 h1	{
	padding-bottom:	5px
}

div.info	{
	padding:	5px 15px
}

div#expo-supp	{
	margin:		8px 0 0 460px
}

div#invite	{
	padding-left:	5px
}

div#lead-on	{
	margin-top:	172px
}

div#main	{
	width:			960px;
	margin:			0 auto;
	border-top:		1px solid;
	border-right:	2px solid;
	border-bottom:	2px solid;
	border-left:	2px solid
}

div#nav-holder	{
	margin:	8px 0 0 585px
}

/*	images	*/

img	{
	border:	0
}

img.icon	{
	float:			left;
	margin-right:	2px
}

img#icon-2	{
	padding-top:	8px
}

img.lead-in	{
	float:		left;
	margin:		4px 10px 0 0;
	padding:	1px;
	border:		1px solid #cf2200
}

img#phone	{
	padding-bottom:	16px
}

img.pic	{
	margin:	0 8px 8px 0;
	border:	1px solid
}

/*	tooltips	*/

.tooltip {
	display:	none;
	height:		70px;
	width:		160px;
	background:	transparent url( media/white.png );
	padding:	20px;
	color:		#cf2200;	
}

/*	elements	*/

a:link, a:visited	{
	text-decoration:	none
}

a:hover	{
	text-decoration:	underline
}

div.menu a:hover	{
	text-decoration:	none
}

dd, dt	{
	font-size:	110%
}

dd	{
	text-indent:	8px;
	padding-bottom:	4px
}

dd.final	{
	padding-bottom:	0
}

dt	{
	font-weight:	bold
}

h1	{
	font-size:	100%
}

h2	{
	font-size:		200%;
	margin-bottom:	16px
}

h2.empathic	{
	font-size:		350%
}

h2#opener	{
	margin:	5px 0 5px 15px
}

h3	{
	font-size:	120%
}

h3.groupie	{
	margin-top:	8px
}

hr	{
	height:	1px
}

p.button	{
	margin:	4px 0
}

p.exec	{
	margin:	16px 0
}

p.sub	{
	padding:	16px 0;
	font-size:	90%
}

ul.basic	{
	padding-left:	16px;
	margin-bottom:	8px
}

ul#main-navigation	{
	width:		360px;
	height:		225px;
	position:	relative;
	list-style:	none;
	background:	url( media/circle.gif ) no-repeat
}

#main-navigation li	{
	display:	block;
	width:		75px;
	height:		75px;
	position:	absolute
}

#main-navigation li#home	{
	left:		141px;
	top:		-15px;
	background:	url( media/home-page.gif ) no-repeat center center
}

#main-navigation li#house	{
	left:		38px;
	top:		35px;
	background:	url( media/house.jpg ) no-repeat center center
}

#main-navigation li#inside	{
	left:		242px;
	top:		35px;
	background:	url( media/interior.jpg ) no-repeat center center
}

#main-navigation li#outside	{
	left:		38px;
	top:		108px;
	background:	url( media/pool-garden.jpg ) no-repeat center center
}

#main-navigation li#setting	{
	left:		242px;
	top:		108px;
	background:	url( media/calpe-empedrola.jpg ) no-repeat center center
}

#main-navigation li#contact	{
	left:		140px;
	top:		165px;
	background:	url( media/contact_form.png ) no-repeat center center
}

#main-navigation li a span.outer	{
	display:	none
}

#main-navigation li span#here, #main-navigation li a	{
	display:			block;
	width:				75px;
	height:				75px;
	text-align:			center;
	text-decoration:	none
}

#main-navigation li span#here	{
	background:	url( media/cborder-here.gif ) no-repeat
}

#main-navigation li a:hover	{
	background:	url( media/cborder.gif ) no-repeat
}

#main-navigation li a:hover span.outer	{
	width:			100px;
	height:			100px;
	font-weight:	bold;
	display:		block;
	position:		absolute
}

ul#main-navigation li a:hover span.inner	{
	font-weight:	normal
}

#main-navigation li#home a:hover span.outer	{
	left:	-13px;
	top:	91px
}

#main-navigation li#house a:hover span.outer	{
	left:	90px;
	top:	41px
}

#main-navigation li#inside a:hover span.outer	{
	left:	-114px;
	top:	41px
}

#main-navigation li#outside a:hover span.outer	{
	left:	90px;
	top:	-35px
}

#main-navigation li#setting a:hover span.outer	{
	left:	-114px;
	top:	-45px
}

#main-navigation li#contact a:hover span.outer	{
	left:	-13px;
	top:	-89px
}

ul#nav-pics	{
	list-style:		none
}

#nav-pics li	{
	display:	inline
}

#nav-pics li img	{
	margin:		0 0 10px 10px
}

/*	colours	*/

a:link	{
	background-color:	inherit;
	color:				blue
}

a:visited	{
	background-color:	inherit;
	color:				navy
}

a:hover	{
	background-color:	inherit;
	color:				blue
}

a:active	{
	background-color:	inherit;
	color:				#f90	/* an ornage */
}

body	{
	background:	url( media/whitspek.gif );
	color:		#333	/* a grey */
}

div.boxout	{
	background-color:	#ffecef; /* a light pink version of main background */
	border-color:		#cf2200	/* a red, from garden flower */
}

div#expo-lead, div#expo-supp	{
	background-color:	#efefef
}

div#main	{
	background:		white url( media/villa-gradient1.gif ) repeat-x;
	border-color:	#9e9d5c	/* a green, from sitting room wall */
}

h1, h2, h3	{
	background-color:	transparent;
	color:				#666
}

h3.lister, p.formal, p.sub, span.pointing	{
	background-color:	inherit;
	color:				#cf2200
}

hr	{
	background-color:	#9e9d5c;
	color:				#9e9d5c
}

img	{
	border-color:	#9e9d5c
}

ul#main-navigation li a:hover span.outer	{
	background-color:	inherit;
	color:				#cf2200
}

ul#main-navigation li a:hover span.inner	{
	background-color:	inherit;
	color:				#333
}

/*	EOF	*/