/*
*	Bartók Brigitta
*	E65UY2
*
*	Sárga: rgba(243,223,40,1)
*	Szürke: rgba(58,61,66,1)
*/

* {	margin: 0;	padding: 0;	border: 0; outline: 0; }
.clear { clear: both; }
.clear:before,
.clear:after {
	content:" ";
	display: table;
}
.clear:after { clear: both; }

/*
* kijelöléskor felvett értékek
::selection {
	color: rgba(243,223,40,0.7);
	background: #336680;
}

* kijelöléskor felvett értékek: Mozillában
::-moz-selection{
	color: rgba(243,223,40,0.7);
	background: #336680;
}
*/

body {
	background: url('kepek/bg.jpg') no-repeat center center fixed;
	background-size: cover;
	font-family: 'Century Gothic', 'Sans-serif', Verdana, Arial;
	color: #fff;
}

body p {
	text-align: justify;
	line-height: 130%;
	margin-bottom: 10px;
}

a {
	text-decoration: none;
	font-weight: bold;
	color: #fff;
}

nav {
	margin-bottom: 20px;
	background: rgba(58,61,66,0.5);
	text-align: center;
}

nav .navbar {
	max-width: 1000px;
	width: 95%;
	margin: 0 auto;
	padding: 5px 0;
}

.szlogen {
	text-align: right;
	font-size: 15px;
	font-style: italic;
	margin:	0 0 20px 0;
	color: rgba(243,223,40,1);
}

nav .menu-toggle {
	cursor: pointer;
	display: none;
	padding: 12px;
	margin: 10px 0;
}

nav .icon-bar {
	background: #fff;
	display: block;
	width: 22px;
	height: 2px;
}

nav .icon-bar + .icon-bar {
	margin-top: 4px;
}

nav .menu ul {
	float: left;
}

nav .menu ul li {
	float: left;
	list-style: none;
	border-left: 2px solid rgba(243,223,40,1);
}

nav .menu li:first-child { border-left: none; }

nav .menu li a,
nav .open-submenu {
	cursor: pointer;
	font-weight: bold;
	position: relative;
	display: block;
	padding: 12px 20px;
	transition: background-color .3s;
}

nav .menu li a:hover,
nav .open-submenu:hover ,
#button:hover,
nav .open-submenu.active,
nav .menu-toggle.active  {
	background: rgba(58,61,66,0.5);
	transition: background-color .5s;
	color: rgba(243,223,40,1);
}

nav .menu ul ul {
	display: none;
	float: none;
}

nav .menu ul ul li {
	float: none;
	border: none;
}

.arrow {
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 10px;
	vertical-align: middle;
}
.arrow.up {
	border-bottom: 5px solid rgba(243,223,40,1);
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
}
.arrow.down {
	border-top: 5px solid rgba(243,223,40,1);
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
}


div#wrapper {
	max-width: 1000px;
	width: 95%;
	margin: 20px auto;
}

div#stylevalto a {
	float: right;
}

div#stylevalto a:first-child {
	display: none;
}

header {
	font-size: 300%;
	font-weight: bold;
	text-shadow: 1px 1px 1px #ccc;
	color: rgba(58,61,66,1);
	font-family: Candara;
	margin: 50px 0 0 0;
	float: left;
}

header span {
	font-size: 150%;
	color: rgba(243,223,40,1);
}

h2 {
	margin: 5px 0 10px 0;
}




section {
	width: 750px;
	float: left;
	margin: 0 20px 0 0;
	padding: 0 20px 0 0;
	border-right: 3px dashed rgba(243,223,40,1);
}

section article {
	margin: 0 0 20px 0;
}

h1 {
	margin: 0 0 30px 0;
	padding: 5px;
	font-size: 150%;
	color: rgba(243,223,40,1);
}

figure {
	padding: 10px;
	background: rgba(58,61,66,0.5);
	margin: 0 0 20px 0;
}

figure img {
	max-width: 100%;
}

figure figcaption {
	font-style: italic;
	font-size: 80%;
	margin: 5px 0 0 0;
}

aside {
	width: 207px;
	float: right;
	font-size: 70%;
}

aside figure {
	background: none;
}

footer {
	width: 960px;
	margin: 20px auto;
	padding: 10px;
	background: rgba(63,71,84,0.5);
	text-align: center;
}







@media(max-width: 1100px)
{
	body p { font-size: 95%; }
	div#wrapper { width: 800px; }
	header { font-size: 320%; }
	section { width: 600px; }
	aside { width: 147px; }
	footer { width: 650px; }
}

@media(max-width: 800px)
{
	body p { font-size: 90%; }
	div#wrapper { width: 600px; }
	header { font-size: 250%; }
	section { width: 400px; }
	aside { width: 147px; }
	footer { width: 450px; }
	h1, h2, h3, h4, h5, h6 { font-size: 90%; }
	#maps { display: none; }

	/* Hamburger menü */
	nav .menu { display: none; clear: both; }
	nav .menu-toggle { display: inline-block; }
	nav .menu > ul { float: left; width: 100%; }
	nav .menu li { width: 100%; border: none; }
	nav .menu ul ul { position: static; background: transparent; }
	nav .menu li:last-child { margin-bottom: 15px; }
	nav .menu ul ul a { background: transparent; }
	nav .menu ul ul a:hover { background: rgba(243,223,40,0.5); }
	nav .menu ul li { border-left: none; }
}

@media(max-width: 580px)
{
	body p { font-size: 85%; }
	div#wrapper { width: 400px; }
	header { font-size: 200%; }
	section { width: 400px; border: 0; margin: 0; padding: 0; }
	aside { display: none; }
	footer { width: 250px; }
	h1, h2, h3, h4, h5, h6 { font-size: 80%; }
}

@media(max-width: 320px)
{
	body p { font-size: 85%; }
	div#wrapper { width: 300px; }
	header { font-size: 150%; }
	section { width: 400px; border: 0; margin: 0; padding: 0; }
	nav { text-align: center; }
	aside , footer { display: none; }
	h1, h2, h3, h4, h5, h6 { font-size: 70%; }
}



















/* GYIK és INFO menüpont */

div.gyik {
	display: none;
	margin: 0 0 10px 10px;
	padding: 5px 15px;
	background: rgba(58,61,66,0.4);
}

h5 {
	margin: 5px 0 0 0;
	cursor: pointer;
	background: rgba(58,61,66,0.8);
	font-size: 100%;
	padding: 10px;
}

h5:first-child {
	margin: 0;
}

h5 span {
	color: red;
}

div.gyik ul,ol li {
	padding: 5px;
	margin: 0 0 0 30px;
}

h3 {
	margin: 10px 0;
}

#video {
	 width: 710px;
	 height: 420px;
}




















/* Nara Shina menüpont */

h4 {
	cursor: pointer;
	margin: 5px 0;
	text-align: center;
	background: rgba(58,61,66,0.8);
	padding: 5px;
}

div.merfold {
	display: none;
	background: rgba(58,61,66,0.4);
}

div.merfold p {
	padding: 3px;
	text-align: center;
}

div.rolam {
	max-width: 500px;
	float: left;
	margin: 40px 0 0 30px;
}

div.ns {
	width: 190px;
	float: left;
	margin: 0 10px 0 0;
}

h3.mer {
	text-align: center;
}

div.rolam p:last-child {
	text-align: right;
	font-style: italic;
}








/* Produkciók menüpont */

#id_kepek {
	margin: 10px 5px 10px 20px;
	float: left;
	max-width: 350px;
}

#id_leiras {
	width: 250px;
	height: 183px;
	margin: 10px 5px 10px 5px;
	background: rgba(58,61,66,0.5);
	float: left;
	padding: 7px;
}

#id_checkbox {
	float: left;
	margin: 10px 20px 10px 5px;
	width: 30px;
	height: 30px;
	box-shadow: 2px 2px 2px #000;
	cursor: pointer;
}

#button {
	font-family: 'Century Gothic', 'Sans-serif', Verdana, Arial;
	color: #fff;
	font-weight: bold;
	padding: 10px;
	border-radius: 10px;
	margin: 10px auto;
	width: 100px;
	font-size: 110%;
	background: rgba(58,61,66,0.5);
	text-align: center;
	cursor: pointer;
}





/* Kapcsolat menüpont */

#maps {
	width: 600px;
	height: 600px;
}





/* Rendelés menüpont */

em {
	color: #FF0000;
}

fieldset {
	padding: 20px;
	width: 300px;
	margin: 0 auto;
	position: relative;
	border: 2px solid rgba(58,61,66,0.5);
	background: rgba(58,61,66,0.2);
}

fieldset legend {
	padding: 0 10px;
	width: 71px;
	top: -11px;
	background: rgba(58,61,66,1);
	border: 1px solid rgba(58,61,66,0.5);
}

fieldset ul li {
	list-style: none;
	padding: 5px 0;
}

#inputmezo {
	max-width: 595px;
	margin: 5px auto;
	box-shadow: 2px 2px 2px #000;
}

#egyedili {
	margin: 10px auto;
}

fieldset ul li table {
	margin: 5px auto;
	width: 600px;
}







/* Internet Explorer */

p#ie {
	color: #fff;
	font-size: 200%;
	margin: 50px auto;
	padding: 5px;
	background-color: red;
}




