﻿body {
	margin: 0;
	padding: 0;
	background: #000000 url('design/aurora.jpg');
	background-position: center -30px;
	background-repeat: no-repeat;
	font-family: "Segoe UI", "Segoe", Tahoma, Geneva, Verdana, sans-serif;
	font-size: 14px;
	color: #AAAAAA;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	color: #DDDDDD;
}

a {
	outline: none;
}

#wrapper {
	width: 900px;
	margin: 0 auto;
	padding: 0;
}

/*-------------------- Header --------------------*/

#header {
	position: absolute;
	top: 0;
	margin: 0 auto;
	padding: 4px 0 0 0;
	height: 46px;
	z-index: 1;
	font-weight: normal;
	z-index: 5;
	/*text-indent: -9999px;*/
}

#header h1 {
	padding: 0;
	margin: 0;
	font-size: 18px;
	color: #AAAAAA;
}

#header h2 {
	padding: 0;
	margin: 0;
	font-size: 12px;
	color: #888888;
}


/*-------------------- Menu --------------------*/

#menu {
	margin: 0 auto;
	height: 50px;
	width: 900px;
	padding: 0;
	font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
	background: url('design/glass75.png');
	background-repeat: repeat;
	position: absolute;
	top: 0;
	z-index: 4;
	text-transform: uppercase;
}

#nav {
	/*margin: 20px 0 0 0;*/
	margin: 0;
	padding: 0;
	list-style: none; /* listastílus kitörlése */
}

#nav ul {
	list-style: none; /* listastílus kitörlése */ 
	display: none; /* a legördülő listákat ne jelenítjük meg */ 
	position: absolute;
	top: 50px;
	margin: 0;
	padding: 0;
	background: url('design/glass75.png');
	background-repeat: repeat;
	z-index: 99;
}

#nav li {
	float: right; /* a listaelemeket egymás mellé rakjuk */ 
	position: relative; /* és relatív pozícionáljuk, ezáltal az almenüket
							hozzájuk viszonyítva tudjuk rendezni az abszolút pozícionálással */ 
	background: transparent;
	color: #DDDDDD;
	font-size: 15px;
	margin: 0 .5em;
	padding: 15px 0 0 0;
	min-width: 9em;
	height: 35px;
	text-align: center;
}

* html #nav a {
	width: 100%; /* a linkek így biztosan kitöltik az őket körülvevő listaelemeket */
}

#nav a:link, #nav a:visited {
	display: block; /* az egyes linkeket blokk elemekké konvertáljuk
						így kitöltik a listaelemek által alkotott négyszögeket*/
	text-decoration: none;
	padding-left: 1em;
	padding-right: 1em;
	color: #DDDDDD;
}

#nav a:hover, #nav a:active {
	color: white;
}

#nav ul li {
	float: none; /* megakadályozzuk a legördülő listaelemek főmenütől örökölt balra/jobbra rendeződését */ 
	font-size: 80%;
	text-align: left;
	margin: 0;
	padding: 1px;
	height: inherit;
}

#nav li:hover ul {
	display: block; /* a legördülő listák megjelenítése a hover állapotban */ 
}

#nav li ul li a {
	padding: 7px;
}

#nav li ul li a:hover, #nav li ul li a:active {
	color: white;
}


/*-------------------- Content --------------------*/

#content {
	position: relative;
	margin: 65px auto 0 auto;
	padding: 0;
	width: 780px;
}

#content p {
	text-align: justify;
	margin: 0;
	padding: 0;
}

#glass {
	position: absolute;
	bottom: 0px;
	background-image: url('design/glass50.png');
	background-repeat: repeat;
	padding: 10px;
	color: #CCCCCC;
}

#ringsmenu {
	list-style: none;
	height: 40px;
	width: 100%;
	margin: 240px 0 0 0;
	text-transform: uppercase;
}

#ringsmenu li {
	float: left;
	width: 260px;
	height: 100%;
	text-align: center;
	font-size: 1.8em;
	margin: 0;
}

#ringsmenu a {
	width: 100%; /* a linkek így biztosan kitöltik az őket körülvevő listaelemeket */
	height: 100%;
	display: block;
	text-decoration: none;
}

#ringsmenu a:link, #ringsmenu a:visited {
	color: #AAAAAA;
}

#ringsmenu a:hover, #ringsmenu a:active {
	color: white;
	background: #222222;
}

#contactTable {
	margin: 130px auto;
	font-size: 1.5em;
}

#contactTable td {
	padding: 30px 5px 0 5px;
}


/*-------------------- Footer --------------------*/

#footer {
	position: absolute;
	bottom: 5px;
	margin: 0 auto;
	padding: 3px;
	width: 900px;
}

#footer p {
	margin: 0;
	padding: 0 0 4px 0;
	text-align: center;
	font-size: 12px;
	color: #444444;
}

#copy {
	float: right;
}

#lang {
	float: left;
}

#footer a {
	text-decoration: none;
}

#footer a:link, #footer a:visited {
	color: #444444;
}

#footer a:hover, #footer a:active {
	color: white;
}

/*----------------- Képgalériák, egyéb ------------------*/

#overlay {
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	z-index: 3;
	padding: 150px 30px 30px 30px;
	text-align: center;
	font-size: 30px;
	color: #444444;
}

/* Galleria */
#galleria {
	height: 480px;
	margin: 0;
	padding: 0;
	background: transparent;
	visibility: collapse; /* ha van JavaScript, a tulajdonságot visible-re állítja */
}

/* s3slider */

#s3slider {
   width: 780px; /* important to be same as image width */
   height: 500px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
   margin: 0 0 15px 0;
}
 
#s3sliderContent {
   width: 780px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: -40px; /* important |! org: 0 !*/
   margin-top: 0;
}
 
.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}
 
.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 10px/15px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   width: 780px;
   background-color: #000;
   filter: alpha(opacity=0); /* here you can set the opacity of box with text */
   -moz-opacity: 0; /* here you can set the opacity of box with text */
   -khtml-opacity: 0; /* here you can set the opacity of box with text */
   opacity: 0; /* here you can set the opacity of box with text */
   color: #ddd;
   display: none; /* important */
   top: 0;
 
   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}
 
.clear {
   clear: both;
}