/*
colors:
	background-color:#132634;
	main block background-color:#455560;
	dot colors on logo: #007F90;
	near white colors on logo: #b2b6b7;
	highlighted menu links: #00929f;
	content area for pages with images: #d1d2d4;

*/

body {
	background-color:#132634;
}
q, em{font-style:italic;}


/*Layout start*/
#container{
	width:942px;
	text-align:left;
	margin: 0 auto 20px;	/*0 because bkgr image should be at the top, note the margin of #hd*/
	background:url(../images/logoBkgr.gif) right top no-repeat;
}
#hd,#bd {text-align:left; clear:both;}
#hd {margin: 20px 0 14px; height:105px;}
#ft {
	font:11px Verdana, Arial, Helvetica, sans-serif;
	clear:both;
	width:754px;	/* yes, I want it to be narrow*/
	text-align:center;
	color:white;
	padding:1em 0;
}

/* Width with padding should be 754px */
#bd #main{
	width:714px;
	float:left;
	color:#fff;
	background-color:#455560;
	padding: 20px;
}
#bd #menu{width:175px; float:right;}
/*Layout end*/

/* Width of all images (w/o right margin) should be 754px */
#hd img {float:left; margin-right:14px;}

/*Menu*/
#menu a {display:block; width:149px; padding:6px 6px 6px 20px;}
#menu #miPromo {color:#EF7E3A;}
#menu a:link, #menu a:hover, #menu a:active, #menu a:visited{color:#fff; text-decoration:none;}
#menu a:hover, #menu a.active, 
	#servicesPage #miServices,
	#homePage #miHome,
	#galleryPage #miGallery,
	#aboutPage #miAbout,
	#moltonBrownPage #miMoltonBrown,
	#policiesPage #miPolicies,
	#pressPage #miPress,
	#giftsPage #miGifts,
	#promoPage #miPromo
	{background-image:url(../images/dotMenu.gif); background-repeat:no-repeat; background-position: 0 10px; color:#00929f;}


/*Footer*/
#ft a:link, #ft a:active, #ft a:visited {color:#fff;}
#ft a:hover {color:#00929f;}
#ft span {margin-right:32px;}
#ft a.pranas {
	font-size:9px;
	color:#333;
	text-decoration: none;
}
#ft a.pranas:hover {color:#00929f; text-decoration:underline;}
#main img.mainImage {float:left; width:180px;}	/*border is part of the image - not my choice*/
#main div.mainText {
	background-color:#d1d2d4;
	padding: 20px;
	float:right;
	width:474px; /*714(#main) - 180(img) - 20(margin b/w image and text) = 514 - 40px (own padding) =474px*/
	color: #202020;
}
#main div.blockSeparator{clear:both; margin:0;}

h1 {font-family:Arial, Helvetica, sans-serif;}	/*Georgia, "Times New Roman", Times, serif*/
h1{font-size:18px; font-weight:normal;}
h1,p, dd{margin-bottom:1em;}
#main div.mainText h2, #main div.mainText h3, #main div.mainText dt{color:#00929f;}
#main div.mainText h2 {text-transform: uppercase;}
#main div.mainText h3 {font-weight:normal;} 
strong {font-weight:bold;}
.clear{clear:both;}

/*Home page*/
#homePage h1 {text-align:center; font:bold 16px Verdana, Arial, Helvetica, sans-serif;letter-spacing: 0.10em;}
#homePage p {text-align:center;}

/*Services pages*/
#subNav {text-align:center;font:11px Arial, Helvetica, sans-serif; margin-bottom:12px;}
#subNav a {
	display:block;
	float:left;
	padding:4px 8px;
	margin:2px 8px 2px 0;
	width:116px;
	text-decoration:none;
	white-space: nowrap;
	color:#fff;
	border: 1px solid #00929F;
}
#subNav a:hover, #subNav a.active {background-color: #00929F;}
.russianQuote {font: italic bold 14px Verdana, Arial, Helvetica, sans-serif; color:#666;}
#servicesPage h2{margin-bottom:12px;}
.price{color:#00929f;}

/*Press pages*/
div.pressThumbs img{margin:4px auto;}
/*div.pressThumbs img:hover { cursor:pointer;}*/
div.pressThumbs {
	float:left;
	padding:12px;
	margin: 0 8px 8px 0;
	background-color:#d1d2d4;
	text-align:center;
	color:#000;
	border:1px solid #132634;
	height:192px;	
	width:138px;
}
div.multiThumbs {width:248px;}
div.multiThumbs img {float:left; margin: 4px 8px 4px 0} 
div.multiThumbs img.lastThumb {margin-right:0;}
#onlineMedia div.pressThumbs {height:100px;}

#promoPage #main ol {list-style:decimal; font-size:14px; margin-bottom:60px;margin-left:20px;}
#promoPage #main ol li { line-height:2em;}