/* CSS Document */
/*----------------------------------------------------------------------------------------------------------*/
body {
	margin: 0;
	font-family: Verdana;
	font-size: 8pt;
	color: #666666;
	text-align: justify;
}
/*----------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------*/
ul
{
margin: 0;
padding: 15px;
list-style: disc inside;
}

li
{
line-height: 15px;
padding: 0px;
text-align: justify;
list-style: inside;
}
/*----------------------------------------------------------------------------------------------------------*/
/*
A - .sitename
Below is an example of the css code for the styling of the website name when called in a template.
*/
.site_name {
  padding-top: 5px;
  padding-left: 5px;
}
/*----------------------------------------------------------------------------------------------------------*/
/*B - .pathway
Below is an example of the css code for the styling of the pathway. Some people use the default link class for 
this, but I believe that it is better to have your own class in case the pathway is called somewhere within your 
template that has a conflicting color. Also notice that the pathway class has four different styles. Default, link, 
visited, and hover. The link and visited are combined here but can be seperated for better control.
*/
.pathway {
  color: #d7d7d7;
  text-decoration: none;
  font-size: 8pt;
  font-weight: bold;
}
 
a.pathway, a.pathway:visited {
  color: #fff;
  text-decoration: none;
  font-size: 8pt;
}
 
a.pathway:hover {
  color: #8bc650;
  font-size: 8pt;
  text-decoration: none;
}
/*----------------------------------------------------------------------------------------------------------*/
/*C - table.moduletable
Below is an example of the default css code for all modules. Notice the tree different styles that are 
assigned to the modules.
First is the overall table that holds the modules. Second is the module header or where the module name appears (th).
Second is where the module information is displayed (td). 
In the case of the image it is the main menu links or the next section which is D.
*/
table.moduletable {
  width: 100%;
  margin: 0px 0px 0px 0px;
}
 
table.moduletable th {
  vertical-align: middle;
  font-size: 10pt;
  font-weight: bold;
  color: #8bc650;
  text-align: center;
  text-indent: 0px;
  width: 100%;
  height: 24px;
  background-color: #E6F2D7;
  
}
 
table.moduletable td {
  font-size: 10pt;
  background: none;
  height: 20px;
  width: 200px;
  padding: 0px;
  font-weight: normal;
  font-family: Tahoma;

}

/*----------------------------------------------------------------------------------------------------------*/
/*D - a.mainlevel
Below is an example of the css code for the main leve menu links. Notice the three different styles.
Link and visited which are combined here, but can be seperated for more control and then hover.
*/
a.mainlevel:link, a.mainlevel:visited {
  display: block;
  background-image: url(../images/menu.jpg);
  background-repeat: no-repeat;
  vertical-align: middle;
  font-size: 8pt;
  font-weight: bold;
  color: #000;
  text-align: center;
  font-family: Verdana;
  text-decoration: none;
  width: 100%;
  height: 20px;
  margin-right: 0px;
  margin-left: 0px;
  margin-top: 0px;
  padding-right: 15px;
  }

a.mainlevel:hover {
	background-position: 0px -20px;
	text-decoration: none;
	color: #ff0000;
}
/*----------------------------------------------------------------------------------------------------------*/
/*
E - .inputbox
Below is an example of the css code for the input box. This applies to all input boxes such as the login and search boxes.
*/
.inputbox {
  font-family: Verdana;
  font-size: 8pt;
  color: #8bc650;
  border: 1px solid;
  padding-left: 2px;
  padding-right: 2px;
  padding-top: 2px;
  background-image: url(../images/inputbox.jpg);
  background-repeat: repeat-x;
}

#mod_search_searchword {
	font-size:16px;
	font-weight:bold;
	font-family: verdana,tahoma;
	height:30px;
	background:url(../images/bgsearchbox.gif) no-repeat;
	color:#CCCCCC;
	width:350px;
	border:none;
	padding:5px 0 10px 40px;
}

/*----------------------------------------------------------------------------------------------------------*/
/*
F - .button
Below is an example of the css code for the buttons. This applies to all buttons that appear on your website.
*/
.button {
  color: White;
  font-family: Verdana;
  margin-top: 4px;
  font-weight: bold;
  text-align: center;
  font-size: 8pt;
  border: 1px solid #8bc650;
  height: 20px; 
  cursor: pointer;
  background-image: url(../images/button.jpg);
  padding-top: 2px;

}
/*----------------------------------------------------------------------------------------------------------*/
/*G - a:link
Below is an example of the css code for the default link class of the template. Every template has this 
default class in case there is a link that does not have a specific class defined to it. Notice there are 
three different styles. Link and visited are combined but can be seperated for more control and hover.*/
a:link, a:visited {
  font-size: 7pt;
  color: #8bc650;
  text-decoration: underline;
  font-family: Verdana;
  font-weight: bold;
}
 
a:hover {
  color: #0186cf;
  text-decoration: none;
}
/*----------------------------------------------------------------------------------------------------------*/
/*H - .componentheading
Below is an example of the css code for the title of the component that is being used to display content. 
This applies to to all components unless the component has a it specified in it's own style sheet.*/
.componentheading {
  font-family: Verdana;
  font-size: 12pt;
  font-weight: bold; 
  color: #8bc650;
}
/*----------------------------------------------------------------------------------------------------------*/
/*I - .contentheading
Below is an example of the css code for the title of the content being displayed. 
This is the name or title given to the article/content that you create such as 'Welcome to Joomla'.*/
.contentheading {
  font-family: Verdana;
  font-size: 10pt;
  font-weight: bold;
  color: #8bc650;
  line-height: 16px;
  height: 15px;
}
/*----------------------------------------------------------------------------------------------------------*/
/*J - .small
Below is an example of the css code for the small styling class. This is used for misc. 
information such as it is used in this template.*/
.small {
  font-family: Verdana, Tahoma;
  font-size: 7pt;
  color: #8bc650;
  text-decoration: none;
  font-weight: normal;
}
/*----------------------------------------------------------------------------------------------------------*/
/*K - .createdate
Below is an example of the css code for the date that content is created.*/
.createdate {
  font-family:Verdana, Tahoma;
  font-size: 7pt;
  color: #8bc650;
  text-decoration: none;
  font-weight: normal;
}
/*----------------------------------------------------------------------------------------------------------*/
/*L - td,tr,p,div
Below is an example of the css code for the default text for a template. This covers all text that does not have 
a style already assigned to it.*/
td,tr,p,div {
  font-family: Verdana, Tahoma;
  font-size: 8pt;
  color: #505050;
}
/*----------------------------------------------------------------------------------------------------------*/
/*M - .modifydate
Below is an example of the css code that displays the date content was last modified.*/
.modifydate {
  font-family: Verdana, Tahoma;
  font-size: 8pt;
  color: #8bc650;
  text-decoration: none;
  font-weight: normal;
}
/*----------------------------------------------------------------------------------------------------------*/
/*N - a:readon
Below is an example of the css code that displays the Read More... link to the rest of the content. 
Notice the three different styles. Link and visited which are combined and can be seperated for more 
control and hover.*/
a.readon:link, a.readon:visited {
  color: #8bc650;
  text-decoration: none;
  font-family: Verdana, Tahoma;
  font-size: 8pt;
}
 
a.readon:hover {
  color: Gray;
  font-family: Verdana, Tahoma;
  font-size: 8pt;
}
/*----------------------------------------------------------------------------------------------------------*/
/*O - .backbutton
Below is an example of the css code for the Back button. Some use the default link style for this, 
but I prefer to use it's own class for better control and a more pleasing visual style.*/
.backbutton {
  color: White;
  font-family: Verdana, Tahoma;
  margin-top: 4px;
  font-weight: bold;
  text-align: center;
  font-size: 8pt;
  border: 1px solid #8bc650;
  height: 20px; 
  cursor: pointer;
  background-image: url(../images/button.jpg);
  padding-top: 2px;
}
/*----------------------------------------------------------------------------------------------------------*/
/*P - .polls
Below is an example of the css code for the polls module. This includes the styles for the text and the table itself.*/
.poll {
  font-family: Verdana, Tahoma;
  font-size: 7pt;
  font-weight: bold;
  color: #8bc650;
}
 /*
.pollstableborder {
  border: 1px solid #8bc650;
}*/
/*----------------------------------------------------------------------------------------------------------*/
/*Q - .sectiontableentry2
Below is an example of the css code that differentiates between the different rows in tables for polls, forums, etc.*/
.sectiontableentry2 {
  background-color: #F2F9FB;
    font-size: 7pt;
}
/*----------------------------------------------------------------------------------------------------------*/
/*R - .sectiontableentry1
Below is an example of the css code for the alternate row color of the tables for polls, forums, etc.*/
.sectiontableentry1 {
  background-color: #DEEFF8;
    font-size: 7pt;
}
/*----------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------*/
/* ÇáãÓÇÝÇÊ Èíä ÇáÃÚãÏÉ æÇáÚäÇæíä */
/*----------------------------------------------------------------------------------------------------------*/
table.contentpaneopen {
  width: 100%;
	padding: 0px;
	border-collapse: collapse;
	border-spacing: 0px;
	margin: 2px 2px 2px 2px;
}

table.contentpaneopen td {
  padding: 0px 8px 0px 8px;
}

table.contentpaneopen td.componentheading {
	padding-left: 4px;
}



table.contentpane {
  width: 100%;
	padding: 0px;
	border-collapse: collapse;
	border-spacing: 0px;
	margin: 0px;
}

table.contentpane td {
	margin: 0px;
	padding: 0px;
}

table.contentpane td.componentheading {
	padding-left: 4px;
}

table.contentpaneopen fieldset {
	border: 0px;
	border-bottom: 1px solid #eee;
}
H1 {
  font-family: Verdana;
  font-size: 12pt;
  font-weight: bold;
  color: #8bc650;
  line-height: 16px;
  height: 15px;
  }
  
H2 {
  font-family: Verdana;
  font-size: 11pt;
  font-weight: bold;
  color: #8bc650;
  line-height: 16px;
  height: 15px;
}
H3 {
  font-family: Verdana;
  font-size: 10pt;
  font-weight: bold;
  color: #8bc650;
  line-height: 16px;
  height: 15px;
}
/*----------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------*/