/*---------------------------------------------------------------- 
  Copyright:
  Copyright (C) 2008 - 2011 IceTheme. All Rights Reserved
  
  License:
  Copyrighted Commercial Software 
  
  Author:
  IceTheme - http://wwww.icetheme.com
  
---------------------------------------------------------------- */


/* ---------------------- general.css --------------------------
This CSS file contain almost all the styles for the template
decoration and the layout position. You are free to change the 
styles here to suit to your projet needs.

Also remember you dont need to worry about the size of this file
when you see all this comments. Tthe IceSpeed plugin that we
provide inside the template package will strip all of this
comments plus it will comprees all the CSS.
---------------------------------------------------------------- */


/* 
Accessibility Feature
----------------------
Used in case if the user hase disabled the stylesheets and wants
to skip to the main parts of the website
---------------------------------------------------------------- */
#accessibility {
	display:none;}
	
	
/* 
Site Main Wrapping
------------------
We use the 960px width which is the easiest way to separate the 
content because of its ability to be splited in many ways. 
Please be careful when you decide to change the value because 
some of the images used for decoration are meant to be used with
this width so you need to change them to.
---------------------------------------------------------------- */
.wrapper  { width:960px; margin:0 auto; min-height: 40px;}
	
	
/* 
General Styles
--------------
Below you will find some genaral classes that we use to position 
our layout. We suggest you to not change them as it may break the 
layout in several places, anyway if you do so please be careful 
to note where the changes are done.
---------------------------------------------------------------- */
.floatleft { float:left; }
.floatright { float:right;}

.width20  { width: 17.9%; } 
.width25  { width: 23%;}
.width33  { width: 31.5%;}
.width50  { width: 48.6%;} 
.width75  { width: 74.5%;} 
.width100 { width: 99.99%;} 
	
		
	#showcase .width25,	#footer .width25  { width: 23%;}
	#showcase .width33, #footer .width33  { width: 31.1%;}
	#showcase .width50, #footer .width50  { width: 48.3%;}


/* Layout
--------------
The layout section contains all the CSS codes that we used to built
this template structure like header, content, bottom etc. Normally
this section contains the CSS codes that are need to handle the 
structure but you may find some other CSS codes that are not 
directly related to the structure like the codes for the the logo,
search, copyright etc 
---------------------------------------------------------------- */


/* TopBar
------------*/	
#topbar {
	position:relative;
	overflow:hidden;
	margin:-100px 0 100px}
	
	

/* Header
------------*/	
#header {
	background: url(../images/header.png) no-repeat center top;
	height:267px;
	margin-bottom:0;
	position:relative;}
	
	#header .wrapper {
		position:relative;}
	

#bg_effect {
	background: url(../images/bg_effect.png) repeat-x center top;}
	


/* Logo
------------*/
#logo {
	margin:0;
	padding-top:22px;
	text-align:center}
	
	#logo img {
		float:none;
		margin:0; }





/* -- Content --
Contain the CSS for the main and important part of the template
------------*/
#content {
	background:url(../images/content.jpg) repeat center top;
	margin:0 auto 25px; 
	padding:9px;}
	
	#content-inside {
		background:url(../images/content_inside.jpg) repeat center;
		margin:0;
		padding:14px;
		border:1px solid #2E2E2E;}


	
			

/* Main Column Separator 
 This code separate the "left" and "right" module position from the content. */	
#columns-container {
	position:relative;
	margin:0;
	border-bottom:none;
	min-height:300px}

	#outer-column-container {
		border-style:solid;
		border-color:transparent;}
		
		#inner-column-container{
			width: 100%;}
									   
			#source-order-container{
				float: left;
				width: 100%;}


					#middle-column{
						float: right;
						width: 100%;}			   
						
					#left-column{
						margin-top:-10px;
						float: left;}
						
					#right-column{
						margin-top:-10px;
						float: left;}
						
						.clear-columns { clear: both;}
						
						.inside { margin:0; padding:0; }
						
						
						#middle-column .inside {
							padding:0 0 15px;}
								
								#inner-column-container {}
		
	
	

/* Showcase
used to wrap the showcase module positions, also breadcrumbs
------------*/		
#showcase {
	margin:0 10px 20px;
	clear:both;}
	
	
	
/* Promo
contain the CSS for the promo module positions
------------*/		
#promo {
	margin-bottom:10px;}
	
	

/* -- IceTabs --
 contain the CSS to wrap the IceTabs module.
------------*/	
#icetabs {
	margin:-100px 0 60px 0;
	padding:0;}
	


/* IceCaption
 contain the CSS to wrap the IceCaption module.
-------------*/
#icecaption {
	position:relative;
	margin:0;
	padding:10px 0 0;
	margin-bottom:0;}

	#icecaption .ice-module h3.mod-title {
		margin:-40px 0 5px;
		color:#fff;
		position:relative;
		color:rgba(255,255,255,.25);
		text-align:center;
		font-size:2.25em;
		-webkit-transition:all .5s ease-out;
		-moz-transition:all .5s ease-out;
		-o-transition:all .5s ease-out;
		transition:all .5s ease-out;
			text-shadow:1px 1px 1px #000}
			#icecaption:hover .ice-module h3.mod-title {
			color:#fff}
		
		
				
/* -- Bottom -- 
used to wrap the bottom module position.
------------*/
#bottom {
	padding:15px 25px 0 15px;}	
	
	
	
/* -- Footer --
this wrap the footer module position plus the copyright and 
other elements that you may find on the footer
------------*/
#footer {
	clear:both;
	margin:0;}
	
	#footer a {
		color:#D6AB2B}
	
	#footer img {
		float:left;
		margin:0 10px 10px 0}
		


/*  -- Copyright -- 
this contains the codes for the footer module position and 
icetheme copyright logo or also the "go to top" link 
---------------*/
#copyright {
	background:url(../images/copyright.png) no-repeat center top;
	clear:both;
	height:59px;
	margin:0;
	color:rgba(255,255,255,.2);
	padding:130px 0 0;}
	
	#copyright .wrapper {
		position:relative; 
		overflow:hidden}

	
	div#copytext { float:left; padding-top:15px;}
	
		div#copytext .footer2 { display:none; }
	
		

	div#icelogo { float:left; padding:14px 20px 0 0;}
		div#icelogo p { margin:0;}
			div#icelogo p a {
				display:block;
				float:left;
				background:url(../images/icetheme.png) no-repeat;
				width:120px;
				height:20px;
				margin:0 auto;
				opacity:.4;
				-webkit-transition:all .5s ease-out;
				-moz-transition:all .5s ease-out;
				-o-transition:all .5s ease-out; 
				transition:all .5s ease-out;}
				div#icelogo p a:hover {
					opacity:1;}
					div#icelogo p a span { display:none}



	/* Go to Top */
	a#go2top {
		background: url(../images/go2top.png) no-repeat;
		top: 20px;
		height: 16px;
		width: 16px;
		position: absolute;
		right: 0;
		opacity:.4;
		-webkit-transition:all .5s ease-out;
		-moz-transition:all .5s ease-out;
		-o-transition:all .5s ease-out; 
		transition:all .5s ease-out;}
		a#go2top:hover {
			opacity:1;}
			
		a#go2top span {
			display:none}


		


/* Joomla Content
------------------
Below you will find all the CSS codes that are needed to render
the layout for Joomla Section, Category, Article and other 
elements related to those parts like the pagination, readmore etc
---------------------------------------------------------------- */

/* The content description is used on the begging of each section
or catgory to display the page title and the page description */
.contentdescription {
	margin-bottom:2.75em}


/* Blog Structure (Leadings, Rows, Columns etc) */		
.cols-2,
.cols-3,
.cols-4 {
	clear:both;
	margin:0 -1.5% }
	
		
	.cols-2 .column-1,
	.cols-2 .column-2 {
		width:47%;
		position:relative;
		margin:0 1.5%;
		float:left }	
	
	.cols-3 .column-1,
	.cols-3 .column-2,
	.cols-3 .column-3 {
		position:relative;
		width:30.33%;
		margin:0 1.5%;
		float:left }	
		
	.cols-4 .column-1,
	.cols-4 .column-2,
	.cols-4 .column-3,
	.cols-4 .column-4 {
		position:relative;
		width:22%;
		margin:0 1.5%;
		float:left }	


	
			
/* page heading that you may enable through the menu item */	
h1.page_heading {
	color:#fff;
	border-bottom:1px dotted #333;
	padding-bottom:4px;
	margin-bottom:15px;
	text-shadow:-1px -1px 0 #000;
	color:#3B3B3B;}
			
			
/* Category and Featured Blog */
.blog-featured,
.blog { }

	.blog-featured .items-leading,
	.blog .items-leading {
		margin-top:0; }
	
		.blog-featured .items-leading .leading,
		.blog .items-leading .leading {
			position:relative;
			border-bottom:1px dotted #333;
			padding-top:36px;
			padding-bottom:.5em;
			margin-bottom:1.5em }
			
			.blog-featured .items-leading .leading:last-child,
			.blog .items-leading .leading:last-child {
				border-bottom:none;
				margin-bottom:0}
	
		.blog-featured .items-leading h2,
		.blog .items-leading h2 {
			font-size:2.25em;
			margin-bottom:10px;
			position:relative;}
			
			.blog-featured .cols-2 h2,
			.blog .cols-2 h2 {
				font-size:1.7em;}
				
				.blog-featured .cols-3 h2,
				.blog .cols-3 h2 {
					font-size:1.35em;}
			
			
			
		.blog-featured img, 
		.blog img{
			float:left;
			padding:5px;
			background:rgba(255,255,255,.05);
			border:1px solid rgba(255,255,255,.08); 
			margin:7px 15px 12px 0;} 
			
			

/* Category List */
.category-list { }

	.category-list .display-limit {
		float:right;
		margin-bottom:12px;}
	

	.category-list .cat-items {
		margin-bottom:30px} 
		
	.category-list .cat-children {
		overflow:hidden}
		
		.category-list .cat-children h3 {
			margin-bottom:8px;
			padding-bottom:3px;
			border-bottom:1px dotted rgba(255,255,255,.3);}
			
			.category-list .cat-children ul {
			list-style-type:none;
			padding:0;
			margin:0;}
			
			.category-list .cat-children ul li span.item-title {
				font-size:1.4em;
				display:block;
				margin-bottom:3px;}
			
			.category-list .cat-children .category-desc img {
				float:left;
				padding:5px;
				background:rgba(255,255,255,.05);
				border:1px solid rgba(255,255,255,.08); 
				margin:7px 15px 15px 0;} 



/* This is used by Joomla Core to output a table format */
table.category { 
	clear:both;
	width: 100%;
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 0;
	text-shadow: 0 1px 0 #000;
	background: #111;
	border:1px solid #444;
	border-left-color:#333;
	border-right-color:#333;
	border-bottom:none;
	box-shadow:0px 0px 10px rgba(0,0,0,.7)}
	
	table.category td {
	  padding: 5px 10px;
	  border-bottom: 1px solid #000;
	  -moz-box-shadow: 0 1px 0 #333;
	  -webkit-box-shadow: 0 1px 0 #333;
	   box-shadow: 0 1px 0 #333;
	  white-space: nowrap;}

	  table.category  tr {
		-webkit-transition:all .5s ease;
		-moz-transition:all .5s ease;
		-o-transition:all .5s ease;
		transition:all .5s ease;}
		
		table.category tr.cat-list-row1 {
			background:#1A1A1A}

		 table.category tr:hover {
			  background:#222}
	
	table.category thead th {
		font-size:1.5em;
		text-align:left;
		padding:7px 10px;
		font-weight:normal;
		color:#fff;
		text-shadow:1px 1px 1px #000;
		background:#333;
		background: -moz-linear-gradient(100% 100% 90deg, #333, #444);
  		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#444), to(#333));}
		table.category thead th a {
			color:#fff!important}


		
		
			
/* Archived Articles */
div.archive ul#archive-items {
	list-style-type:none;
	margin:0 0 15px;
	padding:0}
	


/* list of All Categories */
div.categories-list {
	overflow:hidden;}
	
	div.categories-list ul { 
		list-style-type:none;
		margin:0 0 15px;
		padding:0;}
		
		div.categories-list ul span.item-title {
			font-size:1.4em;
			display:block;
			margin-bottom:3px;}
			
			div.categories-list ul li {}
		
		div.categories-list ul .category-desc img {
			float:left;
			margin:5px 10px 10px 0} 
			
		div.categories-list  dl.article-count {
			margin-bottom:3em; }
		
			div.categories-list  dl.article-count dt {
				display:inline; }
			
			div.categories-list  dl.article-count dd {
				display:inline; margin-left:2px;}
				
		 
		 
/* Create Article Page */
		


/* Article Page */
.item-page {
	position:relative; 
	padding-top: 38px;}

	.item-page h2 {
		margin-bottom:.25em;}


	.item-page img {
		float:left;
		padding:5px;
		background:rgba(255,255,255,.05);
		border:1px solid rgba(255,255,255,.08); 
		margin:7px 15px 15px 0;}




/* Buttonheading is used to render the CSS for the icons like
print, email */
ul.actions {
	float:right;
	margin:-2px 0 0;
	padding:0;
	
	list-style-type:none;}
	ul.actions li {
		float:left;
		padding:0;}
		ul.actions li img {
			background:none;
			padding:0;
			opacity:.2;
			border:none;
			margin:0 0 0 4px;	
			-webkit-transition:all .4s ease-out;
			-moz-transition:all .4s ease-out;
			-o-transition:all .4s ease-out; 
			transition:all .4s ease-out;}
			ul.actions li a:hover img {
				opacity:1;}
			
			
		
		
/* The code below is used to render the published date, 
last updated date and the author name on each category,
section or article */	
dl.article-info {
		overflow: hidden;
		margin-bottom:1.5em;}
	
	dl.article-info dt.article-info-term {
		display:none}
	
	dl.article-info dd {
		float:left;
		font-family:Verdana, Geneva, sans-serif;
		color:#888;
		color:rgba(255,255,255,.3);
		font-size:.9em;
		margin-left:0;
		padding:0;
		font-style:italic;
		margin-right:1.75em;}
		
		/* published date on blog, blog featured and items */
		.blog dl.article-info dd.published,
		.blog-featured dl.article-info dd.published,
		.item-page dl.article-info dd.published {
			position:absolute;
			top:4px;
			text-shadow:1px 1px 1px #000;
			padding:2px 10px 3px 26px;
			font-size:1.1em;
			left:-24px;
			background:#111;
			background:rgba(0,0,0,.3);
			border:1px solid #222;
			border-left:none;}
			
		.cols-2 .column-1, 
		.cols-2 .column-2 {
			padding-top:38px}
			
			.items-row dl.article-info dd.published {
				border-left:1px solid #222;
				padding-left:10px;
				font-size:1em;
				left:0}
			
			
	

/*  -- Voting -- 
Now in Joomla 1.6 the voting system is built into the core*/
span.content_rating {
	color: rgba(255, 255, 255, 0.3);
	margin-bottom:-18px;
	display:block;}
	
	span.content_rating img {
		padding:0;
		float:none;
		background:none;
		border:none;
		margin:0 0 -3px 2px } 
	
div.content_vote {
	padding-bottom:10px;
	color: rgba(255, 255, 255, 0.3);
	display:block;}
	
	div.content_vote input {
		margin-bottom:-2px}
	
	div.content_vote input.button {
		margin-bottom:0;
		margin-left:10px;}	
	

/* -- Pagenav -- 
used below each article to navigate from one artcile to another */
ul.pagenav {
	display:block;
	list-style-type:none;
	padding:6px 0 0;
	margin-top:10px;
	border-top:1px solid #eee;}	 
	ul.pagenav li {
		display:inline}
		
	ul.pagenav li.pagenav-prev {
		float:left}
	
	ul.pagenav li.pagenav-next {
		float:right} 
			


/* Items More */
div.items-more {
	clear:both;
	position:relative;
	overflow:hidden;
	border-top:1px solid #eee;
	padding-top:15px}




/* The readmore code is used to make readmore links for each article
on the Section and Category view

check forms.css to change the styles */

p.readmore {}
	p.readmore a {}
		
		p.readmore a {
			text-decoration:none;
			display:inline-block;
			font-size:1.1em;
			color:#fff;
			-moz-transition: all .3s ease-out;
			-o-transition: all .3s ease-out;
			-webkit-transition: all .3s ease-out;
			transition: all .3s ease-out;
			background-position:center right; }
			
			p.readmore a:hover {
				padding-right:22px;
				background:url(../images/readmore.png) no-repeat center right;}
				
			
		p.readmore a:hover {}
			
	

/* Pagination makes a unested list of links on the end of each 
cateogry/section but it may be used by other extensions as well
for the same reason, so be careful as this other extensions 
may use their own code to display the pagination */
div.pagination {
	position:relative;
	overflow:hidden;
	border-top:1px dotted #333;
	padding-top:15px}

div.pagination ul {	
	clear:both;	
	list-style-type:none; 
	margin:0 auto .75em; 
	text-align:center;}	
	
	div.pagination ul li {
		display:inline;}
		 
		  div.pagination ul li span.pagenav,
		  div.pagination ul li a.pagenav {
			  display:inline-block;
			  margin:0 3px;
			  padding:2px 8px 1px;
			  border:1px solid #333; }
			  
			  
		 div.pagination ul li a.pagenav {
			background:#111;
			background:rgba(0,0,0,.3);
			color:#fff;
			text-shadow:1px 1px 1px #000;}
			
			 div.pagination ul li a.pagenav:hover {
				 background:#000;
				 background:rgba(0,0,0,.8);
				 color:#fff;
				 text-decoration:none;
				 text-shadow:1px 1px 1px #000;}
		 
	div.pagination p.counter { 
		margin:0 auto 10px; 
		text-align:center; 
		color:#666} 




/* Default Joomla Extensions
------------------------------
Below you will find the CSS codes that are needed by the Default
Joomla Extensions like the mod_latestnews, mod_login, mod_search,
etc.
---------------------------------------------------------------- */

/* Sliders */
.pane-sliders {
	border: 1px solid #333;
	border: 1px solid rgba(255,255,255,.15);
	border-bottom:none;}

	.pane-sliders div.pane1 { }
	
	.pane-sliders div.panel:last-child  {
		border-bottom: 1px solid #222;
		border-bottom: 1px solid rgba(255,255,255,.07)}
	
	.pane-sliders div.panel h3.pane-toggler,
	.pane-sliders div.panel h3.pane-toggler-down {
		background:#111;
		background:rgba(0,0,0,.3);
		border-bottom: 1px solid #222;
		border-bottom: 1px solid rgba(0,0,0,1);
		box-shadow: 0 1px 0 rgba(255,255,255,.07);
		margin-top:1px;
		font-size:1.3em;}
		.pane-sliders div.panel h3.pane-toggler a,
		.pane-sliders div.panel h3.pane-toggler-down a { 
			display:block;
			color:#ccc;
			color:rgba(255,255,255,.4);
			padding:4px 10px;
			text-decoration:none;}
			.pane-sliders div.panel h3.pane-toggler a:hover,
			.pane-sliders div.panel h3.pane-toggler-down a:hover,
			.pane-sliders div.panel h3.pane-toggler-down a {
				color:#fff;
				text-shadow:1px 1px 1px #000} 
				
	
		.pane-sliders div.panel h3.pane-toggler-down {
			border-bottom:1px solid transparent;
			box-shadow:none;
			margin-bottom:-1px;
			background:rgba(0,0,0,.5);}
			

	.pane-sliders div.panel div.pane-down {
		padding:20px 10px!important;}


/* Tabs */
dl.tabs {
    float: left;
    margin: 0;
    z-index: 50;
    clear:both;
	width:100%;
	border-bottom: 1px solid #222);
	border-bottom: 1px solid rgba(255,255,255,.2);}

	dl.tabs dt {
		padding:0;
		float: left;
		border-left: 1px solid #222;
		border-left: 1px solid rgba(255,255,255,.1);
		border-right: 1px solid #222;
		border-right: 1px solid rgba(255,255,255,.1);
		border-top: 1px solid #222;
		border-top: 1px solid rgba(255,255,255,.15);
		margin-right: 10px;
		font-size:.8em;
		background: #111;
		background: rgba(0,0,0,.6);
		background: -moz-linear-gradient(100% 100% 90deg, rgba(0,0,0,.6), rgba(0,0,0,.2));
  		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.2)), to(rgba(0,0,0,.6))); 
		border-top-left-radius:5px;
		border-top-right-radius:5px;}
		dl.tabs dt a {
			color:#ccc;
			color:rgba(255,255,255,.4);
			display:block;
			float:left;
			padding: 4px 14px 3px;
			text-decoration:none;}
			dl.tabs dt a:hover,
			dl.tabs dt.open a {
				color:#fff;
				text-shadow:1px 1px 1px #000; }
		
		dl.tabs dt.open {
			background: #000;
			background: rgba(0,0,0,0);
			background: -moz-linear-gradient(100% 100% 90deg, rgba(0,0,0,0), rgba(0,0,0,.6));
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,.6)), to(rgba(0,0,0,0)));
			margin-bottom:-1px;
			padding-bottom:1px;
			border-left: 1px solid rgba(255,255,255,.2);
			border-right: 1px solid rgba(255,255,255,.2);
			border-top: 1px solid rgba(255,255,255,.2);
			border-bottom:1px solid transparent;
			z-index: 100;}


		div.current {
			clear: both;
			border: 1px solid #222;
			border: 1px solid rgba(255,255,255,.2);
			border-top:none;
			padding: 15px 10px;}

		div.current dd {
			padding: 0;
			margin: 0;}
			



/* Contact Us form */
div.contact { }

	div.contact h2 {
		margin-bottom:7px; }
		
		
div.contact-form { }

	div.contact-form  p.form-required { font-weight:bold; }
	
	div.contact-form div.contact-email div {
		padding:0 0 14px}
		
		div.contact-form div.contact-email div label {
			width:130px;
			padding-bottom:5px}
	
	div.contact img { float:left; margin:0 10px 10px 0}
	
	div.contact div.contact-image img {float:right; margin:0 0 10px 10px}
	
	

/* com_users */
div.registration,
div.login,
div.profile-edit,
div.edit,
div.profile { }

	div.registration dt,
	div.login dt,
	div.profile-edit dt,
	div.edit dt,
	div.profile dt,
	div.registration dd,
	div.login dd,
	div.profile-edit dd,
	div.edit dd,
	div.profile dd  {
		display:inline-block;
		float:left }

	div.registration dt,
	div.login dt,
	div.profile-edit dt,
	div.edit dt,
	div.profile dt  {
		clear:both;
		width:160px;
		text-align:right;
		margin-bottom:1.5em;}
		
		div.registration dt label,
		div.login dt label,
		div.profile-edit dt label,
		div.edit dt label  {
			width:auto;}
		
		div.registration dt span.spacer { text-align:left; display:block; color:#999}

		div.profile-edit span.optional { font-size:.9em; color:#999; font-weight:normal; }
		
		
		

	div.edit { }
	
		div.edit #editor-xtd-buttons { padding:0}
		
		div.edit .button2-left { margin:15px 10px 0 0}


	div.edit .form-note {
		background:rgba(0,0,0,.3);
		clear:both;
		display:block;
		margin:20px -1.4em -41px;
		padding:10px}
		div.edit .form-note p {
			margin-bottom:0}
			
	div.edit img {
		float: right;
		margin: 3px 0 0 5px;}


/* category module */
ul.category-module {
	padding:0;
	margin:0;
	list-style-type:none}
	
	ul.category-module li {
		padding:0}
	
		ul.category-module li h4 {
			font-size:1.2em;}
		
		ul.category-module li span.mod-articles-category-date,
		ul.category-module li span.mod-articles-category-writtenby { 
			color:#999; 
			font-family:Arial, Helvetica, sans-serif; }
			
		ul.category-module li span.mod-articles-category-writtenby  {
			padding-right:18px;}	


/* com newsfeeds */
div.newsfeed {}

	div.newsfeed {}


	div.newsfeed div.feed-items {
		margin-top:30px}
		
		div.newsfeed div.feed-items img {
			float:left;
			margin:5px 10px 10px 0}


 
/* mod_latestnews and mod_mostread */
ol.latestnews,
ol.mostreadmod { margin:.5em 0 0; padding-right:0; padding-left:1.5em; }

ol.latestnews li,
ol.mostreadmod  li { color:#999; margin-bottom:1em}


/* mod_login */
form#login-form {
	padding-top:.75em;
	margin-top:0;}
	
	form#login-form div.pretext {
		margin-bottom:10px}
	form#login-form div.posttext {
		margin-top:10px}
	
	form#login-form fieldset {
		border:none;
		padding:0;
		margin:0 0 20px}
	
		form#login-form fieldset label {
			display:none;}
	
		form#login-form fieldset p {
			margin-bottom:1em;}

		form#login-form p .inputbox {
			width:90%}
	
		form#login-form input.button {}	 
	
	form#login-form p#form-login-remember {
		padding:.25em .25em 0 0}
		form#login-form p#form-login-remember label {
			display:inline;}
		form#login-form p#form-login-remember .inputbox {
			width:auto}		
		
	form#login-form ul {
		clear:both;
		padding:0 0 0 .5em;
		list-style-type:none;
		margin:0}
		form#login-form ul li {
			padding:.1em 0}
		
		
	form#login-form p {
	margin:0 0 15px; }

	form#login-form button{ 
		margin: 0 0 0 10px}
	
		
				
/* mod_search
---------------*/
#search {
	float:right;
	margin:32px 0 0;
	position:relative;}
	
	#search label { display:none;}
	
	#search .inputbox {
		color:#666;
		padding:5px 10px  }
		
		#search .inputbox:hover,
		#search .inputbox:focus {
			border-color:rgba(255,255,255,.2);} 
	
	
	#search .button { 
	padding:1px 10px 2px }
		#search .button:hover { }
		
	
		
	
	
/* com_search
---------------*/
form#searchForm {}

	form#searchForm div.searchintro {
		padding:.4em 1em;
		border:1px solid #fff;
		margin-bottom: 1.5em;
		color: #514721;
		background:#FFF6BF;
		-moz-box-shadow: 0 0 8px #877736;
		-webkit-box-shadow: 0 0 8px 877736;
		box-shadow: 0 0 8px #877736;}
		form#searchForm div.searchintro p {
			margin:0}
	
		
	form#searchForm .ordering-box {
		padding-top:15px}

	form#searchForm label {
		width:auto; padding-right:10px;}
		
	form#searchForm .form-limit { float:left; padding-top:20px}
	
	form#searchForm .counter { float:right; padding-top:25px}
	
		
	dl.search-results {
		clear:both;}
		
	dl.search-results .result-title { padding-top:25px; font-size:1.3em;}
	
	dl.search-results dd { margin-left:0}
		

	
/* mod_breadcrumbs
----------------------*/	
#breadcrumbs {
	clear:both;
	background:#111;
	background:rgba(0,0,0,.3);
	border-bottom:1px dotted #222;
	border-bottom:1px dotted rgba(255,255,255,.15);
	margin:-14px -14px 15px;
	padding:14px 14px 12px;}

	#breadcrumbs ol{
		list-style-type:none;
		float:left;
		font-size:1em;
		margin:0;
		padding:0;}
		#breadcrumbs ol li { 
			float:left;
			color:#fff;
			color:rgba(255,255,255,.7);
			background:url(../images/breadcrumbs_arrow.png) no-repeat 96% 48%;
			padding:0 34px 0 0}
			#breadcrumbs ol li a {
				display:block;
				margin:0;}
				#breadcrumb ol li a:hover {}

		#breadcrumbs ol li.lastitem {
			background:none;
			padding:0}


		#breadcrumbs ol li:first-child a {
			background:url(../images/breadcrumbs_home.png) no-repeat center right;
			height:22px;
			width:22px;
			margin-top:-2px;
			opacity:.2;
			margin-left:-2px;
			text-indent:-9999em;
			-webkit-transition:all .4s ease-out;
			-moz-transition:all .4s ease-out;
			-o-transition:all .4s ease-out; 
			transition:all .4s ease-out;}
			#breadcrumbs ol li:first-child a:hover {
				opacity:1;}
			


/* -- Lnnguage Switcher --
Now in Joomla 1.6 we have by default the language switcher option */
#language {
	position:absolute;
	top:15px;
	background:rgba(0,0,0,.3);
	padding:2px 12px 2px 5px;
	left:0}
	
	#language ul {
		padding:0;
		margin:0;
		list-style-type:none;}
		#language ul li {
			display:inline;
			padding:0 0 0 7px;
			margin:0;}	
			
			#language ul li a {
				opacity:.3;
				-moz-transition: all .3s ease-out;
				-o-transition: all .3s ease-out;
				-webkit-transition: all .3s ease-out;
				transition: all .3s ease-out;}	
			
			#language ul li a:hover {
				-webkit-transform:scale(1.3);
				-moz-transform:scale(1.3);
				-o-transform:scale(1.3);
				-ms-transform:scale(1.3);	
				transform:scale(1.3);
				opacity:1;}	




/* Miscellaneous CSS
------------------------------
List of CSS codes that can not be categorized above but they may
be need by Joomla to operate normally. This codes may be used 
rarely but we reccomend to keep them and to be careful when you
try to change them
---------------------------------------------------------------- */
		
			
/* ToolTips 
---------------*/
.tip {
	padding:.4em .8em;
	border:1px solid rgba(255,255,255,.2);
	margin-bottom: 2em;
	font-weight:normal;
	color: #999;
	max-width:250px;
	background:#1E1E1E;
	box-shadow: 0 0 12px rgba(255,255,255,.3)}
	.tip .tip-title {
		font-weight:bold;
		font-size:1.1em}
 
 
/* Template Styles custom code */
ul.ice-template-style {
	margin:0;
	padding:0;
	float:left}
	ul.ice-template-style li {
		float:left;
		margin:0 .95em 1em!important;
		padding:0!important;
		list-style-type:none;}
		
	ul.ice-template-style li span {
		display:block;
		padding:0 0 .3em;
		font-size:1.4em}	


/* This styles are used on the Editor Page */
form.editor select{ width:auto;}



/* System Messages 
----------------------*/
dl#system-message {}
	
	
	dl#system-message dd {}
		
		
	dt.error,
	dd.error {}

	#system-message dd ul {
		background-position:4px 45%;
		margin-right:0}
		
		#system-message dd.warning ul,
		#system-message dd.error ul {}
		
	dt.notice,
	dd.notice {}
		


			
/* Social Links */
div#social {
	clear:both;
	border-top:1px dotted #333;
	border-bottom:1px dotted #333;
	padding:25px 0;
	position:relative;
	margin:0;}
	
	div#social ul {
		margin:0;
		text-align:center;
		padding:0;}
		
		div#social ul li {
			display:inline-block;
			font-size:2.25em;
			list-style-type:none;
			padding:12px 25px;
			border-right:1px dotted #222}
			div#social ul li:last-child {
				border:none}
			
				div#social ul li a {
					color:#3A9293;
					opacity:0.2;
					width:128px;
					height:60px;
					display:inline-block;
					text-decoration:none;
					padding:0;
					font-family:'Walter Turncoat', Arial, "Times New Roman", Times, serif;
					-moz-transition: all .3s ease-out;
					-o-transition: all .3s ease-out;
					-webkit-transition: all .3s ease-out;
					transition: all .3s ease-out;
					background-image:url(../images/social.png);
					background-repeat:no-repeat;
					background-position:center; }
					div#social ul li a:hover {
						opacity:1;
						color:#fff;}
						
						div#social ul li a span {
							display:none} 


					div#social ul li#social_facebook a {
						background-position:0 0}
					div#social ul li#social_twitter a {
						background-position:0 -60px}
					div#social ul li#social_youtube a {
						background-position:0 -120px}
					div#social ul li#social_myspace a {
						background-position:0 -180px}
					div#social ul li#social_flickr a {
						background-position:0 -240px}	
			
			
			div#social p {
				background:#222;
				padding:7px 12px;
				color:rgba(255,255,255,.5);
				position:absolute;
				margin:0;
				top:-20px;
				left:37.5%;
				opacity:0;
				text-align:center;
				font-size:2.2em;
				-moz-transition: all .3s ease-out;
				-o-transition: all .3s ease-out;
				-webkit-transition: all .3s ease-out;
				transition: all .3s ease-out;}
				div#social:hover p {
					opacity:1}
			
			
			

/* Menus
------------------------------
List of CSS codes that can not be categorized above but they may
be need by Joomla to operate normally. This codes may be used 
rarely but we reccomend to keep them and to be careful when you
try to change them
---------------------------------------------------------------- */

/* MainMenu 
Only the wrapper part is here the rest of the codes that
generates the mainmenu can be found on 
modules/mod_icemenu/tmpl/default/icemenu.css  
---------------*/
#nav-wrapper {
	background:url(../images/nav.png) no-repeat center;
	clear:both;
	width:950px;
	margin:-75px auto 40px;
	height:50px;
	z-index:99999;
	position:relative;}

	#nav_container {
		height: 50px;}

		
/* TopMenu 
---------------*/
#topmenu {
	position:absolute;
	top:15px;
	right:0;}
	
	#topmenu ul.menu { 
		margin:0;
		background:rgba(0,0,0,.3);
		overflow:hidden;
		padding:2px 1.1em 2px 0;}
		#topmenu ul.menu li {
			display:inline;
			float:left;
			padding:0 1.1em 0 0;
			border-right:1px dotted rgba(255,255,255,.1);
			text-shadow:1px 1px 1px #000;
			margin:0 0 0 1.1em;
			font-style:italic;
			list-style-type:none;}
			#topmenu ul.menu li a {
				color:#7D2D2D;}
				#topmenu ul.menu li.active a,
				#topmenu ul.menu li a:hover {
					text-decoration:none;
					color:#C05151;}
			
			#topmenu ul.menu li a img {
				float:none;
				margin:0px 8px -4px 0}
				
			#topmenu ul.menu li:last-child {
				border:none;
				padding-right:0;}
			


/* FooterMenus
---------------*/
#footer ul.menu {
	padding-left:1.25em;
	margin-bottom:.5em}
	
	#footer ul.menu li {}
		
		#footer ul.menu li a {
			color:#999;
			color:rgba(255,255,255,.4);
			text-decoration:none;}
			#footer ul.menu li a:hover,
			#footer ul.menu li.current a {
				color:#ccc;
				color:rgba(255,255,255,.8);}
		
		
		/* Footer menu with suffix  "footer-connect" used
		on the last menu with the social icons */
		#footer ul#footer-connect {
			padding-left:.5em;
			list-style-type:none;}
			#footer ul#footer-connect li {
				padding-top:.45em;
				padding-bottom:.4em;}
				#footer ul#footer-connect li a {}
			
				#footer ul#footer-connect li img {
					margin:0 9px -4px 0;
					opacity:.2; 
					-webkit-transition:all .4s ease-out;
					-moz-transition:all .4s ease-out;
					-o-transition:all .4s ease-out; 
					transition:all .4s ease-out;}
					
					#footer ul#footer-connect li a:hover img {
						opacity:1;}



	
/* Right Columns Menus
used to display the current menu that is 
also on the dropdown 
-----------------------------------------*/
.col-module-content ul.menu,
.col-module-content ul.menu ul { 
	margin:0;
	padding:0;}
	.col-module-content ul.menu li {
		padding:0;
		border-bottom:1px dotted rgba(255,255,255,.15);
		margin:0;
		list-style-type:none;}
		.col-module-content ul.menu li a {
			color:#fff;
			display:block;
			padding:.3em 10px;
			color:rgba(255,255,255,.5);}
			.col-module-content ul.menu li a:hover,
			.col-module-content ul.menu li.current a  {
				text-decoration:none;
				text-shadow:1px 1px 1px #000;
				color:#fff;}


		.col-module-content ul.menu li span.separator {
			font-size:1.3em;
			color:#999;
			margin-top:1em;
			background:rgba(0,0,0,.3);
			text-shadow:1px 1px 1px #000;
			display:block;
			padding:.3em 10px;
			color:rgba(255,255,255,.9);}
		
		
		
		.col-module-content ul.menu li li:last-child {
			border:none;}
		
		
		
		
/* Copyright Menu 
---------------*/
#footermenu {
	padding:0;
	float:right}
	
#footermenu ul.menu { 
	margin:17px 40px 0 0;
	padding:0;}
	#footermenu ul.menu li {
		display:inline;
		float:left;
		font-size:.9em;
		padding:0 2em 0 0;
		margin:0;
		list-style-type:none;}
		#footermenu ul.menu li a {
			color:#666;
			color:rgba(255,255,255,.4)}
			#footermenu ul.menu li a:hover {
				color:#ccc;
				color:rgba(255,255,255,.9);
				text-decoration:none;}
		
		#footermenu ul.menu li a img {
			float:none;
			margin:0px 8px -4px 0}
			
		#footermenu ul.menu li:last-child {
			border:none;
			padding-right:0;}			





/* 
Extensions Overwrites
----------------------
Below you will find the CSS codes for the extensions that we
provide along with this template. Note that almost all the
extensions found here have their own CSS file on their 
respective folders. Also note that all the CSS codes here
overwrite the CSS code on the module folders. That's why we have
userd the !important feature many times below.
---------------------------------------------------------------- */
/* Tweet Display Back */ 

.TDB-header {
	font-size:.9em!important;
	background:#111!important;
	background:rgba(0,0,0,.3)!important;
	border-color:#333!important;
	border-radius:0!important;}
	
	.TDB-header-user {
		font-size:1.1em!important;
		background:#222!important;
		background:rgba(255,255,255,.2)!important;
		margin:-2px -10px 10px!important;
		padding:2px 0!important;}
		
	span.TDB-header-avatar-left {
		margin-top:5px!important;
		padding-right:10px!important;}	
		
	.TDB-header-location {
		border-top:1px dotted rgba(255,255,255,.15);
		padding-top:5px;
		margin-top:15px;}
	
	.TDB-header-web {
		font-size:1em!important;
		padding-top:0!important;
		padding-bottom:5px!important;}	
			
	
.TDB-tweet-left {
	font-size:.9em!important;
	background:#111!important;
	background:rgba(0,0,0,.3)!important;
	border-color:#333!important;
	border-radius:0!important;
	margin-bottom:10px!important;
	padding:5px 10px!important;
	margin-left:55px!important;}
	.TDB-tweet-left:before {
		border-top-color: #333!important;
		border-color: transparent #333!important;}
	.TDB-tweet-left:after {
		border-top-color: #111!important;
		border-color: transparent #111!important;}
	
	
	.TDB-tweet-left .TDB-tweet-time {
		font-size:.9em!important;
		border-top:1px dotted rgba(255,255,255,.15);
		margin-top:10px;
		padding-top:1px}

/* IceAccordion */
.iceaccordion h4.toggler {
	font-family:Arial, Helvetica, sans-serif!important;
	color:#fff!important;
	color:rgba(255,255,255,.4)!important;
	padding-top:.5em!important;
	padding-right:25px!important;
	margin-bottom:-5px!important;
	line-height:1.6em;
	border-bottom-color:#444!important;
	border-bottom-color:rgba(255,255,255,.2)!important;
	background-image:url(../images/iceaccordion_arrow_closed.png)!important}
	
	.iceaccordion h4.toggler:hover {
		color:rgba(255,255,255,.7)!important;}
	
	.iceaccordion h4.open {
		color:#fff!important;
		color:rgba(255,255,255,.7)!important;
		background-image:url(../images/iceaccordion_arrow_open.png)!important}
		
		.iceaccordion div.accordion_content img {
			padding:5px;
			background:rgba(255,255,255,.05);
			border:1px solid rgba(255,255,255,.08);}
	
		
		.iceaccordion p.readmore {
			margin-top:1.5em;
			margin-bottom:2em}
	



/* Experimental Feature 
used currently to display a nice effect in webkit based browsers for the logo.
You may remove it if you wish */
body.homepage #header { -webkit-animation: effect 5s ease-out 1;}
body.homepage #content { -webkit-animation: effect 5s ease-out 1;}
body.homepage #nav-wrapper  { -webkit-animation: effect 5s ease-out 1;}
body.homepage #icetabs { -webkit-animation: effect 1.5s ease-in 1;}

@-webkit-keyframes effect {
	0%		{ opacity:0}
	50%		{ opacity:0} 
	100%	{ opacity:1}
}

div#logo h1.logo a:hover {
text-decoration: none;
}

.tsokolia {
 
}
.tsokolia a {
  position: absolute;
  height: 30px;
  bottom: 30px;
  right: 36px;
  font-size: 11px;
  color: #fff;
  text-align: right;
  text-decoration: none;
  background-image: url(../images/tsikoliya.png);
  background-repeat: no-repeat;
  background-position: right center;
  padding-right: 33px;
  z-index: 20;
}
.tsokolia span {
  font-size: 12px;
  text-decoration: underline;
  position: absolute;
  height: 30px;
  bottom: 20px;
  right: 69px;
  font-size: 11px;
  color: #fff;
  text-align: right;
  text-decoration: none;
  z-index: 20;
}

div#middle-column p {
font-size: 120%;
}