/**********************************************************************************************
	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 { background:#530700; color:#fff; font-family:Georgia, "Times New Roman", Times, serif; min-width:972px;}
h1, h2, h3, h4, h5, h6, p, li { line-height:1.0em; }

/*------------------------------------------
// 2.LAYOUT
//   Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site
//------------------------------------------*/
	
/*---- Wrapper ----*/
div.wrapper{ width:972px; margin:0 auto; }

/*---- header ----*/
div#header{ background:#000 url(../images/header/header-bg.jpg) no-repeat center top ; }

/*---- Navigation ----*/
div#navigation{ float:right; margin-top:70px; width:516px; }

/*---- Banner ----*/
div#banner { padding-top:27px; height:242px; background:#000 url(../images/content/content-bg.jpg) no-repeat center top; padding-bottom:80px; }
div#banner div.wrapper{ position:relative; }

/*---- Content ----*/
div#content { background:#000; }
div#content div.outer-wrapper{ background:url(../images/content/content-wrapper-bg.jpg) no-repeat center bottom; }
div#content div.wrapper{ position:relative; }

/*---- Footer ----*/
div#footer{ background:url(../images/footer/footer-bg.gif) repeat-x top left; padding:22px 0 75px 6px; }

/*------------------------------------------
// 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{ width:244px; float:left; }
div#header div.logo img { vertical-align:top; }

/*---- Navigation ----*/
div#navigation ul li { float:left; margin-right:3px; }
div#navigation ul li a { font-size:170%; float:left; height:47px; line-height:47px; padding-left:13px; display:block; }
div#navigation ul li a span{ color:#cf1000; padding-right:13px; display:block; height:47px; line-height:47px; float:left; }
div#navigation ul li a.active, div#navigation ul li a:hover{ background:url(../images/navigation/navigation-hover.gif) no-repeat left top ; text-decoration:none; }
div#navigation ul li a:hover span, div#navigation ul li a.active span { background:url(../images/navigation/navigation-hover.gif)  no-repeat right bottom; color:#fff; }

/*---- Content ----*/
div#content h1{ font-size:360%; color:#bdbb7c; font-weight:normal; line-height:36px; margin-bottom:14px; }

/*---- Banner ----*/
div#banner h1 { font-size:360%; color:#bdbb7c; font-weight:normal; line-height:36px; margin-bottom:14px; }

/*---- Content - Post - Tags ----*/
div.post{ padding-bottom:10px; }
div.post h1 { font-size:280%; margin-bottom:10px; color:#b60f00; }
div.post h2 { font-size:220%; color:#b60f00; font-weight:normal; line-height:26px; margin-bottom:24px; }
div.post h3 { font-size:240%; margin-bottom:10px; color:#b60f00; font-weight:normal; }
div.post h4 { font-size:220%; margin-bottom:10px; color:#b60f00; font-weight:normal; }
div.post h5 { font-size:200%; margin-bottom:10px; color:#b60f00; font-weight:normal; }
div.post h5 { font-size:180%; margin-bottom:10px; color:#b60f00; font-weight:normal; } 

div.post p { font-family:Arial, Helvetica, sans-serif; font-size:140%; color:#a2a277; line-height:24px; margin-bottom:25px; }
div.post p:after { content: "."; display: block; font-size:0; height: 0; clear: both; visibility: hidden; }
div.post p a { font-size:100%; }

div.post a{ font-family:Arial, Helvetica, sans-serif; font-size:140%; color:#e92200; line-height:14px; }

div.post blockquote { margin-bottom:20px; }
div.post blockquote p{ margin-bottom:5px; font-style:italic; }
div.post blockquote p cite{ font-weight:bold; text-align:right; display:block; }

div.post p img { max-width:100%; }
div.post p img.alignleft{ float:left; margin:0 10px 10px 0; display: inline; }
div.post p img.alignright{ float:right; margin:0 0px 10px 10px; display: inline; }
div.post p img.aligncenter{ display:block; margin-left:auto; margin-right:auto; margin-bottom:10px; }

div.post ul { margin:0 0 20px 14px; list-style:disc; }
div.post ol { margin:0 0 20px 18px; list-style:decimal; }
div.post li { line-height:1.2em; font-size:120%; color:#a2a277;}
div.post li ul, div.post li ol { margin-bottom:0px; } 
div.post li li, div.post li p { font-size:100%; margin-bottom:0px; }

/*---- Post - Custom Lists ---*/
div.post ul.list1 { margin:0; padding:0; }
div.post ul.list1 li { margin:0; padding:0; }

div.post ol.list2 { margin:0; padding:0; }
div.post ol.list2 li { margin:0; padding:0; }

/*---- List-1 ----*/
ul.list1{ margin-left:38px; width:750px; float:left; }
ul.list1 li{ font-size:150%; line-height:26px; float:left; display:block; width:250px; }
ul.list1 li a{ color:#fff; }

/*---- Footer - Tags ----*/
div#footer p.copyright{ font-size:130%; color:#fff; float:left; line-height:16px; margin-bottom:16px; }
div#footer a.designer{ font-size:130%; color:#a90e00; float:right; line-height:16px; margin-right:56px; }

/*---- Footer - Footer-Nav ----*/
div.footer-nav{ clear:both; }
div.footer-nav ul li{ display:inline; font-size:140%; margin-right:24px; }
div.footer-nav ul li a{ color:#b4ad65; }

/*------------------------------------------
// 4.1  INDEX PAGE SPECIFIC STYLES
//------------------------------------------*/

body.home div#content div.wrapper { margin-top:-187px; position:relative; }
body.home div#banner { height:278px; }

/*---- Content - Introduction ----*/
div#content div.introduction{ width:380px; float:left; padding-top:0; }
div#content div.introduction h2{ font-size:230%; color:#e7e6cf; font-weight:normal; line-height:26px; margin-bottom:30px; }
div#content div.introduction blockquote p{ font-size:160%; color:#bdbb7c; line-height:29px; }
div#content div.introduction blockquote p cite{ font-size:100%; font-weight:bold; color:#fff; }

/*---- Content - Slideshow ----*/
div#slideshow{ background:url(../images/content/slideshow/slide-show-bg.png) left top no-repeat; width:506px; float:right; height:372px; padding:12px 10px 0 42px; margin-top:-117px; position:relative; }
div#slideshow img{ border:1px solid #7f0e05; }
div#slideshow div.slides img { width:406px; height:333px;  }

/*---- Slideshow - Thumbnils ----*/
div#slideshow div.thumbnils{ float:left; width:87px; }
div#slideshow div.thumbnils ul li{ margin-bottom:14px; } 

/*---- Slideshow - Slides ----*/
div#slideshow div.slides{ float:right; width:408px; position:relative; }

/*---- Slideshow - Controls ----*/
div#slideshow div.controls { position:absolute; right:27px; bottom:76px; z-index:5;  }
div#slideshow div.controls img{ border:none; }

/*---- content - Divider ----*/
div#content div.divider{ margin-bottom:35px; clear:both; }

/*---- content - Highlights ----*/
div#highlights{ margin-bottom:75px; }
div#highlights h2{ font-size:200%; float:left; line-height:22px; }

/*------------------------------------------
// 4.2  CONTACT PAGE SPECIFIC STYLES
//------------------------------------------*/

body.contact div#content { margin-top:-200px; }

/*---- Content - Contact ----*/
div#contact{ margin:140px 0 100px 0;}
div#contact p{ font-size:190%; color:#a28d5d; line-height:20px; margin-bottom:22px; }
div#contact h2{ font-size:220%; color:#b60f00; font-weight:normal; line-height:22px; margin-bottom:30px; }
div#contact h2 a{ color:#b60f00; font-size:100%; }

/*---- Content - Pictures ----*/
div#banner div#pictures img.image1{ position:absolute; z-index:2; left:299px; top:-6px; }
div#banner div#pictures img.image2{ position:absolute; z-index:1; right:30px; top:16px; }

/*------------------------------------------
// 4.3  WHAT PAGE SPECIFIC STYLES
//------------------------------------------*/

/*---- Content - Pictures ----*/
div#banner div#pictures img.image3{ position:absolute; z-index:2; left:189px; top:-19px; }
div#banner div#pictures img.image4{ position:absolute; z-index:1; right:36px; top:66px; }

/*------------------------------------------
// 4.4  WHEN PAGE SPECIFIC STYLES
//------------------------------------------*/

/*---- Content - Pictures ----*/
div#banner div#pictures img.image5{ position:absolute; z-index:2; left:108px; top:3px; }
div#banner div#pictures img.image6{ position:absolute; z-index:1; right:30px; top:16px; }

/*------------------------------------------
// 4.5  WHERE PAGE SPECIFIC STYLES
//------------------------------------------*/

/*---- Content - Pictures ----*/
div#banner div#pictures img.image7{ position:absolute; z-index:2; left:12px; top:60px; }
div#banner div#pictures img.image8{ position:absolute; z-index:1; left:250px; top:59px; }
div#banner div#pictures img.image9{ position:absolute; z-index:4; right:158px; top:30px; }
div#banner div#pictures img.image10{ position:absolute; z-index:3; right:15px; top:201px; }

/*------------------------------------------
// 4.6  WHY PAGE SPECIFIC STYLES
//------------------------------------------*/

/*---- Content - Pictures ----*/
div#banner div#pictures img.image11{ position:absolute; z-index:1; left:142px; top:21px; }
div#banner div#pictures img.image12{ position:absolute; z-index:2; right:154px; top:5px; }
div#banner div#pictures img.image13{ position:absolute; z-index:3; right:16px; top:201px; }