* {
	padding:0;
	margin:0;
}
body {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	background: url(../images/back_pattern.jpg) left top;
	text-align: center;
}
#container {
	width:770px;
	margin:0 auto;
	text-align:left;
}
#languages {
	width:770px;
	height:30px;
	background-color:#100c08;
	margin-bottom:10px;
}
#languages ul {
	padding:0;
	margin:0;
	list-style-type:none;
}
#languages li {
	float:left;
}
#languages li a.gr {
	background: url(../images/gr_flag.gif) no-repeat;
	height: 17px;
	width: 74px;
	display:block;
	text-indent:-9999px;
	margin:5px 20px 5px 10px;
}
#languages li a.en {
	background: url(../images/en_flag.gif) no-repeat;
	height: 17px;
	width: 65px;
	display:block;
	text-indent:-9999px;
	margin:5px 0;
}
#header {
	width:770px;
}
#header h1 a {
	background-image: url(../images/logo.gif);
	background-repeat: no-repeat;
	text-indent: -9999px;
	display: block;
	height: 145px;
	width: 237px;
	float:left;
}

#topnav ul {
	background-image: url(../images/menu_back.jpg);
	background-repeat: no-repeat;
	margin: 0px;
	padding: 5px 0 0 200px;
	height: 140px;
	width: 333px;
	list-style-type:none;
	float:left;
}
#topnav li {
	display:inline;
}
#topnav li a {
	color:#000000;
	text-decoration:none;
	font-size:80%;
	width:145px;
	float:left;
	border-top:1px dashed #000000;
	margin-left:15px;
	padding:2px 0;
}
#topnav li a:hover {
	font-weight:bold;
}
#topPhotos {
	background: url(../images/products.jpg) no-repeat;
	height: 78px;
	width: 770px;
	margin:5px 0;
	float:left;
}
#content {
	width:770px;
	background-color:#f6eee1;
	float:left;
	/*opacity: 0.8;
	-moz-opacity: 0.8;
	filter: alpha(opacity=80);*/
	position:relative;
	padding-bottom:10px;
}
#content2 {
	width:770px;
	background-color:#f6eee1;
	float:left;
	position:relative;
	padding-bottom:10px;
	margin-top:25px;
}
#subNav {
	position:absolute;
	top:-20px;
	left:10px;

}
#subNav ul {
	padding:0;
	margin:0;
	list-style-type:none;
}
#subNav li {
	text-align:center;
	padding:0;
	float:left;
	margin-right:5px;
}
#subNav li a {
	color:#FFFFFF;
	font-size:75%;
	text-decoration:none;
	height:20px;
	padding:0 5px;
	background:#44acc1;
	display:block;
	float:left;
}
#subNav li a:hover, #subNav li a.selected {
	background:#28889b;
}
.cat {
	width:770px;
	height: 115px;
	margin:10px 0;
	float:left;
}
.cat p {
	width: 350px;
}
.eswterikes {
	background: #fff url(../images/portakia_colour.jpg) no-repeat right;
}

.kitchen3d {
	background: #fff url(../images/3d_kitchen.jpg) no-repeat right;
}
.showroom {
	background: #fff url(../images/showroom.jpg) no-repeat right;
}
.kitchen3d span {
	display:block;
	width:20px;
	height:115px;
	position:absolute;
	left:-20px;
	background:#f0a90f;
}
.colours {
	background: #fff url(../images/portakia_colour.jpg) no-repeat right;
}
.colours span, .showroom span {
	display:block;
	width:20px;
	height:115px;
	position:absolute;
	left:-20px;
	background:#8fecfe;
}
.ergaMas {
	background: #fff url(../images/erga_mas.jpg) no-repeat right;
}
.ergaMas span {
	display:block;
	width:20px;
	height:115px;
	position:absolute;
	left:-20px;
	background:#000000;
}
a:link, a:visited {
	color:#28889B;
	text-decoration:underline;
}
a:hover {
	text-decoration:none;
}
a.more {
	background-color:#44acc1;
	color:#FFFFFF;
	text-decoration:none;
	padding:2px 5px;
	font-size:75%;
	margin-left:10px;
}
a.more:hover {
	background-color:#28889b;
}
#footer {
	clear:both;
	float:left;
	width:750px;
	background:#38858d;
	padding:10px;
	opacity: 0.8;
	-moz-opacity: 0.8;
	filter: alpha(opacity=80);
	position:relative;
	margin:10px 0;
}
#footer ul {
	margin:0;
	padding:0;
	list-style-type:none;
}
#footer li {
	color:#a0dce7;
	display:inline;
	line-height:18px;
	font-size:70%;
	padding: 0 3px 0 0;
}
#footer p {
	color:#FFFFFF;
	font-size:70%;
	margin:10px 0 0 0;
	padding:0;
}
#footer a {
	color:#a0dce7;
	text-decoration:underline;
}
#footer a:hover {
	color:#a0dce7;
	text-decoration:none;
}
#footer address {
	position:absolute;
	right:10px;
	top:10px;
	color:#FFFFFF;
	font-size:70%;
	text-align:right;
	font-style:normal;
	line-height:15px;
}
ul#photoGallery {
	padding:0;
	margin:10px;
	list-style-type:none;
}
ul#photoGallery li {
	display:inline;
}
ul#photoGallery img {
	border:2px solid #000000;
	margin:0 20px 10px 0;
}
ul#photoGallery img:hover {
	border:2px solid #999999;
}
p {
	font-size:75%;
	padding:5px 10px;
	line-height:15px;
}
#content h1, #content2 h1 {
	font-size:140%;
	padding:5px 10px;
	border-top: 1px dashed #333333;
	border-bottom: 1px dashed #333333;
	margin:10px 0;
	position:relative;
}
#content h1 span, #content2 h1 span {
	display:block;
	width:20px;
	height:38px;
	position:absolute;
	left:-20px !important;
	left:-30px;
	top:-1px;
	background:#f2a710;
}

h2 {
	font-size:100%;
	padding:5px 10px;
}
.productCat {
	width:160px;
	height:327px;
	background:#FFFFFF;
	border:1px solid #999999;
	text-align:center;
	float:left;
	margin-left:20px;
	margin-top:15px;
}
.productCat img {
	border:none;
}
.productCat h3 {
	font-size:90%;
	float:left;
	background-color:#000000;
	color:#FFFFFF;
	text-align:center;
	width:150px;
	padding:5px;
}
.albumlist
{
	margin-left:0;
	padding-left:0;
}

/* Picture List UL */
.picturelist
{
	padding:0;
	margin:10px;
	list-style-type:none;
}

/* Album and Picture Lists */
.thumb
{
/*	padding:0;
	width:auto;
	margin:0 0.5em 0.5em 0;
	text-decoration:none;
	line-height:normal;
	list-style-type:none;
	text-align:center;
	float:left;*/
	display:inline;

}

.thumb a
{
	display:block;
	height:72px; 
/* Set link formatting*/
	width:100px; 
/* Thumb width*/ 
	
/* Thumb height*/
	padding:10px;
/* Thumb padding to form thumb frame */
/* You can set the above to 0px = no frame - but no hover indication!*/
	margin:0;
	background-color:white;
/*Background of thumb */
	border-top:1px solid #eee;
/* Borders of thumb frame */
	border-right:2px solid #ccc;
	border-bottom:2px solid #ccc;
	border-left:1px solid #eee;
	text-decoration:none;
}

.thumb a:visited img
{
	background-color:#eee;
/*Background of thumb on hover - sort of a light grey */
}

.thumb a:hover img
{
	background-color:#dae6e4;
/*Background of thumb on hover - sort of light blue/green */
}

/* Styling of text and navigation for Album */
.albumname
{
	font-size:smaller;
	text-align:center;
	font-weight:bold;
	font-style:normal;
}

.albumpicturecount
{
	font-size:smaller;
	text-align:center;
	font-weight:normal;
	font-style:italic;
}

.albumcomment
{
	text-align:center;
	font-weight:normal;
	font-style:normal;
}

.albumnav
{
	text-align:center;
	font-weight:normal;
	font-style:normal;
	font-size:smaller;
}

.instructiontext
{
	font-weight:normal;
	font-style:normal;
	font-size:smaller;
	font-style:italic;
}

/* Big Picture */
.bigpicture
{
	padding:0.5em 0 0;
	clear:left;
	border-top:1px solid #ccc;
	text-align:center;
}

.bigpicturecaption
{
/* Big picture caption */
	text-align:center;
	margin:0 0 5px;
	padding:0;
}

.bigpicture img
{
/* Big picture settings */
	padding:18px;
/* Image padding to form photo frame. */
	width:80%;
/* Width of big picture - set to auto for actual width*/
	margin:0;
	background-color:white;
/* Background of picture */
	border-top:1px solid #eee;
/* Borders of picture frame */
	border-right:2px solid #ccc;
	border-bottom:2px solid #ccc;
	border-left:1px solid #eee;
	text-decoration:none;
}

.bigpicturenav
{
	margin:0;
	padding:0;
	color:#000;
	font-size:smaller;
	line-height:normal;
}


form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  margin: 0;
  padding: 0;
  width:650px;
}

form fieldset {
  / * clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  border-color: #000;
  border-width: 0px;
  border-style: solid;
  padding: 10px;        /* padding in fieldset support spotty in IE */
  margin: 0;
}

form fieldset legend {
	font-size:100%;
	font-weight:bold; /* bump up legend font size, not too large or it'll overwrite border on left */
                       /* be careful with padding, it'll shift the nice offset on top of border  */
}

form label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 120px; 
	padding: 0; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: left;
	font-size:75%;
	font-weight:bold;
}

form input, form textarea {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
	border:1px solid #000;
}

form input#reset {
	margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}

textarea { overflow: auto; }

form small {
	display: block;
	margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	font-size: 88%;
}

form .required{font-weight:bold;} /* uses class instead of div, more efficient */

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}
