/* ----------------------------------------------------------------------
Style Sheet for Bem-me-quer Personal Wellness

author: Inayaili de Leon
email: hello@yaili.com
website: http://yaili.com/
------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------
CONTENTS:
=Resets & General
=Main Blocks
=Header
=Nav
=SubNav
=Content
=Type
=Forms
=Tables
=Footer
------------------------------------------------------------------------*/
/* =Resets & General -----------------------------------------------------
------------------------------------------------------------------------*/
body { background:#fff url(../images/css/bkg.gif) repeat-x left top; margin:0; padding:0; font:13px "lucida grande", "lucida sans unicode", helvetica, arial, sans-serif; color:#9d3d7c; text-align:center; }
h1, h2, h3, h4, h5, h6, p, ul, li, div, form, input, label { margin:0; padding:0; }
ul { list-style:none; }
.clear { clear:both; height:0; }
a img { border:none; }
a { color:#9d3d7c; }

/* =Main Blocks ----------------------------------------------------------
------------------------------------------------------------------------*/
#page-wrapper { width:860px; margin:auto; text-align:left; }
#header { height:169px; background:url(../images/css/header_bkg.jpg) no-repeat 50% top; position:relative; margin-bottom:20px; }

.images { float:left; width:320px; margin-right:20px; }
	#sobre .images { width:355px; margin-bottom:10px; }

.subNav { float:left; width:150px; margin-right:20px; }

#texts { width:490px; margin-right:20px; float:left; }
	#home #texts { width:320px; }
	#sobre #texts { width:660px; }
	
	.estetica #texts { background:url(../images/deco/beauty1.jpg) no-repeat 50% bottom; padding-bottom:320px; }
	.cabeleireiro #texts { background:url(../images/deco/hair1.jpg) no-repeat 50% bottom; padding-bottom:320px; }

#aside { float:right; width:180px; }

	.promo { background:url(../images/css/boxes_bkg_bottom.gif) no-repeat 50% bottom; padding-bottom:5px; margin-bottom:10px; }

/* =Header ---------------------------------------------------------------
------------------------------------------------------------------------*/
h1 { text-indent:-10000px; width:199px; background:url(../images/css/logo.gif) no-repeat left bottom; padding-top:5px; }
	h1 a { background:url(../images/css/logo.gif) no-repeat left bottom; display:block; height:110px; }

/* =Nav ---------------------------------------------------------------
------------------------------------------------------------------------*/
ul#mainNav { list-style:none; font-size:16px; text-transform:uppercase; position:absolute; bottom:4px; left:20px; text-align:center; }
	ul#mainNav li { float:left; }
	ul#mainNav a { color:#fff; text-decoration:none; padding:5px 0; margin:0 22px; }
		ul#mainNav a:hover { background:url(../images/css/mainNav_on.gif) repeat-x left top; }
		
		#home ul#mainNav li#nav-home a,
		#sobre ul#mainNav li#nav-sobre a,
		#servicos ul#mainNav li#nav-servicos a,
		#pacotes ul#mainNav li#nav-pacotes a,
		#contactos ul#mainNav li#nav-contactos a { background:url(../images/css/mainNav_on.gif) repeat-x left top; }

/* =SubNav ---------------------------------------------------------------
------------------------------------------------------------------------*/
ul#subNav { list-style:none; font-size:13px; }
	ul#subNav li { margin-bottom:1px; background:#f0d3e5; }
	ul#subNav a { display:block; color:#9d3d7c; text-decoration:none; padding:5px 8px; }
		ul#subNav a:hover { background:#9d3d7c; color:#f0d3e5; }
		
		.consultas ul#subNav li#nav-consultas a,
		.unhas ul#subNav li#nav-unhas a,
		.depilacao ul#subNav li#nav-depilacao a,
		.massagem ul#subNav li#nav-massagem a,
		.estetica ul#subNav li#nav-estetica a,
		.aparelhos ul#subNav li#nav-aparelhos a,
		.cabeleireiro ul#subNav li#nav-cabeleireiro a,
		.cosmetica ul#subNav li#nav-cosmetica a,
		.cheque ul#subNav li#nav-cheque a,
		.pacotes ul#subNav li#nav-pacotes a,
		.mulher ul#subNav li#nav-mulher a,
		.pai ul#subNav li#nav-pai a, .lipo ul#subNav li#nav-lipo a, .abril2010 ul#subNav li#nav-abril2010 a,
		.pacotes-aniv ul#subNav li#nav-aniv a,
		.promocoes ul#subNav li#nav-promocoes a,
		.contactos ul#subNav li#nav-contactos a,
		.mapa ul#subNav li#nav-mapa a { background:#9d3d7c; color:#f0d3e5; }

/* =Content ---------------------------------------------------------------
------------------------------------------------------------------------*/
.maps { margin-bottom:10px; }

#sobre #texts img {  margin:0 7px 7px 0; }

img.deco-imgs,
	#facebox img.deco-imgs { float:right; margin:0 0 10px 10px; border:2px solid #f0d3e5; }

/* =Type ---------------------------------------------------------------
------------------------------------------------------------------------*/
#content h2,
	#facebox h2 { margin-bottom:10px; font-size:22px; }

#content h3,
	#facebox h3 { margin-bottom:10px; font-size:16px; }
	
#content p,
	#facebox p { line-height:19px; margin-bottom:10px; }

#aside h3 { background:url(../images/css/boxes_bkg_top.gif) no-repeat 50% top; text-align:center; font-size:16px; font-weight:normal; padding:5px 7px 20px 7px; margin-bottom:-15px; }

#aside p { margin:7px; color:#c82672; text-align:center; font-size:11px; }
	#aside p a { color:#c82672; }

#texts ul,
	#facebox ul { margin-bottom:15px; margin-left:10px; list-style:inside circle; }
	#texts li,
		#facebox li { margin-bottom:4px; }

/* =Tables ---------------------------------------------------------------
------------------------------------------------------------------------*/
table { border-collapse:collapse; margin-bottom:15px; width:98%; }	
	table td, table th { padding:5px; border:1px solid #ffffff; border-width:0 1px 1px 0; }
	thead th { background:#91c5d4; }
		thead th[colspan], thead th[rowspan] { background:#66a9bd; }	
	tbody th, tfoot th { text-align:left; background:#91c5d4; }
	tbody td, tfoot td { text-align:center; background:#d5eaf0; }
	tfoot th { background:#b0cc7f; }
	tfoot td { background:#d7e1c5; font-weight:bold; }
	tbody tr:nth-child(odd) td { background:#bcd9e1; }

/* =Footer ---------------------------------------------------------------
------------------------------------------------------------------------*/
p#footer { clear:both; font-size:11px; background:url(../images/css/footer_bkg.jpg) no-repeat left bottom; padding:20px 5px 2px 5px; color:#fff; margin-bottom:10px; }
	p#footer a { color:#fff; text-decoration:underline; }