@import url(/assets/css/reset.css);

/*
Name: My Essentials - Alyce Platt
Author: Charith Welikala
Author URI: http://august.com.au
Date: May 7, 2010
Version: 1.0
*/



body{
	background:url(../img/bg.jpg) top center no-repeat #f9f7f4;
	}

.clear-both{ clear:both;}

#outer-frame{
	width: 100%;
  	height: 100%;
  	text-align: center;
	}




#wrapper-home{
	margin:0 auto;
	width:950px;
	background:url(../img/home-container-bg.png) no-repeat;
	}
#wrapper-common{
	margin:0 auto;
	width:950px;
	background:url(../img/about-container-bg.png) no-repeat;
	}
#wrapper-stockists{
	margin:0 auto;
	width:950px;
	background:url(../img/stockists-container-bg.png) no-repeat;
	}
#wrapper-news{
	margin:0 auto;
	width:950px;
	background:url(../img/news-container-bg.png) no-repeat;
	}
#wrapper-contact{
	margin:0 auto;
	width:950px;
	background:url(../img/contact-container-bg.png) no-repeat;
	}
#wrapper-wrap{
	margin:0 auto;
	width:950px;
	background:url(../img/wrap-container-bg.jpg) no-repeat;
	height:697px;
	}
#wrapper-pendant{
	margin:0 auto;
	width:950px;
	background:url(../img/pendant-container-bg.jpg) no-repeat;
	}
#wrapper-dress{
	margin:0 auto;
	width:950px;
	background:url(../img/dress-container-bg.jpg) no-repeat;
	}





#header{ height:40px;}

#container-home{
	width:940px;
	height:422px;
	}
#banner{
/*	width:539px; */
	height:154px;
	position: relative;
/*	left: 30px;*/    
    top: -190px;
	z-index:1;
/*	margin-left:200px;*/
}


h1 { 
	background:url(../img/my-essentials-logo.png) no-repeat;
	width:160px;
	height:156px;
	text-indent:-99999px;
	margin-left:35px;
	float:left;
	}
	
h1 a{ 
	display:block;
	width:160px;
	height:156px;
	}

h2 {
	font-size:14px;
	font-weight:lighter;
	margin-top:20px;
	text-shadow:0 1px 1px #ccc;
	}


/*//////MAIN NAVIGATION///////////*/

#nav-container{
	position:relative;
	top:-155px;
	float:left;
	left:-63px;
	z-index:2;
	}

#main-nav {
	background:url(../img/sprite-main-nav.png) no-repeat;
	width:388px;
	height:27px;
	margin-left:465px;
	display:block;
	position:relative;
	}
	#main-nav span{
		display:none;
		}
	#main-nav li,#main-nav a{
		height:27px;
		display:block;
	}
	#main-nav li{
		display:inline;
		list-style:none;
		float:left;
		}
	#main-nav-item1{width:50px;}
	#main-nav-item2{width:60px;}
	#main-nav-item3{width:60px;}
	#main-nav-item4{width:55px;}
	#main-nav-item5{width:65px;}
	#main-nav-item6{width:70px;}
	
	#main-nav-item1 a:hover{background:url(../img/sprite-main-nav.png) 0px -24px no-repeat;}
	#main-nav-item2 a:hover{background:url(../img/sprite-main-nav.png) -50px -24px no-repeat;}
	#main-nav-item3 a:hover{background:url(../img/sprite-main-nav.png) -110px -24px no-repeat;}
	#main-nav-item4 a:hover{background:url(../img/sprite-main-nav.png) -170px -24px no-repeat;}
	#main-nav-item5 a:hover{background:url(../img/sprite-main-nav.png) -225px -24px no-repeat;}
	#main-nav-item6 a:hover{background:url(../img/sprite-main-nav.png) -316px -24px no-repeat;}
	
#main-nav li ul {
	position: absolute;
	width: 10em;
	left: -999em;
	background:url(../img/drop-bg.png) top;
	padding:5px;
	display:block;
	}
#main-nav li ul li{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	}
	#main-nav li ul li a{ color:#fff; text-decoration:none;}

#main-nav li:hover ul, #main-nav li.sfhover ul {
	left: auto;
	display:block;
	}
	#drop1 a:hover{ background:none;}
	#drop2 a:hover{ background:none;}
	#drop3 a:hover{ background:none;}	
	#drop4 a:hover{ background:none;}




	
/*//////FOOTER///////////*/

#footer-container{
	margin-top:55px;
	}

#footer{
	position:relative;
	font-family:Arial, Helvetica, sans-serif;
	font-size:9px;
	color:#959595;
	width:920px;
	height:50px;
	line-height:14px;
	margin-top:0;
	}
	#footer a{ text-decoration:none; color:#959595;}
	#footer a:hover{ text-decoration:underline;}
	
#footer-l{
	width:615px;
	text-align:left;
	float:left;
	vertical-align:top;
	}
#footer-r{
	text-align:right;
	float:left;
	margin-left:45px;
	}
#footer-icons{ margin: 0 70px 0 10px;}


/*//////HOME PAGE///////////*/

.panel-holder{
	position:relative;
	float:left;
	width:158px;
	top:45px;
	left:50px;
	}
	


/*//////HOME PAGE TABS///////////*/

#tabs-container{
	height:150px;
	width:740px;
	float:left;
	position:relative;
	top:65px;
	left:50px;
	}
		
#tabMenu {margin:0; padding:0; list-style:none;}
#tabMenu li {float:left; height:30px; width:182px; cursor:pointer; cursor:hand;}

li.philosophy{background:url(../img/tabs/tab-philosophy.gif) no-repeat 0 -30px;}
li.about {background:url(../img/tabs/tab-about-alyce.gif) no-repeat 0 -30px;}


li.mouseover {background-position:0 0;}
li.mouseout {background-position:0 -30px;}
li.selected {background-position:0 0;}

.box {width:100%}
.boxTop { height:11px; clear:both; border-left:1px solid #efe9e2;}
*html .boxTop {margin-bottom:-2px;}

.boxBody {
	float:left;
	width:545px;
	border-left:1px solid #efe9e2;
	text-align:left;
	padding:0 0 0 5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	line-height:15px;
	color:#58595b;
	text-shadow:0 1px 1px #ccc;
	}
	.boxBody p{ margin:0 7px 7px;}
	.boxBody a{ text-decoration:none; color:#a98a5b;}
	.boxBody a:hover{ border-bottom:1px dotted #a98a5b;}

.boxBody div {display:none;}
.boxBody div.show {display:block;}



/*//////ABOUT PAGE///////////*/

#about-wrapper ul{
	list-style:disc;
	margin-bottom:120px;
	}
	#about-wrapper li{ line-height:16px; margin-bottom:15px;}

#about-nav {
	color:#a98a5b;
	}
	#about-nav a{display:inline; color:#a98a5b; text-decoration:none;}
	#about-nav a:hover{ border-bottom:1px dotted #a98a5b;}
	#previous{ float:left; margin-right:350px;}






/*//////TWO COLUMN TEMPLATE///////////*/

#sidebar{
	width:273px;
	height:412px;
	position:relative;
	float:left;
	padding: 10px 10px 0 50px;
	text-align:left;
	top:-20px;
	}
#sidebar-p{
	width:273px;
	height:412px;
	position:relative;
	float:left;
	padding: 0px 10px 0 50px;
	text-align:left;
	top:-30px;
	}
	
#sidebar h3, #sidebar-p h3{
	font-family:Arial, Helvetica, sans-serif;
	color:#ffe9ba;
	line-height:12px;
	font-size:10px;
	}
	
#sidebar h3 a, #sidebar-p h3 a{color:#ffe9ba; text-decoration:underline;}

.product-cat{
	float:left;
	color:#fff;
	font-family:Arial, Helvetica, sans-serif;
	margin-top:3px;
	}
	.product-cat span{ font-size:11px;}
	.product-cat p{ font-size:9px; margin:4px 0 4px 0;}
	.product-cat img{ margin:3px 7px 2px 0; float:left;}
	
	.reg-number span{ font-size:10px; color:#999; font-family:Arial, Helvetica, sans-serif;}

.order-button{
	position:relative;
	top:-550px;
	left:150px;
	}
.order-button-p{
	position:relative;
	top:-550px;
	left:150px;
	}
	
.order-button-dress{
	position:relative;
	top:-490px;
	left:150px;
	}





/*/////////////ALYCE SAYS TIP///////////*/

table,caption,tbody,tfoot,thead,tr,th,td
	{
	border: 0pt none;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0pt;
	padding: 0pt;
	}

/* Bubble pop-up */
.coda_bubble {
    position: relative;
    top: 0px;
    left: 0px;
    width:400px;
    text-align:left;
    float:left;
    padding-left:20px;
	}

.popup {
    position: absolute;
    display: none;
    z-index: 495;
    border-collapse: collapse;
	}

.popup td.corner {
    height: 15px;
    width: 19px;
	}

.popup td.topleft { background-image: url(../img/tip/bubble-1.png); }
.popup td.top { background-image: url(../img/tip/bubble-2.png); }
.popup td.topright { background-image: url(../img/tip/bubble-3.png); }
.popup td.left { background-image: url(../img/tip/bubble-4.png);}
.popup td.right { background-image: url(../img/tip/bubble-5.png); }
.popup td.bottomleft { background-image: url(../img/tip/bubble-6.png); background-repeat:no-repeat; }
.popup td.bottom { background-image: url(../img/tip/bubble-7.png); text-align: center; background-position:top; background-repeat:repeat-x;}
.popup td.bottom img { display: block; margin: 0 auto; float:left;}
.popup td.bottomright { background-image: url(../img/tip/bubble-8.png); background-repeat:no-repeat; }

.popup table.popup-contents {
    font-size: 11px;
    line-height: 1.2em;
    background-color: #fff;
    color: #58595B;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
	}
table.popup-contents th {
    text-align: right;
    text-transform: lowercase;
	}

table.popup-contents td {
   text-align: left;
	}
.popup td.bubble_content {
   background:white;
   font-family:Arial, Helvetica, sans-serif;
   font-style:italic;
   line-height:17px;
   font-size:11px;
   padding:15px 15px 0 15px;
   color:#58595B;
	}
.trigger{
	font-family: "verdana", arial, sans-serif;
	font-size:12px;
	}
#signature{ float:right;}

/*/////////////END ALYCE SAYS TIP///////////*/


#pdf-btn{ 
	position:relative;
	top:390px;
	left:284px;
	}

#dress-btn{ 
	position:relative;
	top:27px;
	left:293px;
	}

#catalog-column{
	position:relative;
	float:left;
	height:407px;
	width:577px;
	}

#catalog-wrap{
	position:relative;
	float:left;
	top:175px;
	left:215px;
	}
#catalog-pendant{
	position:relative;
	float:left;
	top:275px;
	left:237px;
	}
#catalog-dress{
	position:relative;
	float:left;
	top:280px;
	left:150px;
	}




/*/////////////////////////////////////////////////////////
////////////////// PRODUCT - WRAP///////////////////////*/ 

.product-tbl{ font-size:10px; padding:1px; margin-top:9px;}


.wrap-product1{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb1.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product2{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb2.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px; 
	}
.wrap-product3{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb3.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product4{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb4.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product5{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb5.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product6{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb6.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product7{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb7.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product8{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb8.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product9{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb9.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product10{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb10.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product11{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb11.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.wrap-product12{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/sun-wrap/wrap-thumb12.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}




.wrap-product1:hover{ background-position: 0 -73px; }
.wrap-product1 span{ display: none;	}

.wrap-product2:hover{ background-position: 0 -73px; }
.wrap-product2 span{ display: none;	}

.wrap-product3:hover{ background-position: 0 -73px; }
.wrap-product3 span{ display: none;	}

.wrap-product4:hover{ background-position: 0 -73px; }
.wrap-product4 span{ display: none;	}

.wrap-product5:hover{ background-position: 0 -73px; }
.wrap-product5 span{ display: none;	}

.wrap-product6:hover{ background-position: 0 -73px; }
.wrap-product6 span{ display: none;	}

.wrap-product7:hover{ background-position: 0 -73px; }
.wrap-product7 span{ display: none;	}

.wrap-product8:hover{ background-position: 0 -73px; }
.wrap-product8 span{ display: none;	}

.wrap-product9:hover{ background-position: 0 -73px; }
.wrap-product9 span{ display: none;	}

.wrap-product10:hover{ background-position: 0 -73px; }
.wrap-product10 span{ display: none;	}

.wrap-product11:hover{ background-position: 0 -73px; }
.wrap-product11 span{ display: none;	}

.wrap-product12:hover{ background-position: 0 -73px; }
.wrap-product12 span{ display: none;	}





/*/////////////////////////////////////////////////////////
////////////////// PRODUCT - PENDANT////////////////////*/ 


#sidebar-pendant{
	width:190px;
	height:412px;
	position:relative;
	float:left;
	padding: 0 10px 0 50px;
	text-align:left;
	}
#sidebar-pendant h3{
	font-family:Arial, Helvetica, sans-serif;
	color:#ffe9ba;
	line-height:18px;
	font-size:12px;
	}
.pendant-copy{
	font-family:Arial, Helvetica, sans-serif;
	color:#fff;
	line-height:14px;
	font-size:11px;
	margin:20px 0 20px 0;
	}
.pendant-copy2{
	font-family:Arial, Helvetica, sans-serif;
	color:#ffe9ba;
	line-height:14px;
	font-size:11px;
	margin:20px 0 20px 0; 
	}

#alyce-says-wrap{ margin-top:45px; left:-22px;}
#alyce-says-wrap-p{ margin-top:32px; left:-22px;}
#alyce-says-pendant{ margin-top:44px; left:-35px;}
#order-button-pendant{ top:-355px; left:135px; position:relative;}



.pendant-product1{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/pendant/pendant-thumb1.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.pendant-product2{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/pendant/pendant-thumb2.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.pendant-product3{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/pendant/pendant-thumb3.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.pendant-product4{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/pendant/pendant-thumb4.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}

.pendant-product1:hover{ background-position: 0 -73px; }
.pendant-product1 span{ display: none;	}

.pendant-product2:hover{ background-position: 0 -73px; }
.pendant-product2 span{ display: none;	}

.pendant-product3:hover{ background-position: 0 -73px; }
.pendant-product3 span{ display: none;	}

.pendant-product4:hover{ background-position: 0 -73px; }
.pendant-product4 span{ display: none;	}




/*/////////////////////////////////////////////////////////
////////////////// PRODUCT - DRESS////////////////////*/ 


#sidebar-dress{
	width:273px;
	height:412px;
	position:relative;
	float:left;
	padding: 0 10px 0 50px;
	text-align:left;
	}
#sidebar-dress h3{
	font-family:Arial, Helvetica, sans-serif;
	color:#ffe9ba;
	line-height:18px;
	font-size:12px;
	margin-bottom:15px;
	}

#alyce-says-dress{ margin-top:170px;}
#order-button-dress{ margin-top:15px; padding-left:80px;}





.dress-product1{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/dress/dress-thumb1.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.dress-product2{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/dress/dress-thumb2.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.dress-product3{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/dress/dress-thumb3.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}
.dress-product4{
  	display: block; width: 73px; height: 73px;
  	background: url("../img/products/dress/dress-thumb4.jpg") no-repeat 0 0;
	float:left; margin-right:10px; margin-top:10px;
	}


.dress-product1:hover{ background-position: 0 -73px; }
.dress-product1 span{ display: none;}

.dress-product2:hover{ background-position: 0 -73px; }
.dress-product2 span{ display: none;}

.dress-product3:hover{ background-position: 0 -73px; }
.dress-product3 span{ display: none;}

.dress-product4:hover{ background-position: 0 -73px; }
.dress-product4 span{ display: none;}


.open-panel { 
	display:block;
	width:112px;
	height:37px;
	background:url(../img/slider/btn-order.png) no-repeat;
	text-indent:-99999px;
	position:relative;
	top:-28px;
	left:775px;
	}
	
.close { 
	display:block;
	width:112px;
	height:41px;
	background:url(../img/slider/btn-close.png) no-repeat;
	position:relative;
	left:690px;
	text-indent:-99999px;
	}
#close-panel{
	width:900px;
	margin:0 auto;
	top:590px;
}


.copy{
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#58595B;
	line-height:17px;
	text-align:left;
	}
.copy p{ margin:5px 0 10px 0; text-shadow:0 1px 1px #ccc;}
.copy p a{ color: #A98A5B; text-decoration:none;}
.copy p a:hover{ border-bottom:1px dotted #A98A5B;}

#about-wrapper{
	float:left;
	padding:45px 25px 25px 70px;
	width:525px;
	}
#stokist-wrapper{
	float:left;
	padding:45px 25px 25px 70px;
	width:700px;
	}
#aboutap{
	display:block;
	background:url(../img/about-ap.gif) no-repeat;
	width:137px;
	height:21px;
	text-indent:-9999px;
	margin:0;
	}
#phil{
	display:block;
	background:url(../img/philosophy.gif) no-repeat;
	width:87px;
	height:23px;
	text-indent:-9999px;
	margin:0;
	}



/*/////////////////////////////////////////////////////////
////////////////// STOCKISTS ////////////////////*/ 

.stockist{
	float:left;
	width:30%;
	text-shadow:0 1px 1px #ccc;
	text-align:center;
	}
	.stockist li{ list-style:none;}
	.stockist dt{ font-weight:bold;}
	.stockist a{ text-decoration:none; color:#58595B;}
	.stockist a:hover{ border-bottom:1px dotted #A98A5B;}


/*/////////////////////////////////////////////////////
////////////////  Social Networks //////////////*/

#right{
	float:right;
	margin-top:90px;
}
.followustxt{
	font-size:11px;
	font-family:Arial, Helvetica, sans-serif;
	color:#58595B;
	text-shadow:0 1px 1px #CCCCCC;
}
#right ul{
	margin:0;
	padding:0;
	list-style:none;
}
#right ul li{
	float:left;
	margin:0 2px;
}
.fb a{
	display:block;
	width:20px;
	height:18px;
	background:url('../img/fb.png');
	text-decoration:none;
}
.fb a:hover{
	background:url('../img/fb_h.png');
}
.tw a{
	display:block;
	width:20px;
	height:18px;
	background:url('../img/tw.png');
	text-decoration:none;
}
.tw a:hover{
	background:url('../img/tw_h.png');
}
.size {
/*	float:right;
	line-height: 13px;
	width:75px;*/
}