/*************************************************************/
/*   Design:   Uncle Otis Web Store                          */
/*   File:     Global Styles                                 */
/*-----------------------------------------------------------*/
/*   Date:     August 25, 2008                               */
/*   Version:  0.0.2                                         */
/*************************************************************/


/*************************************************************/
/*  Global  												 */
/*************************************************************/

/* Used to reset browser defaults */
body { margin: 0; padding: 0; }



/* Text Styles */
body {
	/*font-family: "Lucida Grande", Arial, Helvetica, sans-serif;*/
    font-family: Helvetica, Arial, sans-serif;
}

h1 {}
h2 {}
h3 {}
h4 {}

p {}
hr.greyLine { color: #b0b6bb; background-color: #b0b6bb; height: 1px; border: 0px; }

.plainText { color: #666; }


/*************************************************************/
/*  Main Section  											 */
/*************************************************************/

/* Main Content */

#container {
	width: 950px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 25px;
}



/*************************************************************/
#designers { width: 700px; font-size: 11px; color: #666; }



#designersLeft { width: 300px; float: left; }



#designersRight { width: 300px; float: right; }



#customerService { width: 500px; font-size: 11px; color: #666; }



#textPages { width: 500px; font-size: 11px; color: #666; }



#aboutUs { width: 700px; margin-top: 12px;}



#aboutUsLeft { float: left; width: 325px; }



#aboutUsRight { float: right; width: 375px; }


/*  Header Section 											 */
/*************************************************************/

#header {
	width: auto;
	height: 60px;
	background: url(headerBackground.gif) no-repeat;
}

.headerImage {
	padding-top: 10px;
}


#topLogo{
	float: left;
	width: 125px: 
}

#topNavLeft { 
	font-size: 12px;
	color: #fff;
	padding-left: 135px;
	padding-top: 25px;
	width: 400px;
}

.topNavLinkLeft a {
    text-decoration: none;
    color: #fff;
}

.topNavLinkLeft a:hover {
    text-decoration: underline;
}

#topNavRight {
	padding-left: 725px;
	font-size: 12px;
	color: #fff;
	margin-top: -15px;
	
}

.topNavLinkRight a {
    text-decoration: none;
    color: #fff;
}

.topNavLinkRight a:hover {
    text-decoration: underline;
}

#topNavLeft { font-size: 12px; color: #fff; padding-left: 135px; padding-top: 25px; width: 400px; }

.topNavLinkLeft a { text-decoration: none; color: #fff; }



.topNavLinkLeft a:hover { text-decoration: underline; }



#topNavRight { padding-left: 725px; font-size: 12px; color: #fff; margin-top: -15px; }



.topNavLinkRight a { text-decoration: none; color: #fff; }



.topNavLinkRight a:hover {	text-decoration: underline; }




/*************************************************************/
/*  Side Bar Section    									 */
/*************************************************************/


#sidebar {
	float: left;
	width: 125px;
	padding-left: 10px;
}


/* Search Section */

#search {
	padding-top: 15px;
}

.searchText {
    color: #b0b6bb;
    font-size: 12px;
    font-family: "Lucida Grande", Arial, Helvetica, sans-serif;
    padding-top: 4px;
    padding-top: 5px;
}

.searchText a {
    text-decoration: none;
    color: #b0b6bb;
}

.searchText a:hover {
    color: #00aeef;
}

/* Navigation Section */

#navigation {
	font-size: 12px;
	color: #b0b6bb;
	/*margin-left: -40px;*/
}

#navigation ul {
	list-style: none;
}

#navigation ul li {
	padding-top: 5px;
}

.sideBarNavigation a {
	text-decoration: none;
	color: #b0b6bb;
}

.sideBarNavigation a:hover {
	text-decoration: none;
	color: #00aeef;
}

.leftNavLevel1 {text-decoration: none; color: #b0b6bb;}

.leftNavLevel1 a { 
	text-decoration: none;
	color: #b0b6bb;
 }

.leftNavLevel1 a:hover {
	text-decoration: none;
	color: #00aeef;
 }

.leftNavLevel2 { text-decoration: none; color: #b0b6bb; padding: 2px 0 3px 30px; }

.leftNavLevel2 a { 	
	text-decoration: none;
	color: #b0b6bb;
 }

.leftNavLevel2 a:hover { text-decoration: none; color: #00aeef;}


.leftNavLevel1Highlight a {

	color: #00aeff;

	text-decoration:none;

}



/*************************************************************/
/*  Main Content Section 									 */
/*************************************************************/


#mainContent {
	width: 768px;
	float: right;
	background-color: #fff;
}

#mainContentHome {
	width: 768px;
	float: right;
	background: #fff url(treeBackground.jpg) no-repeat;
	min-height: 630px /* only for testing purposes REMOVE */
	height: auto !important;
	height: 630px;	
}

#saleBannerBar {
	width: 674px;
	height: 50px;
	margin-top: 345px;
	background-color: #00aeef;
}



#saleBannerTitle { 
	font-size: 14px;
	color: #fff;
	padding-left: 5px;
	margin-top: -8px;
	width: 300px;
}


#saleBannerText {
	/*padding-left: 200px;*/
    width: 300px;
	font-size: 12px;
	color: #fff;
    margin-right: 67px;
	/*margin-top: -25px;*/
}




#mainPageBoxes {
	width: 674px;
	display: inline;
	font-size: 12px;
	color: #00aeef;
}

#mainBox1 {
	width: 266px;
	height: 136px;
	float: left;
	padding-left: 0px;
	padding-right: 10px;
	padding-top: 10px;
}	

#mainBox2 {
	width: 184px;
	height: 136px;
	float: left;
	margin-left: 0px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
}	

#mainBox3 {
	width: 184px;
	height: 136px;
	float: left;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
}	


a:hover .promoImage {
	border: 2px solid #00aeef;
	color: #00aeef;
}


a .promoImage {
	border: 2px solid transparent;
}




/*  Designer Content Page 									 */

/*************************************************************/








.designerText {

	font-size: 12px;

	color: #00aeef;

	font-weight: bold;

}





.designerText a {

	text-decoration: none;

	color: #666;

}





.designerText a:hover {

	text-decoration: underline;

	color: #00aeef;

}




.designerText a:active {

	text-decoration: underline;

	color: #00aeef;

}



.designerText a:visited {

	text-decoration: none;

	color: #666;

}



.designerTitle {

	font-size: 12px;

	color: #00aeef;

}




.designerLink {

	font-size: 11px;

	color: #666;

}



.designerLink a {

	text-decoration: none;

	color: #666;

}



.designerLink a:hover {

	text-decoration: underline;

	color: #00aeef;

}




.designerLink a:active {

	text-decoration: underline;

	color: #00aeef;

}



.designerLink a:visited {

	text-decoration: none;

	color: #666;

}

.customerServiceHeadTitle {

	font-size: 14px;

	color: #00aeef;

	font-weight: bold;

}



.customerServiceText {

	font-size: 11px;

	color: #666;

}



.customerServiceTitle {

	font-size: 12px;

	color: #666;

	font-weight: bold;

}



.customerServiceTable {

	border: solid 1px #666;

}



.customerServiceLink { font-size: 11px; color: #00aeef;}

.customerServiceLink a { text-decoration: none; color: #00aeef;}

.customerServiceLink a:hover { text-decoration: underline; color: #666; }

.customerServiceLink a:active { text-decoration: underline; color: #666;}

.customerServiceLink a:visited { text-decoration: underline; color: #00aeef; }



.aboutText { font-size: 11px; color: #666; }



.helpDeskTitle { font-size: 14px; color: #666; font-weight: bold; }



.aboutTitle { font-size: 12px; color: #666; font-weight: bold; }


/*  Footer Section  										 */

/*************************************************************/



#footer { clear: both; padding-top: 60px; }



#footerCopyright { float: left; font-size: 8px; }



#footerLinks { float: right; }



.copyrightText { font-size: 9px; color: #b0b6bb; }



.footerText { font-size: 11px; color: #b0b6bb; }



.footerText a { text-decoration: none; color: #b0b6bb; }



.footerText a:hover { color: #00aeef; }



/*  Link Colors      										 */

/*************************************************************/



#addtocartmsg a { color: #00aeff; text-decoration: underline; }



#addtocartmsg a:hover { color: #666; text-decoration: none; }



#addtocartmsg a:active { color: #666; text-decoration: none; }



.uolink { color: #00aeff; text-decoration: none; }

.uolink a { color: #00aeff; text-decoration: none; }

.uolink a:active { color: #666; text-decoration: underline; }

.uolink a:hover { color: #666; text-decoration: underline; }