/*
CSS for XINJ.COM
Copyright 2009 Villagewerx LLC. All Rights Reserved.
*/


body {font-size: 86.5%; color: #666; background-color: #1e1e1e; text-align: left;}
#pageContainer {width: 980px; margin: 0 auto; padding: 1em;}
#main_content {float: left; padding: 0 0 0 2em;}
h2 {font-family: Helvetica, Arial, sans-serif; font-size: 1.8em; text-align: left; color: #fefefe;}
h5 {font-family: arial; font-size: 1.2em; color: blue;}

body#gallery img {margin: 4px;}
body#gallery img.thumbs {width: 170px; border: 7px solid #ffffff; disply: inline;}
body#gallery img.medium {width: 400px; border: 10px solid #ffffff;}

.entry {float: left; width: 100%; display: block; clear: both; margin-bottom: 30px;}

body#home {margin: 0; padding: 0; }
body#home #container {width: 100%; margin: 0; padding: 0;}

body#home h2 {font-size: 2.5em; color: #9AB26F; font-weight:200; letter-spacing: .025em; }
body#home h3 {font-size: 1.5em; color: #F5F5EA; font-weight: bold; font-family: helvetica, arial, sans-serif; margin-bottom: 0;}
body#home p	{font-size: 1.4em; color: #546367; }
body#home h2.bigType {font-size: 3.2em; font-weight: 900; color: #546367; border-bottom: 2px solid #546367; padding-bottom: 10px; letter-spacing: normal; }
body#home div#preamble {width: 980px; margin: 0 auto; background-color: #B3AD97; padding: 2em;}
body#home div#content {width: 980px; margin: 0 auto; height: 100%;}
body#home .date {color: #22BFE2; margin-top: 60px; font-family: helvetica; font-size: medium;}
body#home div.entry {width: 99%; margin: 10px 20px 0 20px;}
body#home p.source {color:#B3AD97; font-size: 13px; font-variant: small-caps; letter-spacing: .025em;}

body#home ul li {font-size: 1.2em; margin: 0 0 12px; border-bottom: 1px dotted #546367; padding: 10px 10px 10px 0px;}

body#slider, body#test2 {margin: 0; padding: 0; background-color:#CBCCBA;}
body#slider, body#test2 #container {width: 100%; margin: 0; padding: 0;}
body#slider, body#test2 #main_content {padding: 0;}

body#slider #contentWrap, body#test2 #contentWrap {width: 100%; background-color: #CBCCBA; height: 500px;}
body#slider #content, body#test2 #content {width: 980px; margin: 0 auto; background-color: #CBCCBA; padding-top: 3em;}
body#slider #contentWrap #content #aperture { width: 760px; background: #CBCCBA; margin: 0 auto; position: relative; }
body#slider #contentWrap #content #aperture ul{margin: 0; padding: 0;}
body#slider #preambleWrap, body#test2 #preambleWrap {width: 100%; background-color: #B3AD97; padding-top: 2em}
body#slider #preamble, body#test2 #preamble {width: 980px; padding: 2em; margin: 0 auto; background-color: #B3AD97; }

body#slider h2.bigType,
body#test2 h2.bigType {font-size: 3.2em; font-weight: 900; color: #546367; padding-bottom: 10px; border-bottom: 4px solid #546367; letter-spacing: normal; }
body#slider h2,
body#test2 h2 {font-size: 2.5em; color: #9AB26F; font-weight:200; letter-spacing: .025em;}

body#slider p {font-size: 1.4em; color: #546367;}
body#test2 p {font-size: 1.4em; color: #546367;}
body#slider #preamble h3,
body#test2 #preamble h3 {font-size: 1.5em; color: #F5F5EA; font-weight: bold; font-family: helvetica, arial, sans-serif; margin-bottom: 0;}

body#slider #aperture h2.bigType {}

body#slider a, a img { border: 0; text-decoration: none; outline: 0; }
body#slider .date, body#test .title, body#test .source {}
body#slider .date {color: #22BFE2; font-family: helvetica; font-size: medium;}
body#test2 .source {width: 200px;}

body#slider #aperture p {}
body#slider ul {-moz-padding-start: 0; height: 300px; display: inline;}
body#slider #aperture .entry {padding: 2em;}

body#test2 #secondTool {margin-top: 50px;}


/* Test3 Styles */

body#test3 {margin: 0; padding: 0; background-image: url(/images/layouts/fuzzyGray.jpg);}
body#test3 #pageContainer {width: 100%; margin: 0; padding: 0;}
body#test3 #bannerWrap {width: 100%; margin: 0; padding: 0; height: 250px; background-image: url(/images/layouts/flaps5.png); background-position: top center; background-repeat: repeat-x;}
body#test3 #contentWrap {width: 980px; margin: 0 auto;}
body#test3 #content {min-height: 600px; padding: 1em;}
body#test3 #footerWrap {width: 100%; margin: 0; padding: 0; background-color: #1e1e1e; height: 300px;}
body#test3 #footer {height: 100px; width: 980px; margin: 0 auto;}
body#test3 #footer p {text-align: center; color: #fff; padding: 2em; font-size: 1.5em;}
body#test3 h1 {font-size: 2.8em; color: #000; font-family: helvetica; display:none;}
body#test3 p {font-family: georgia; font-size: 16px; line-height: 150%; color: #333; display:none;}

/* tab pane styling */
body#test2 #firstTool div.panes div h2,
body#test2 #firstTool div.panes p {padding: 0 30px;}
#firstTool div.panes div {display:none; padding:15px 10px; border:1px solid #999; border-top:0; min-height: 220px; font-size:14px; background-color:#fff;}

/* jQUERY TOOLS */

/* root element for tabs  */
#firstTool ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:1px solid #666;	
	height:30px;
}

/* single tab */
#firstTool ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
#firstTool ul.tabs a { 
	background: url(/images/layouts/blue.png) no-repeat -420px 0;
	font-size:14px;
	font-family: "trebuchet ms";
	display:block;
	height: 30px;  
	line-height:30px;
	width: 134px;
	text-align:center;	
	text-decoration:none;
	color:#333;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
	outline: none;
}

#firstTool ul.tabs a:active {outline: none !important;	}


/* when mouse enters the tab move the background image */
#firstTool ul.tabs a:hover {
	background-position: -420px -31px;	
	color:#fff;	
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
#firstTool ul.tabs a.current, #firstTool ul.tabs a.current:hover, #firstTool ul.tabs li.current a {
	background-position: -420px -62px;		
	cursor:default !important; 
	color:#000 !important;
	font-size: 14px;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
#firstTool ul.tabs a.s 			{ background-position: -553px 0; width:81px; }
#firstTool ul.tabs a.s:hover 	{ background-position: -553px -31px; }
#firstTool ul.tabs a.s.current  { background-position: -553px -62px; }

/* width 2 */
#firstTool ul.tabs a.l 			{ background-position: -248px -0px; width:174px; }
#firstTool ul.tabs a.l:hover 	{ background-position: -248px -31px; }
#firstTool ul.tabs a.l.current  { background-position: -248px -62px; }


/* width 3 */
#firstTool ul.tabs a.xl 			{ background-position: 0 -0px; width:248px; }
#firstTool ul.tabs a.xl:hover 	{ background-position: 0 -31px; }
#firstTool ul.tabs a.xl.current { background-position: 0 -62px; }


/* initially all panes are hidden */ 
#firstTool div.panes div.pane {
	display:none;		
}


/* CSS TABS EXAMPLE */

#secondTool {margin-bottom: 50px;}
/* root element for tabs  */
ul.css-tabs {  
	margin:0 !important; 
	padding:0;
	height:30px;
	border-bottom:1px solid #666;	 	
}

/* single tab */
ul.css-tabs li {  
	float:left;	 
	padding:0; 
	margin:0;  
	list-style-type:none;	
}

/* link inside the tab. uses a background image */
ul.css-tabs a { 
	float:left;
	font-size:13px;
	font-family: myriad, "myriad pro";
	font-weight: bold;
	display:block;
	padding:5px 30px;	
	text-decoration:none;
	border:1px solid #666;	
	border-bottom:0px;
	height:18px;
	background-color:#efefef;
	color: #675D14;
	margin-right:2px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright:4px;
	position:relative;
	top:1px;
	outline: none;	
}

ul.css-tabs a:hover {
	background-color:#F7F7F7;
	color:#333;
}
	
/* selected tab */
ul.css-tabs a.current {
	background-color:#ddd;
	border-bottom:2px solid #ddd;	
	color:#52360E;	
	cursor:default;
}

	
/* tab pane */
div.css-panes div {
	display:none;
	border:1px solid #666;
	border-width:0 1px 1px 1px;
	min-height:150px;
	padding:15px 20px;
	background-color:#ddd;	
}






