/*----------------------------------------------------------------------------



Customise Style Sheet







Name: 			JJ Ario Lite



Date: 			13 September 2007



Description: 	A dark Web 2.0 two-column template.



Author: 		JoomlaJunkie



URL: 			http://www.joomlajunkie.com







Stylesheet Index:



	$1 - Structural CSS



	$2 - Live Search CSS







NOTE: Always make a backup of your stylesheets before editing!



NB!! Use the search function to find a section, eg: search for $10 for Modules



----------------------------------------------------------------------------*/



/* $1 - Info



----------------------------------------------------------------------------*/







/*This calls the other css files!! */



@import url(customise.css);



@import url(menu.css);







/***This css file is usually used by Joomla,



however we structure our templates a little



differently for optimized use, we have seperated



out the structural css with the colors etc:



This css file must not be edited unless you want



to change the structure of the template











**For STRUCTURAL CSS, please edit this layout!



(this contains the dimensions and main page



layout, only to be edited if you want to change



the page structure)







**For all graphical elements, typography, colors,



fonts and main joomla styles, edit the customise.css



and or color.css (could be yellow.css if using



multiple themes)



***/







/*TIP



**Use the (editor_css.css) css document to add



styles that will be used in the backend editor when



adding or editing content, this will help you maintain



a consistent look and feel throughout your website



for more information, please email info@joomlajunkie.com



or read the readme file that came with your template*/







/* $1 - Structural CSS



----------------------------------------------------------------------------*/



body {



    margin: 0;



    padding: 0;



	background: #202020 url(../images/body-bg.png);



}







body.contentpane {



	background-image:none;



	background-color:white;



}







#top, #user3, #shadow {



    width:994px;



}







#top {



	height:0px;



}







#top h1, #top h1 a {



	display:block;



	padding:0;margin:0;



	width:0px;



	height:0px;



	text-indent: -7998px;



	cursor:pointer;



}







#top h1 {



/*see color style sheet*/



}







#toolbar {



	text-align:right;



	padding-top:0px;



	padding-right:0px;



}







#shadow {



	background: transparent url(../images/shadow-spacer.png) repeat-y;



}







#user3 {



/*see color style sheet*/



}







#rss {



	position:absolute;



	top: 0px;



	left:895px;



	text-align:right;



    width:100px;



}







#header, #pathway, #btm-mods, #footer {



	width:960px;



}







#header img {



	display:block;



}



.header {



	height:280px;



	width:960px;



	overflow:hidden;



	background: transparent url(../images/header.jpg) top left no-repeat;



}







/*this removes an unwanted break in the



Joomla header rotator and can be removed if



you are not using it*/







#header br {



display: none;



}



#pathway {



    height:35px;



    text-align:left;



    font:normal 12px/130% Arial ;



    background:#222 url(../images/pathway.png) repeat-x;



}



#pathway_inner {



    padding:11px 0 0 15px;



}



div.search {



	float: right;



	margin-top: -19px;



	margin-right: 10px;



}



#mod_search_searchword {



	width:150px;margin:0;



}







#left, #right, #content {



	float:left;



	display:inline;



	margin-top:5px;



	text-align:left;



	overflow:hidden;



}







#left, #right {



	width:194px;



}







#content {



	width:552px;



}



#mainbody {



	margin:10px;overflow:hidden;



	position:relative;



	width:532px;



}







.scheme_2 #content {



	width:751px;



}







.scheme_2 #mainbody {



	width:731px;



}







.scheme_1 #content {



	width:950px;



}







.scheme_1 #mainbody {



width: auto;



}







.first-in-scheme {margin:5px 5px 0 22px;}



.second-in-scheme {margin-right:5px;


}



.third-in-scheme {}







#btm-mods {



	background:#F8F8E1;



	border-top:1px solid #E7D5B0;



	padding-top:10px;



	text-align:left;



}







#footer {



	height:34px;



	border-top:1px solid #E7D5B0;



}







#footer a {



	color:#D7D53;



	text-decoration:none;



}







#footer a:hover {



	text-decoration:underline;



}







#footer a.copyright {



















































	float:left;



	display:inline;



	background: url(../images/template-by.gif) 0 50% no-repeat;



	padding-left:10px;



	margin:9px 0 0 12px;



}







#footer a.w3c-valid {



    float:right;



    display:inline;



    background: url(../images/tick.gif) 0 50% no-repeat;



	padding-left:20px;



	margin:9px 12px 0 0;



}







.clear {



    clear: both;



    display: block;



    height: 0px;



    font-size:1px;



    overflow: hidden;



    margin: 0;



    padding: 0;



}







#advert1, #advert2 {



	height:1%;



	width:100%;



	padding-bottom:5px;



}







div.moduletable.first, div.moduletable.middle,



div.moduletable-ario.first, div.moduletable-ario.middle {



	float:left;



	display:inline;



}



div.moduletable.last,div.moduletable-ario.last {



	float:right;

background: #FF5C6A ;

	display:inline;



}







/* narrow mode */



div.countin3 {width:161px;overflow:hidden;}



div.countin2 {width:253px;overflow:hidden;}



div.countin1 {width:532px;clear:both;overflow:hidden;}



div.middle {margin-left:5px;width:160px}



.scheme_3 div.first.countin2 {width:254px;}







/* No Left or Right */



.scheme_2 div.countin3 {width:227px;}



.scheme_2 div.countin2 {width:353px;}



.scheme_2 div.countin1 {width:731px;clear:both;}



.scheme_2 div.middle {margin-left:5px;}







/* No Left and Right */



.scheme_1 div.countin3 {width:293px;}



.scheme_1 div.countin2 {width:453px;}



.scheme_1 div.countin1 {width:930px;clear:both;}



.scheme_1 div.middle {margin-left:5px;width:294px;}







#btm-mods div.countin3 {width:263px;}



#btm-mods div.countin2 {width:420px;}



#btm-mods div.countin1 {width:890px;}



#btm-mods div.last {margin-left:0;margin-right:20px;}



/* $3 - Display Options



----------------------------------------------------------------------------*/



/* Generic Options Defaults */







.fontsizer,



.fontsizer li,



.fontsizer li a{



	list-style-type:none;



}







.horizontal li,



.horizontal li a{



	display:block;



	float:left;



}







/* Clear Fix */



.clearfix:after {



	content: "."; 



	display: block; 



	height: 0; 



	clear: both; 



	visibility: hidden;



	overflow:hidden;



}







.clearfix {display: inline-table;}



/* Hides From IE Mac \*/



* html .clearfix {height: 1%;}



.clearfix {display: block;}



/* End Hide from IE Mac */







#displayOptions li {	



	height:20px; 



	overflow:hidden;



	display:inline;



	background: none;



	margin: 0;



	padding: 0 5px;



}







#displayOptions a {



	padding-top:20px;



	height:0;



	overflow:hidden;



	background-position: 0 0;



	background-repeat:no-repeat;



	font-size:10px;



}







#displayOptions li a:hover {



	background-color:transparent;



}











/************* OFF STATES *************/



/* Text Sizes for background images see color style sheet*/



#toolbar li a#textMedium {width:11px; outline: 0;}



#toolbar li a#textLarge {width:11px; outline: 0;}



#toolbar li a#textXLarge {width:11px; outline: 0;}







/************* HOVER STATES *************/



#toolbar li a#textMedium:hover,



#toolbar li a#textLarge:hover,



#toolbar li a#textXLarge:hover {



background-position: 0 -22px; }







/************* ACTIVE STATES *************/



#toolbar li a#textMedium.active-option,



#toolbar li a#textLarge.active-option,



#toolbar li a#textXLarge.active-option {



background-position: 0 -22px; }







/************* EXTRA FOR v 1.5 *************/



fieldset { border: none;}