"utf-8";


h1 {
	font-size: 1.3em;
}

h2 {
	font-size: 1.2em;
	letter-spacing: 0.1em;
}

h3 {
	font-size: 1.2em;
	font-variant: small-caps;
	letter-spacing: 0.1em;
	color: #333333;
}

h4 {
	font-size: 1em;
	letter-spacing: 0.05em;
	word-spacing: 0.15em;
}

/* gradient blue  */
.gradientB h1 {
	font: bold 2em/100% "Lucida Grande", Arial, sans-serif;
	position: relative;
	margin: 5px 0 5px;
	color: #0033CC;
	text-transform: none;
	letter-spacing: -1px;
}
.gradientB h1 span {
	background: url(../../images/backgrounds/gradient-glossy.png) repeat-x;
	position: absolute;
	display: block;
	width: 286px;
	height: 29px;
}


/* gradient pink  */
.gradientP h1 {
	font: bold 2em/100% "Lucida Grande", Arial, sans-serif;
	position: relative;
	margin: 5px 0 5px;
	color: #FF0066;
	text-transform: none;
	letter-spacing: -1px;
}

.gradientP h1 span {
	background: url(../../images/backgrounds/gradient-glossy.png) repeat-x;
	position: absolute;
	display: block;
	width: 100%;
	height: 29px;
}


/* gradient green  */
.gradientG h1 {
	font: bold 2em/100% "Lucida Grande", Arial, sans-serif;
	position: relative;
	color: #669900;
	margin: 5px 0 5px;
	text-transform: none;
	letter-spacing: -1px;
}
.gradientG h1 span {
	background: url(../../images/backgrounds/gradient-glossy.png) repeat-x;
	position: absolute;
	display: block;
	width: 100%;
	height: 29px;
}


/* gradient yellow  */
.gradientY h1 {
	font: bold 2em/100% "Lucida Grande", Arial, sans-serif;
	position: relative;
	margin: 5px 0 5px;
	color: #CC9933;
	text-transform: none;
	letter-spacing: -1px;
}
.gradientY h1 span {
	background: url(../../images/backgrounds/gradient-glossy.png) repeat-x;
	position: absolute;
	display: block;
	width: 100%;
	height: 29px;
}

/* gradient darkgray  */
.gradientD h1 {
	font: bold 2em/100% "Lucida Grande", Arial, sans-serif;
	position: relative;
	color: #666666;
	text-transform: none;
	letter-spacing: -1px;
}
.gradientD h1 span {
	background: url(../../images/backgrounds/gradient-glossy.png) repeat-x;
	position: absolute;
	display: block;
	width: 100%;
	height: 29px;
}

.article {
	font-family: Arial, Helvetica, sans-serif;
	color: #666666;
	font-weight: bold;
	text-transform: lowercase;
	font-size: medium;
	letter-spacing: 0.1em;
	word-spacing: 0.2em;
}
.silaco {
	color: #ff0066;
	font-weight: normal;
}

.hsibh {
	font-family: Arial, Helvetica, sans-serif;
	color: #ff0066;
	font-weight: 300;
	letter-spacing: 0.04em;
	font-style: normal;
}

.hsila {
	font-family: Arial, Helvetica, sans-serif;
	color: #529104;
	word-spacing: 0.2em;
	font-weight: normal;
	letter-spacing: 0.1em;
	text-transform: none;
	font-variant: normal;
	font-style: normal;
}

.hsiho {
	font-family: Arial, Helvetica, sans-serif;
	color: #CC9933;
	word-spacing: 0.2em;
	font-weight: normal;
	letter-spacing: 0.1em;
	text-transform: none;
	font-variant: normal;
	font-style: normal;
}

.h2 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #666666;
	font-size: 1.75em;
}

.h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: E01264;
	word-spacing: 1em;
	font-variant: small-caps;
}

.h4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .70em;
	color: 666666;
	background-color: #ccc;
  font-style: italic;
  font-variant: small-caps;
}

.blue-gen {
	font-family: Arial, Helvetica, sans-serif;
	color: #0033CC;
	word-spacing: 0.2em;
	font-weight: lighter;
	letter-spacing: 0.1em;
	text-transform: none;
	font-variant: normal;
	font-style: normal;
}

a {
	text-decoration:none;
	color:#0033CC;
}

a:hover {
	text-decoration:underline;
	color:#fe0e6f;
}

#sidenav #left a {
	font-weight:bold;
	color:#333333;
	padding:0 0 5px 0;
	margin:0;
	display:block;
}
#sidenav #left a:hover {
	color:#fe0e6f;
}
#container li {
	list-style-image:url(../../images/misc/bullet.gif);
}
img {
	border:0;
}
.clear {
	clear:both;
}
.hr {
	width:100%;
	height:2px;
	margin:10px 0;
	background-image: url(../../images/main/hr.jpg);
	background-repeat: repeat-x;
}
#left .learnmore {
	text-align:right;
	color:#2fb2d0;
	font-size:11px;
}
body {
	font: 12px Arial, Verdana, Helvetica, sans-serif;
	background: #ffffff;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}
#headerExpand {
	height:61px;
	width:100%;
	padding:0;
	margin:0;
}
#headerExpand #header {
	width:900px;
	height:61px;
	margin:0 auto;
	padding: 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	text-align:left;
	position:relative;
}
#headerExpand #header h1 {
	margin:0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	position:relative;
	top:18px;
	left:5px;
	background:url(../../images/main/shopit-la-logo.gif) no-repeat;
	width:244px;
	height:61px;
	text-indent:-9000px;
	float:left;	
}
#headerExpand #header #phoneNumber {
	position:absolute;
	top:0;
	right:0;
}
#navbar {
	float:right;
	width:650px;
	/*
	margin:0 0 0 250px;
	position:relative;*/
	margin:0;
	position:absolute;
	top:65px;
	right:0;
}
#navbar a {
	color:#333333;
	font-size:13px;
	padding:0 10px;
}
#navbar a:hover {
    background-color: #ff0066;
	color:#fff;
}
#navbar li {
	list-style:none;
	float:left;
}
#navbar li ul {
    display: none;
    width: 250px; /* Width to help Opera out */
    background-color: #FFFFFF;
	border:1px solid #000000;
	padding:5px 10px;
	position:absolute;
	top:16px;
	left:260px;
}

#navbar li:hover ul {
    display: block;
    position: absolute;
    margin: 0;
    padding: 0; }

#navbar li:hover ul, #navbar li.hover ul {
    display: block;
    position: absolute;
    margin: 0;
    padding: 0; }
#navbar li:hover li, #navbar li.hover li {
    float: none; }
#navbar li:hover li a, #navbar li.hover li a {
    background-color: #FFFFFF;
    color: #000; }

#navbar li:hover li a {
    background-color: #FFFFFF;
    color: #000;
	width:100%; 
}
#navbar li li a:hover {
	width:100%;
    background-color: #ff0066;
	color:#fff;
}

#dropOffLogo {
	position:absolute;
	right:10px;
	top:65px;
}


#container {
	width: 900px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF url(../../images/main/content-bg.jpg) repeat-y;
	padding:30px 12px;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
}
#mainContent {
	text-align: left; /* this overrides the text-align: center on the body element. */
	background-color: #FFFFFF;
	padding-top: 0;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 20px;
}
#no-sidenav #mainContent #left {
	float:left;
	width:550px;
	background:url(../../images/main/vert-hr.jpg) right repeat-y;
	padding-top: 0;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 0;
}
#no-sidenav #mainContent #right {
	float:right;
	width:270px;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 20px;
	height: 100%;
}
#sidenav #mainContent #left {
	float:left;
	width:270px;
	padding:0 20px 0 0;
}
#sidenav #mainContent #right {
	float:right;
	width:550px;
	padding:0 0 0 20px;
	background:url(../../images/main/vert-hr.jpg) left repeat-y;	
}
#footerExpand {
	height:70px;
	width:100%;
}
#footerExpand #footer {
	width:900px;
	margin:0 auto;
	padding:14px 10px 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	text-align:left;
	font-size:10px;
}
#footerExpand #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	color:#ffffff;
}
#footer a {
	color:#ffffff;
}
#container a#shopitbh, #container a#shopitla, #container a#shopithw{
	text-indent:-1000px;
	display:block;
	float:left;
	margin:0 18px;
}
#container a#shopitbh {
	width:287px;
	height:91px;
	background:url(../../images/logos/shop-it-beverlyhills.jpg) no-repeat;
}
#container a:hover#shopitbh, .pink #container a#shopitbh{
	background: url(../../images/logos/shop-it-beverlyhills_over.jpg) no-repeat;
}
#container a#shopitla{
	width:191px;
	height:91px;
	background:url(../../images/logos/shop-it-la.jpg) no-repeat;
}
#container a:hover#shopitla, .green #container a#shopitla{
	background: url(../../images/logos/shop-it-la_over.jpg) no-repeat;
}
#container a#shopithw{
	width:295px;
	height:91px;
	background: url(../../images/logos/shop-it-hollywood.jpg) no-repeat;
}
#container a:hover#shopithw, .yellow #container a#shopithw{
	background: url(../../images/logos/shop-it-hollywood_over.jpg) no-repeat;
}

/***** COLORS *****/
.pink #headerExpand {
	background:url(../../images/backgrounds/top-bg-pink.jpg) repeat-x;
}
.pink #footerExpand {
	background:url(../../images/backgrounds/bot-bg-pink.jpg) repeat-x;
}
.green #headerExpand {
	background:url(../../images/backgrounds/top-bg-green.jpg) repeat-x;
}
.green #footerExpand {
	background:url(../../images/backgrounds/bot-bg-green.jpg) repeat-x;
}
.blue #headerExpand {
	background:url(../../images/backgrounds/top-bg-blue.jpg) repeat-x;
}
.blue #footerExpand {
	background:url(../../images/backgrounds/bot-bg-blue.jpg) repeat-x;
}
.yellow #headerExpand {
	background:url(../../images/backgrounds/top-bg-yellow.jpg) repeat-x;
}
.yellow #footerExpand {
	background:url(../../images/backgrounds/bot-bg-yellow.jpg) repeat-x;
}

