﻿/*************************************************************************
' Function : CSS defintions for the store.
' Product  : SaoLinh Store Frontend
' Version  : 4.1

' Modified : May 2007
' Copyright: Copyright (C) 2004 SaoLinh.com, Inc. 
'            See "license.txt" for this product for details regarding 
'            licensing, usage, disclaimers, distribution and general 
'            copyright requirements. If you don't have a copy of this 
'            file, you may request one at http://www.SaoLinh.com
'**************************************************************************/

/* General Tag specifications */
BODY, B, TD, P     {COLOR: #333333; FONT-FAMILY:  Tahoma, Arial, Verdana; FONT-SIZE: 8pt; text-align:left}

/* width of the body content */
.content
{
    margin-top: 0px;
    margin-bottom: 0px;
    width: 100%;
}


/* Info Box WITHOUT Headings */
.CPbox1            {COLOR: #333333; BACKGROUND-COLOR: #F5F5F5; BORDER: 1px solid #BBC3D3}
.CPbox1 A:link     {COLOR: #333333; FONT-SIZE: 8pt; FONT-WEIGHT: bold; TEXT-DECORATION: none}
.CPbox1 A:visited  {COLOR: #333333; FONT-SIZE: 8pt; FONT-WEIGHT: bold; TEXT-DECORATION: none}
.CPbox1 A:hover    {COLOR: #996666; FONT-SIZE: 8pt; FONT-WEIGHT: bold; TEXT-DECORATION: underline}

.CPbox1head            {COLOR: #333333;  BORDER: 0px solid #BBC3D3;margin-left:15px;padding:0px}
.CPbox1head A:link     {COLOR: #333333; FONT-SIZE: 8pt; FONT-WEIGHT: normal; TEXT-DECORATION: none}
.CPbox1head A:visited  {COLOR: #333333; FONT-SIZE: 8pt; FONT-WEIGHT: normal; TEXT-DECORATION: none}
.CPbox1head A:hover    {COLOR: #996666; FONT-SIZE: 8pt; FONT-WEIGHT: normal; TEXT-DECORATION: underline}

.CPbox2head            {COLOR: white;  BORDER: 0px solid #BBC3D3;padding-top:7px; text-align:center}
.CPbox2head A:link     {COLOR: white; FONT-SIZE: 8pt; FONT-WEIGHT: normal; TEXT-DECORATION: none}
.CPbox2head A:visited  {COLOR: white; FONT-SIZE: 8pt; FONT-WEIGHT: normal; TEXT-DECORATION: none}
.CPbox2head A:hover    {COLOR: #edc439; FONT-SIZE: 8pt; FONT-WEIGHT: normal; TEXT-DECORATION: underline}

/* Info Box WITH Headings ( H = Heading cell ; B = Body cell ) */
.CPbox2            {COLOR: #333333; BACKGROUND-COLOR:  ; BORDER: 1px solid #BBC3D3}
.CPbox2H           {COLOR: #333333; BACKGROUND-COLOR: #DDDDDD; PADDING: 2px}
.CPbox2H B         {COLOR: #333333;}
.CPbox2B           {COLOR: #333333; BACKGROUND-COLOR:; FONT-SIZE: 10px; }
.CPbox2B A:link    {COLOR: #333333; FONT-SIZE: 10px; TEXT-DECORATION: none}
.CPbox2B A:visited {COLOR: #333333; FONT-SIZE: 10px; TEXT-DECORATION: none}
.CPbox2B A:hover   {COLOR: #996666; FONT-SIZE: 10px; TEXT-DECORATION: underline}

.CPbox2Footer            {COLOR: #333333; BACKGROUND-COLOR: white ; BORDER: 0px solid #BBC3D3}

.CPbox2B1           {PADDING-right: 1px;}
.language           {font-size:8pt}

.CPbox2cart           {COLOR: #999999; FONT-WEIGHT: bold;}
/* Box - Page Headings */
.CPpageHead {BORDER-BOTTOM: 2px solid #CCCCCC; PADDING-BOTTOM: 4px}

/* Box - Page Navigation */
.CPpageNav {BACKGROUND-COLOR: #EEEEEE}

/* Box - General Headings */
.CPgenHeadings {BACKGROUND-COLOR: #EEEEEE}

/* Box - Product Image (Home page) */
.CPhomeImg {BACKGROUND-COLOR: #F5F5F5; BORDER: 1px solid #CCCCCC}

/* Box - Product Description (Home page) */
.CPhomeDesc {BORDER-BOTTOM: 1px solid #CCCCCC}

/* Horizontal and Vertical lines */
.CPlines {BACKGROUND-COLOR: #CCCCCC}

/* Product Short Description (Except Detail page) */
.CPprodDesc            {COLOR: #000099;  BORDER: 0px solid #BBC3D3; text-align:center}
.CPprodDesc A:link     {COLOR: #000099; FONT-SIZE: 8pt; FONT-WEIGHT: bold; TEXT-DECORATION: none}
.CPprodDesc A:visited  {COLOR: #000099; FONT-SIZE: 8pt; FONT-WEIGHT: bold; TEXT-DECORATION: none}
.CPprodDesc A:hover    {COLOR: #0000FF; FONT-SIZE: 8pt; FONT-WEIGHT: bold; TEXT-DECORATION: underline}


/* Product Short Description (Detail page only) */
.CPprodDescDet {FONT-SIZE: 11pt}

/* Product Long Description */
.CPprodDescLong {}

/* Product Detail */
.CPprodDet {}

/* Product SKU */
.CPprodSKU {}

/* Product Price - Text Label */
.CPprodPriceT {COLOR: #800000}

/* Product Price - Price Value */
.CPprodPriceV {COLOR: #800000}

/* Product List Price - Text Label */
.CPprodLPriceT {}

/* Product List Price - Price Value */
.CPprodLPriceV {TEXT-DECORATION: line-through}

/* Product Sale Price - Text Label */
.CPprodSPriceT {}

/* Product Sale Price - Price Value */
.CPprodSPriceV {COLOR: red}

/* Free Shipping text */
.CPfreeShipMsg {COLOR: #888888}

/* In Stock text */
.CPinStock {COLOR: #888888}

/* Out of Stock text */
.CPoutStock {COLOR: red}

/* No Image text */
.CPnoImgT {COLOR: #800000}

/* Category List */
.CPcatDescList {}

/* Category Description - No products linked to it */
.CPcatDesc {}

/* Category Description - Has products linked to it */
.CPcatDescProd {FONT-WEIGHT: bold}

/* Option Description for "Optional" options */
.CPoptDesc {FONT-STYLE: italic}

/* Option Select box */
.CPoptSel {FONT-FAMILY: Verdana, Arial, helvetica; FONT-SIZE: 8pt}

/* Option Text box */
.CPoptTxt {FONT-FAMILY: Verdana, Arial, helvetica; FONT-SIZE: 8pt}


/* ------------------- */
/* ADDED - Version 2.3 */
/* ------------------- */

/* Box - 2, 3 and 4 Column Layout for product list page */
.CPcolsView {BACKGROUND-COLOR: ; BORDER: 1px solid #CCCCCC}
.CPcolsView A:link    {COLOR: #000099; TEXT-DECORATION: none}
.CPcolsView A:visited {COLOR: #000099; TEXT-DECORATION: none}
.CPcolsView A:hover   {COLOR: #996666; TEXT-DECORATION: underline}

/* System Messages */
.CPsysMsg    {FONT-SIZE: 10pt;}
.CPsysMsgErr {COLOR: red; FONT-SIZE: 10pt;}
.CPsysMsgURL {FONT-SIZE: 10pt}

/* ------------------- */
/* ADDED - Version 2.4 */
/* ------------------- */

/* Highlights used in search results */
.CPhighlight {COLOR: #000000; BACKGROUND-COLOR: #ffff66}

/* ------------------- */
/* ADDED - Version 2.5 */
/* ------------------- */

/* Radio Button options */
.CPoptRadio {FONT-FAMILY: Verdana, Arial, helvetica; FONT-SIZE: 8pt}

/* Option Description for "Mandatory" options*/
.CPoptDescM {FONT-STYLE: italic; color: Red}


/* ---------------------*/
/* ADDED -- Version 3.0 */
/* ---------------------*/
.CPcloseWindow {FONT-SIZE: 6pt; TEXT-DECORATION: none;}
.install { 
	BORDER: 1px solid #BBC3D3
}

.installcomment {
	PADDING-LEFT: 30px;
}

.textBlock {
	BACKGROUND-COLOR: #EEEEEE;
	BORDER: 1px solid #CCCCCC;
}

.maintClosed {
	color: red;
	font-size: 15pt;
	text-align: center;
}

.CPContactUs {

}

/* -------------------- */
/* ADDED -- Version 3.5 */
/* -------------------- */
.findTable {
	background-color: #EEEEEE;
	BORDER: 1px solid #CCCCCC;
}
.listTable {
	background-color: #EEEEEE;
}
.listRowTop {
	BACKGROUND-COLOR: #DDDDCC;
	BORDER-TOP: 1px solid #888888;
	BORDER-BOTTOM: 1px solid #888888;
}
.listRowHead {
	BACKGROUND-COLOR: #DDDDDD;
}
.listRowBot {
	BACKGROUND-COLOR: #DDDDCC;
	BORDER-TOP: 1px solid #888888;
	BORDER-BOTTOM: 1px solid #888888;
}

/* --------------------  */
/* ADDED -- Version 4.1  */
/* --------------------  */
.cpbeta {
	color: red;
	font-size: 14pt;
	
}

/* New template style */ 
html .boxhead h2 {height: 1%;} /* For IE 5 PC */

.sidebox {
	margin: 0; /* center for now */
	width: 24em; /* ems so it will grow */
	background: url(../usermods/img/featurebox/sbbody-r.gif) no-repeat bottom right;
	font-size: 100%;
}
.boxhead {
	background: url(../usermods/img/featurebox/sbhead-r.gif) no-repeat top right;
	margin: 0;
	padding: 0;
	text-align: center;
}
.boxhead h2 {
	background: url(../usermods/img/featurebox/sbhead-l.gif) no-repeat top left;
	margin: 0;
	padding: 22px 30px 5px;
	color: white; 
	font-weight: bold; 
	font-size: 1.2em; 
	line-height: 1em;
	text-shadow: rgba(0,0,0,.4) 0px 2px 5px; /* Safari-only, but cool */
}
.boxbody {
	background: url(../usermods/img/featurebox/sbbody-l.gif) no-repeat bottom left;
	margin: 0;
	padding: 5px 30px 31px;
	text-align: left;
}

.boxbody a {	
	text-decoration: none;
}
.boxbody a:hover {
	text-decoration: underline;
}
.boxbody span.cpCart {
	text-align: left;
	padding-right: 3em;
}


div.cartAndLoginLinks {width:150px; float:left; margin-top:0px; }
div.cartAndLoginLinks a{color:#666;text-decoration:none;}
div.cartAndLoginLinks a:hover{color:#000;text-decoration:underline;}
.loginLinks {float:left;font-size:0.916em; border-left:1px solid #ccc;}
.loginLinks li {padding:0px 20px; line-height:5px;}
.loginLinks li.login {display:block; text-align:right;}
.loginLinks li.wishlist {background: transparent url(../images/bg-sitesAndUser.gif) no-repeat right 0px; padding-right:10px;}

.loginLinks li.login a {position:relative; display:block; width:97px; height:20px; background: transparent url(../images/bg-login-register-button.gif) no-repeat center top;}
.loginLinks li.login a.logout {background-position:center -80px;}
.loginLinks li.login a:hover {display:block; width:97px; height:20px; background: transparent url(../images/bg-login-register-button.gif) no-repeat center -40px;}
.loginLinks li.login a.logout:hover {background-position:center bottom;}
.ir {display:block; margin:0; padding:0; width:1px; height:1px; overflow:hidden; text-indent:-999em;}


div.brandingLinks{float:left;margin-bottom:1em;width:20em;margin-left:15px;}
div.brandingLinks a#bhLogo {display:block;height:68px; background: transparent url(../images/m_logo.gif) center center no-repeat;}
div.brandingLinks a#bhLogo img {display:none;}
div.brandingLinks h2{background:transparent url(../images/banneraudio2010.gif) no-repeat;display:block;float:left;height:50px;margin:.25em 0 0 1em;text-indent:-9999em;width:346px;}
div.brandingLinks span.mainPhoneNumbers{color:#666;float:left;margin:.25em 0 0 1.5em; width:auto; word-spacing:0.3em;}
/*Floats*/
div.brandingLinks a#bhLogo,div.brandingLinks a#bhLogo img,div.searchAndSuppBox form,div.searchAndSuppBox form fieldset,div.searchAndSuppBox label,div.searchAndSuppBox input#mainSearchInput,div.searchAndSuppBox #mainSearchGo,div.storeNotes{float:left;}

div.searchAndSuppBox{background:transparent url(../images/bg-top-search-box.gif) repeat;height:3em;}
div.searchAndSuppBox form {position:relative;}
div.searchAndSuppBox form legend{display:none;}
div.searchAndSuppBox form select{float:left;margin:0.3em 0.5em 0 70px;}
div.searchAndSuppBox div.supplementaryLinks{float:right;line-height:1em;}
div.searchAndSuppBox div.supplementaryLinks ul li{padding-right:1em;}
div.searchAndSuppBox div.supplementaryLinks ul li a{text-decoration:none;}
div.searchAndSuppBox,div.searchAndSuppBox a{color:#FFF;}
div.searchAndSuppBox a:hover{color:#edc439;}
div.searchAndSuppBox input#mainSearchInput{width:247px;font-family:Arial;font-size:1.2em;background:#fbfbfb url(../images/bg-header-search-glass.gif) top left no-repeat;padding-left:3em;border:none;color:#666;height:1.5em;margin-top:0.3em; margin-left:1px;}
div.searchAndSuppBox #mainSearchGo{margin-left:0.25em;margin-top:3px; *margin-top:2px; padding:0; background:none; border:none; cursor:pointer;}
div.searchAndSuppBox .searchUsed {color:white; margin-left:6px; margin-left:5px; line-height:2.3;}
div.searchAndSuppBox .searchUsed input {vertical-align:-2px; *vertical-align:-3px; margin-right:4px;}

div.searchAndCatsBox{position:relative; background-color:#071E94;border:1px solid #071E94;clear:both;float:left;margin-top:0em;width:978px; z-index:2;background: url(../background/back_ground_img_03.gif); 
}
div.searchAndCatsBox #autoSuggestions {display:none; position:absolute; color:black; background:#fff; z-index:999; left:13px; *left:14px; width:279px; top:26px; border:1px solid #666; padding-bottom:0.5em;}
div.searchAndCatsBox #autoSuggestionsList {background:#fff;}
div.searchAndCatsBox #autoSuggestionsList ul li {cursor:pointer;list-style-type:none; font-family:Arial; color:#666; padding-left:18px;}
div.searchAndCatsBox #autoSuggestionsList ul li.hoverOver {background-color:#EEEEEE;color:#666666;}
div.searchAndCatsBox #autoSuggestions {display:none; position:absolute; color:black; background:#fff; z-index:999; left:13px; *left:14px; width:279px; top:26px; border:1px solid #666; padding-bottom:0.5em;}
div.searchAndCatsBox #autoSuggestionsList {background:#fff;}
div.searchAndCatsBox #autoSuggestionsList ul li {cursor:pointer;list-style-type:none; font-family:Arial; color:#666; padding-left:18px;}
div.searchAndCatsBox #autoSuggestionsList ul li.hoverOver {background-color:#EEEEEE;color:#666666;}

div.mainCategoryLinks{clear:both;float:left;width:100%;}
div.mainCategoryLinks ul{background:transparent url(../images/bg-top-cats-box.gif) repeat;width:100%;float:left;line-height:2.08;}
div.mainCategoryLinks a{color:#000;font-family:Verdana;font-size:0.916em;text-decoration:none;}
div.mainCategoryLinks a:hover {color:#555;}
div.mainCategoryLinks ul li{border-left:1px solid #bbb;padding-left:0.75em;padding-right:0.25em; *word-spacing:0;}
div.mainCategoryLinks ul li.first{border-left:none;padding-left:.75em;}
div.mainCategoryLinks ul li.last{padding-left:1em;}


/* ---------------------*/
/* CSS Flyout Menu Mod  */
/* ---------------------*/
#vertnav{list-style: none;}

ul#vertnav   { 
	margin:0;
	list-style: none;
   width:160px;
   z-index:99;
   overflow:visible;
   position:static; 
   background-color:#FFFFFF;
   padding-top: 5px; 
   padding-left: 3px; 
}

ul#vertnav li { 
	position: relative;
	width: 160px;
   background-color:white;
   border-bottom: solid 1px #CECECE;
   display:block;
   height:26px;
   margin:0px 0px 0px 0px;
}
#vertnav ul li{ background-color: #E9E9E9;} /* Mau cua li con*/

#vertnav li{ border-width:0px 0px 0px 0px;}
#vertnav li:last-child{border-bottom:0px solid #CECECE;}

#vertnav a {
    text-decoration:none; 
    display:block;
    padding-top: 5px;  
    margin:0px 0px 0px 0px; /*helps Opera with hover */
    width:160px; /*helps IE with hover */
    height:26px;
   padding-left: 3px; 
   
}
#vertnav li:hover, #vertnav a:hover{
    background-color:; 
	color:red; 
    width:160px; /*helps IE with hover */
    height:26px;
	
}

#vertnav ul{
    display:none; 
    position:absolute; 
    top:0; 
    left:120px;
	border-right: solid 1px #CECECE;
	border-bottom: solid 1px #CECECE;
}

#vertnav li:hover ul ul{
    display:none; 
  
}

#vertnav li:hover ul{
    display:block;
}

li>ul { 
	top: auto;
	left: auto;
}

/* Win IE only \*/
* html #vertnav li{float:left;} 
/* end holly hack */
/* Box - Product Image (Home page) */
.CPhomeImg {BORDER-right: 0px solid #999999; BORDER-bottom: 0px solid #FF9900; width:33%;}
.CPhomeImg1 {BORDER-right: 0px solid #99FFFF; BORDER-bottom: 0px solid #FF9900; width: 33%;	}

.CPhomeImg2 {BORDER-left: 0px solid #CCCCCC; BORDER-bottom: 0px solid #CCCCCC; width: 110px;}

.CPhomeImg3 {BORDER-right: 0px solid #CCCCCC;  	BACKGROUND: url(../2009/bghat3.gif) ;background-repeat:repeat-y; background-position:right; padding-right:3px; padding-left:3px;width: 165px;height:150px}

.CPhomeImg4 {BORDER-left: 0px solid #CCCCCC; BORDER-bottom: 0px solid #CCCCCC; 	BACKGROUND: url(../2009/bghat4.gif);background-repeat:repeat-x; background-position:right;  padding-left:3px; }

.CPhomeImg5 {BORDER-right: 0px solid #87E184; BORDER-top: 0px solid #87E184; 	BACKGROUND: url(../2009/);background-repeat:repeat-y; background-position:right; padding-right:1px;}

.CPhomeImg6 {BORDER-right: 0px solid #99FFFF; BORDER-bottom: 0px solid #FF9900; width: 275px; BACKGROUND: url(../2009/block_B.gif) ;background-repeat:repeat-y; background-position:right; padding-left:10px;padding-top:6px;padding-right:3px}

.clr8 			{FONT-FAMILY: Tahoma,Arial,Verdana, Helvetica; FONT-SIZE: 13px; BACKGROUND: url(../background/bg.gif); padding:5px;COLOR: #000033; }
.clr8 A:link    {COLOR: #000033; FONT-SIZE: 13px; TEXT-DECORATION: none; font-weight:bold}
.clr8 A:visited {COLOR: #000033; FONT-SIZE: 13px; TEXT-DECORATION: none; font-weight:bold}
.clr8 A:hover   {COLOR: #000033; FONT-SIZE: 13px; TEXT-DECORATION: underline; font-weight:bold}
  
.clr9 			{FONT-FAMILY: Tahoma,Arial,Verdana, Helvetica; FONT-SIZE: 13px; ; BACKGROUND: url(../background/bg.gif); padding:5px;COLOR: #000033; }
.clr9 A:link    {COLOR: #000033; FONT-SIZE: 13px; TEXT-DECORATION: none; font-weight:bold}
.clr9 A:visited {COLOR: #000033; FONT-SIZE: 13px; TEXT-DECORATION: none; font-weight:bold}
.clr9 A:hover   {COLOR: #000033; FONT-SIZE: 13px; TEXT-DECORATION: underline; font-weight:bold}
