body
{
background-color:#FFFFFF;
margin:auto;
font-family:tahoma;
min-width:1024px;
max-width:1920px;
}
#menubar {
min-width:1024px;	
width:100%;
background-color:white;
height:80px;
/*max-height:160px;*/
position:absolute;
margin-top:0px;
z-index:1;
-webkit-box-shadow: 0px 4px 17px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    0px 4px 17px 0px rgba(50, 50, 50, 0.75);
box-shadow:         0px 4px 17px 0px rgba(50, 50, 50, 0.75);
}

#menulogo {
text-align:center;
float:left;
width:200px;
height:79px;
margin-left:25px;
margin-right:25px;
}
#menugombok {
position:relative;
margin-top:10px;
min-width:762px;
}
/***************/
.menugomb {
width:78px;
height:50px;
border: solid 1px white;
float:left;
margin-left:2px;
margin-right:2px;
background-color:#DBA901;
text-decoration:none;
color:white;
display:inline-block;
text-indent:0px;
display:inline-block;
color:#ffffff;
font-family:tahoma;
font-size:12px;
font-weight:normal;
font-style:normal;
line-height:48px;
text-align:center;
text-shadow:0px 0px 0px #cd8a15
}
.menugomb:hover {
border: solid 1px #848484;
background-color:#F5DA81;
-webkit-box-shadow: 3px 3px 2px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    3px 3px 2px 0px rgba(50, 50, 50, 0.75);
box-shadow:         3px 3px 2px 0px rgba(50, 50, 50, 0.75);
color:black;
}
.menugomb:active {
position:relative;
top:1px;
}
ul li {
	position:relative;
	display:block;
	}
ul li ul {
 position: absolute;
 left:100%;
 padding:0;
 margin:0;
 top:-2px;
}
 /******************/
 /*
@media only screen and (max-width: 1024px) {
.menugomb {
width:57px;
height:40px;
float:left;
background-color:#DBA901;
text-decoration:none;
color:white;
display:inline-block;
text-indent:0px;
display:inline-block;
color:#ffffff;
font-family:tahoma;
font-size:9px;
font-weight:normal;
font-style:normal;
line-height:38px;
text-align:center;
text-shadow:0px 0px 0px #cd8a15
}
.menugomb:hover {
border: solid 1px #848484;
background-color:#F5DA81;
-webkit-box-shadow: 3px 3px 2px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    3px 3px 2px 0px rgba(50, 50, 50, 0.75);
box-shadow:         3px 3px 2px 0px rgba(50, 50, 50, 0.75);
color:black;
}
.menugomb:active {
position:relative;
top:1px;
}
ul li {
	position:relative;
	display:block;
	}
ul li ul {
 position: absolute;
 left:100%;
 padding:0;
 margin:0;
 top:-1px;
 }
 }
 */
.gomb {
min-width:90px;
min-height:25px;
border: solid 1px white;
margin-left:2px;
margin-right:2px;
background-color:#DBA901;
text-decoration:none;
color:white;
display:inline-block;
text-indent:0px;
color:#ffffff;
font-family:tahoma;
font-size:14px;
font-weight:bold;
font-style:normal;
line-height:19px;
text-align:center;
text-shadow:0px 0px 0px #cd8a15
}
.gomb:hover {
border: solid 1px #848484;
background-color:#F5DA81;
-webkit-box-shadow: 3px 3px 2px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    3px 3px 2px 0px rgba(50, 50, 50, 0.75);
box-shadow:         3px 3px 2px 0px rgba(50, 50, 50, 0.75);
color:black;
}
.gomb:active {
position:relative;
top:1px;
}

#middle{
position:relative;
top:80px;
background-image:url('picture/slide1.jpg');
background-attachment:fixed;
background-size:100%;
border: solid 1px white;
min-height:400px;
}

#menudown {
position:relative;
top:80px;
background-color:#8A4B08;
width:100%;
color:white;
height:200px;
min-width:1024px;
font-size:14px;
/*background-image: url('http://www.wearewebstars.dk/codepen/img/s1.png'), url('http://www.wearewebstars.dk/codepen/img//s2.png'), url('http://www.wearewebstars.dk/codepen/img//s3.png');
-webkit-animation: snow 10s linear infinite;
-moz-animation: snow 10s linear infinite;
-ms-animation: snow 10s linear infinite;
animation: snow 10s linear infinite;
-webkit-box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.8);
-moz-box-shadow:    0px 0px 25px 0px rgba(50, 50, 50, 0.8);
box-shadow:         0px 0px 25px 0px rgba(50, 50, 50, 0.8);*/

}
#menudown1 {
float:left;
width:30%;
margin-left:3%;
}
#menudown2 {
float:left;
width:30%;
margin-left:3%;
text-align:center;
}
#menudown3 {
float:left;
width:30%;
margin-left:3%;
text-align:center;
}
#beltartalom {
margin:1%;
text-align:justify;
}
#kapcsolattabla {
text-align:center;
vertical-align:center;
width:100%;
}
#kapcsolattabla th {
width:14%;
text-align:center;
background-color:white;
background-color:rgba(255, 255, 255, 0.5);
}
#kapcsolattabla td {
width:14%;
text-align:center;
}

#kapcsolatemail,#kapcsolatemail:hover{
color:black;
text-decoration:none;
font-weight:bold;
}
.aktualisdivek {
text-align:center;
float:left;
width:33%;
font-size:22px;
font-weight:bold;
text-shadow: white 0.1em 0.1em 0.2em;
-webkit-font-smoothing: antialiased;
font-family:tahoma;
color:black;
}
.aktualisdivek:hover {
font-size:24px;
}
.aktualisdivek img {
width:240px;
height:240px;
}
.aktualisdivek:hover img {
width:256px;
height:256px;
}
.aktualisdivek2 {
text-align:center;
float:left;
width:50%;
font-size:22px;
font-weight:bold;
text-shadow: white 0.1em 0.1em 0.2em;
-webkit-font-smoothing: antialiased;
font-family:tahoma;
color:black;
}
.aktualisdivek2:hover {
font-size:24px;
}
.aktualisdivek2 img {
width:240px;
height:240px;
}
.aktualisdivek2:hover img {
width:256px;
height:256px;
}

.aktualisdivek3 {
text-align:center;
font-size:22px;
font-weight:bold;
text-shadow: white 0.1em 0.1em 0.2em;
-webkit-font-smoothing: antialiased;
font-family:tahoma;
color:black;
}
/*
.aktualisdivek3:hover {
font-size:24px;
}*/
.aktualisdivek3 img {
width:160px;
height:160px;
}
/*
.aktualisdivek3:hover img {
width:256px;
height:256px;
}*/

#webshoplogo {
height:300px;
opacity:0.9;
}
#webshoplogo:hover {
height:300px;
opacity:1.0;
}

/*Főoldal slide*******************************************/
.content h1 {
	font-size:48px;
	color:#000;
	text-shadow:0px 1px 1px #f4f4f4;
	text-align:center;
	padding:60px 0 30px;	
}

/* LAYOUT */
.container {
	margin:0 auto;
	overflow:hidden;
	width:960px;
}

/* CONTENT SLIDER */
#content-slider {
	width:100%;
	height:360px;
	margin:10px auto 0;
}
/* SLIDER */
#foslider {
	background:#000;
	border:5px solid #eaeaea;
	box-shadow:1px 1px 5px rgba(0,0,0,0.7);
	height:310px;
	width:640px;
	margin:40px auto 0;
	overflow:visible;
	position:relative;
}
#mask {
	overflow:hidden;
	height:310px;
}
#foslider ul {
	margin:0;
	padding:0;
	position:relative;
}
#foslider li {
	width:640px;
	height:310px;
	position:absolute;
	top:-325px;
	list-style:none;
}

#foslider li.firstanimation {
	-moz-animation:cycle 25s linear infinite;	
	-webkit-animation:cycle 25s linear infinite;		
}
#foslider li.secondanimation {
	-moz-animation:cycletwo 25s linear infinite;
	-webkit-animation:cycletwo 25s linear infinite;		
}
#foslider li.thirdanimation {
	-moz-animation:cyclethree 25s linear infinite;
	-webkit-animation:cyclethree 25s linear infinite;		
}
#foslider li.fourthanimation {
	-moz-animation:cyclefour 25s linear infinite;
	-webkit-animation:cyclefour 25s linear infinite;		
}
#foslider li.fifthanimation {
	-moz-animation:cyclefive 25s linear infinite;
	-webkit-animation:cyclefive 25s linear infinite;		
}


#foslider .tooltip {
	background:rgba(0,0,0,0.7);
	width:400px;
	height:60px;
	position:relative;
	bottom:75px;
	left:-420px;
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;  
}
#foslider .tooltip h1 {
	color:#fff;
	font-size:20px;
	font-weight:400;
	line-height:60px;
	padding:0 0 0 20px;
}
#foslider li#first:hover .tooltip, 
#foslider li#second:hover .tooltip, 
#foslider li#third:hover .tooltip, 
#foslider li#fourth:hover .tooltip, 
#foslider li#fifth:hover .tooltip {
	left:0px;
}
#foslider:hover li, 
#foslider:hover .progress-bar {
	-moz-animation-play-state:paused;
	-webkit-animation-play-state:paused;
}

/* PROGRESS BAR */
.progress-bar { 
	position:relative;
	top:-5px;
	width:640px; 
	height:5px;
	background:#000;
	-moz-animation:fullexpand 25s ease-out infinite;
	-webkit-animation:fullexpand 25s ease-out infinite;
}

/* ANIMATION */
@-moz-keyframes cycle {
	0%  { top:0px; }
	4%  { top:0px; } 
	16% { top:0px; opacity:1; z-index:0; } 
	20% { top:325px; opacity:0; z-index:0; } 
	21% { top:-325px; opacity:0; z-index:-1; }
	92% { top:-325px; opacity:0; z-index:0; }
	96% { top:-325px; opacity:0; }
	100%{ top:0px; opacity:1; }
	
}
@-moz-keyframes cycletwo {
	0%  { top:-325px; opacity:0; }
	16% { top:-325px; opacity:0; }
	20% { top:0px; opacity:1; }
	24% { top:0px; opacity:1; } 
	36% { top:0px; opacity:1; z-index:0; } 
	40% { top:325px; opacity:0; z-index:0; }
	41% { top:-325px; opacity:0; z-index:-1; } 
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-moz-keyframes cyclethree {
	0%  { top:-325px; opacity:0; }
	36% { top:-325px; opacity:0; }
	40% { top:0px; opacity:1; }
	44% { top:0px; opacity:1; } 
	56% { top:0px; opacity:1; } 
	60% { top:325px; opacity:0; z-index:0; }
	61% { top:-325px; opacity:0; z-index:-1; } 
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-moz-keyframes cyclefour {
	0%  { top:-325px; opacity:0; }
	56% { top:-325px; opacity:0; }
	60% { top:0px; opacity:1; }
	64% { top:0px; opacity:1; }
	76% { top:0px; opacity:1; z-index:0; }
	80% { top:325px; opacity:0; z-index:0; }
	81% { top:-325px; opacity:0; z-index:-1; }
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-moz-keyframes cyclefive {
	0%  { top:-325px; opacity:0; }
	76% { top:-325px; opacity:0; }
	80% { top:0px; opacity:1; }
	84% { top:0px; opacity:1; }
	96% { top:0px; opacity:1; z-index:0; }
	100%{ top:325px; opacity:0; z-index:0; }
}

@-webkit-keyframes cycle {
	0%  { top:0px; }
	4%  { top:0px; }
	16% { top:0px; opacity:1; z-index:0; } 
	20% { top:325px; opacity:0; z-index:0; }
	21% { top:-325px; opacity:0; z-index:-1; }
	50% { top:-325px; opacity:0; z-index:-1; }
	92% { top:-325px; opacity:0; z-index:0; }
	96% { top:-325px; opacity:0; }
	100%{ top:0px; opacity:1; }
	
}
@-webkit-keyframes cycletwo {
	0%  { top:-325px; opacity:0; }
	16% { top:-325px; opacity:0; }
	20% { top:0px; opacity:1; }
	24% { top:0px; opacity:1; } 
	36% { top:0px; opacity:1; z-index:0; } 
	40% { top:325px; opacity:0; z-index:0; }
	41% { top:-325px; opacity:0; z-index:-1; }  
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-webkit-keyframes cyclethree {
	0%  { top:-325px; opacity:0; }
	36% { top:-325px; opacity:0; }
	40% { top:0px; opacity:1; }
	44% { top:0px; opacity:1; } 
	56% { top:0px; opacity:1; z-index:0; } 
	60% { top:325px; opacity:0; z-index:0; } 
	61% { top:-325px; opacity:0; z-index:-1; }
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-webkit-keyframes cyclefour {
	0%  { top:-325px; opacity:0; }
	56% { top:-325px; opacity:0; }
	60% { top:0px; opacity:1; }
	64% { top:0px; opacity:1; }
	76% { top:0px; opacity:1; z-index:0; }
	80% { top:325px; opacity:0; z-index:0; }
	81% { top:-325px; opacity:0; z-index:-1; }
	100%{ top:-325px; opacity:0; z-index:-1; }
}
@-webkit-keyframes cyclefive {
	0%  { top:-325px; opacity:0; }
	76% { top:-325px; opacity:0; }
	80% { top:0px; opacity:1; }
	84% { top:0px; opacity:1; }
	96% { top:0px; opacity:1; z-index:0; }
	100%{ top:325px; opacity:0; z-index:0; }
}

/* ANIMATION BAR */
@-moz-keyframes fullexpand {
    0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
   16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	
}
@-webkit-keyframes fullexpand {
    0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
    4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
   16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
   17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
   18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }	
}
/*Fő oldal slide vége*/
/*nagybunszöveg anim*/
@-webkit-keyframes nagykunanimbalrol {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes nagykunanimbalrol {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.nagykunanimbalrol {
  -webkit-animation: nagykunanimbalrol 2s;
          animation: nagykunanimbalrol 2s;
}
/*nagybunszöveg anim vége*/
/*#snow{
	background: none;
	font-family: Androgyne;
	background-image: url('http://www.wearewebstars.dk/codepen/img/s1.png'), url('http://www.wearewebstars.dk/codepen/img//s2.png'), url('http://www.wearewebstars.dk/codepen/img//s3.png');
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index:1;

}
@keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-moz-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 400px 1000px, 200px 400px, 100px 300px;}
}
@-webkit-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-ms-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}*/