/**********************************************************************************************
	Main Sections in CSS:
	
	1.	BASIC ELEMENTS
		Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc.
	
	2.	LAYOUT
		Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site
		
	3.	PAGE COMMON STYLES
		Define content styles that are common to all the pages in the project. For example Logo in header, tabs in navigation, buttons, rounded boxes etc
	
	4.	PAGE SPECIFIC STYLES
		Define content styles that are specific to a particular page
	
***********************************************************************************************/


/* import core styles */
@import url(base.css);


/*------------------------------------------
// 1.BASIC ELEMENTS
//	 Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc.
//------------------------------------------*/

body { color:#000000; font-family:sans-serif, Arial, Helvetica; background:url(../images/body-bg.jpg) 0 0 repeat-x; }
h1{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 120%;
	font-weight: bold;
	top: 0px;
	color: #542989;
}
h2{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 50%;
	color: #000000;
}
h3{}
p{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: normal;
	color: #000000;
}
li{}
a{
	line-height:1.2em;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #542989;
	text-decoration: underline;
}


/*------------------------------------------
// 2.LAYOUT
//   Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site
//------------------------------------------*/
	
/*---- Container ----*/
div#container { background:url(../images/container-bg.jpg) 0 100% repeat-x;}
div.wrapper{ width:854px; margin:0 auto; }

/*---- Header ----*/
div#header{ padding-top:43px;}

/*---- Content ----*/
div#content div.wrapper{ background:url() 0 0 no-repeat; padding-bottom:10px;}

/*---- Main ----*/
div#main { float:right; width:657px; }

/*---- Sidebar ----*/
div#sidebar { float:left; width:147px; background:url(../images/sidebar/sidebar-bg.jpg) 0 0 no-repeat; padding-left:33px; }

/*---- Footer ----*/
div#footer div.wrapper{
	width:476px;
	padding-bottom:40px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 7px;
	float: none;
}


/*------------------------------------------
// 3. PAGE COMMON STYLES
//	  Define content styles that are common to all the pages in the project. For example Logo in header, tabs in navigation, buttons, rounded boxes etc
//------------------------------------------*/

/*---- Header - Logo ----*/
div#header div.logo{ position:relative; margin:50px 0 0 -145px; float:left; }
div#header div.logo h1 a{ background:url(../images/header/logo.png) 0 0 no-repeat; width:382px; height:75px; display:block;}

/*---- Header----*/
div#header div.wrapper{ position:relative;}
div#header div.contact-info{
	position:absolute;
	left:515px;
	top:135px;
	width: 103px;
}
div#header div.contact-info P{color:#542989; font-size:110%;}
div#header div.contact-info P a{color:#542989;}


/*---- Content ----*/

/*---- Main inner-main----*/
div#main div.inner-main{
	width:525px;
	float:left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}
	
div#main div.inner-main p{
	font-size:10pt;
	color:#000000;
	line-height:20px;
	margin-bottom:22px;
	font-family: Arial, Helvetica, sans-serif;
}

div#main div.inner-main-home{
	width:476px;
	float:left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}
div#main div.inner-main-home p{
	font-size:10pt;
	color:#000000;
	line-height:20px;
	margin-bottom:22px;
	font-family: Arial, Helvetica, sans-serif;
}
	
div#main div.inner-main p a { color:#1e1e1e; }
div#main div.inner-main ul{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	list-style-position: inside;
	list-style-image: none;
	list-style-type: disc;
	line-height: 16pt;
}
div#footer  div.logo  a {
	font-size:150%;
	color:#1e1e1e;
	line-height:20px;
	list-style:disc;
	list-style-position:inside;
	margin-left: 16px;
}
div#main div.inner-main ol{ margin-bottom:22px;}
div#main div.inner-main ol li{
	font-size:150%;
	color:#1e1e1e;
	line-height:20px;
	list-style:decimal;
	list-style-position:inside;
}
div#main div.inner-main h1 {
	font-size:12pt;
	font-family: Arial, Helvetica, sans-serif;
	color: #542989;
}
div#main div.inner-main h2 {
	font-size:100%;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	font-weight: normal;
	letter-spacing: normal;
	text-align: left;
	line-height: 110%;
}
div#main div.inner-main h3 { font-size:180%; }
div#main div.inner-main h4 { font-size:160%; }


/*---- Main inner-sidebar----*/
div#main div.inner-sidebar{ width:170px; float:right;}


/*---- Sidebar ----*/

/*---- Sidebar - Navigation ----*/
div#navigation{ margin-bottom:20px;}
div#navigation ul li a{ width:146px; display:block;}

div#navigation ul li#shoes a{ background:url(../images/sidebar/navigation.png) 0 0 no-repeat; height:32px;}
div#navigation ul li#boots a{ background:url(../images/sidebar/navigation.png) 0 -32px no-repeat; height:49px;}
div#navigation ul li#accessories a{ background:url(../images/sidebar/navigation.png) 0 -81px no-repeat; height:49px;}
div#navigation ul li#contact a{ background:url(../images/sidebar/navigation.png) 0 -130px no-repeat; height:50px;}
div#navigation ul li#media a{ background:url(../images/sidebar/navigation.png) 0 -180px no-repeat; height:49px;}
div#navigation ul li#links a{ background:url(../images/sidebar/navigation.png) 0 -229px no-repeat; height:49px;}

/*----Navigation Active/Hover----*/
div#navigation ul li#shoes a:hover, div#navigation ul li#shoes a.active{ background:url(../images/sidebar/navigation.png) 100% 0 no-repeat; }
div#navigation ul li#boots a:hover, div#navigation ul li#boots a.active{ background:url(../images/sidebar/navigation.png) 100% -32px no-repeat; }
div#navigation ul li#accessories a:hover, div#navigation ul li#accessories a.active{ background:url(../images/sidebar/navigation.png) 100% -81px no-repeat;}
div#navigation ul li#contact a:hover, div#navigation ul li#contact a.active{ background:url(../images/sidebar/navigation.png) 100% -130px no-repeat; }
div#navigation ul li#media a:hover, div#navigation ul li#media a.active{ background:url(../images/sidebar/navigation.png) 100% -180px no-repeat; }
div#navigation ul li#links a:hover, div#navigation ul li#links a.active{ background:url(../images/sidebar/navigation.png) 100% -229px no-repeat; }


/*---- testimonial ----*/
div#content div.testimonial blockquote{
	margin-bottom:20px;
	
}
div#content div.testimonial blockquote p{
	font-size:100%;
	color:#666666;
	line-height:15px;
}
div#content div.testimonial blockquote p a{ color:#1e1e1e; }
div#content div.testimonial cite{
	font-size:9pt;
	color:#666666;
	padding-left:5px;
	display:block;
	font-family: Arial, Helvetica, sans-serif;
}


/*---- Footer ----*/
div#footer div.logo{ margin-bottom:20px;}
div#footer div.logo a{
	background:url(../images/footer/footer-logo.png) 0 0 no-repeat;
	width:415px;
	height:81px;
	display:block;
	text-align: center;
}

/*---- Footer-nav----*/
div#footer div.footer-nav ul{
	overflow:hidden;
	font-size: small;
}
div#footer div.footer-nav ul li{
	float:left;
	color:#542989;
	font-size:110%;
	background-position: center;
}
div#footer div.footer-nav ul li a{ color:#542989; padding:0 10px;}
