/* ------------------------- [      botika RWD starting at w>334 (21em)      ] ------------------------- */


@media screen and (min-width: 25em) { /* ---------------------------------------- w>400 ---------------------------------------- */


.horipad {
	padding: 0 1.5rem;
}
.menutxt {
	position: absolute;
	line-height: 5rem;
	right: 4.5rem;
	display: block;
	font-size: .875rem;
	color: #DFDCDC;
}
.logo img {
	max-width: 17rem;
}

.come-in {
  transform: translateY(100px);
  animation: come-in .8s ease forwards;
}
.come-in:nth-child(odd) {
  animation-duration: .6s;
}
.already-visible {
  transform: translateY(0);
  animation: none;
}
@keyframes come-in {
  to { transform: translateY(0); }
}

}

/* ------------------------------------------------------------------------------ mql=1 ------------------------------------------------------------------------------ */
@media screen and (min-width: 35em) { /* ---------------------------------------- w>560 ---------------------------------------- */

.aftersuper {
	transition: top .4s ease-out;
	top: -12rem;
}
.aftersuper.fixed {
/*	overflow: hidden;*/
	position: fixed;
	width: 100%;
	z-index: 10;
}
.margoa:hover {
	color: #111;
	background-color: #F5F5F5;
}
h1 {
	font-size: 4.5rem;
}

.loader {
	width: 100%;
}
.loader {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	text-align: center;
	vertical-align: top;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #EEE;
	border: 1px solid #CCC;
}
.loader .donut {
	transform: scale(2);
}
img.imgatze {
	width: auto;
}
.agertu {
	opacity: 0;
	transition: all .3s ease-out;
}
.agertu.doit {
	opacity: 1;
}
.etorri {
	opacity: 0;
	transition: opacity .3s ease-out;
	transform: translateY(10px);
}
.etorri.doit {
/*	transform: translateY(0);*/
	opacity: 1;
  animation: etor .3s ease forwards;
}
@keyframes etor {
  to { transform: translateY(0); }
}
.copy ul li:nth-child(2) {
	display: inline-block;
}

.grid-sizer,
.grid-item { width: 48.5%; }
.gutter-sizer { width: 3%; }
.berrilist .grid-item { width: calc(50% - 2rem); }

/* .berrilist .gutter-sizer { width: 3%; } */

/* .masonul, .masonul * {
	outline: orangered 1px solid;
} */
}

/* ------------------------------------------------------------------------------ mql=2 ------------------------------------------------------------------------------ */
@media screen and (min-width: 48em) { /* ---------------------------------------- w>768 ---------------------------------------- */

header {
	padding-bottom: 3rem;
}
.aftersuper {
	padding-top: 3rem;
	/*  background-image: url('../irudi/atzewall.jpg');*/
}
.aftersuper.fixed {
	padding-top: 0;
	box-shadow: 0 0 6px #666;
	background-color: #FFF;
/*  background-image: url('../irudi/atzewall.jpg');*/
}
.aftersuper.fixed .horipad {
/*	padding: 0;*/
}
.logodiv {
/*	max-width: 30vw;*/
	max-width: 100%;
	/* text-align: center; */
	padding-top: 0;
}
a.logo:hover {
	opacity: .75;
}
nav {
	top: auto;
	bottom: auto;
	left: 0;
	display: block;
	position: relative;
	height: auto;
	border: none;
	z-index: auto;
	transition: top 0.25s ease-in-out;
	width: 100%;
	overflow-y: visible;
}
.showhidemenu {
	display: none;
}
.menu {
	display: flex;
	/* justify-content: center; */
}
.menu li {
	top: 0;
/*	flex: 1 1 auto;*/
	opacity: 1;
	padding-left: 0;
	position: relative;
}
.menu li:last-child {
/*	border-right: 1px solid #FFF;*/
}
.menu > li {
	margin-left: 1px;
  color: #666;
  display: block;
  text-align: center;
  text-decoration: none;
  transition: all .1s ease-out;
/*  transform: skew(-15deg);*/
}
.menu > li:hover, .menu > li.nion {
/*  background-position: bottom center;*/
}
.menu > li:hover a {
/*  color: var(--kolorea);*/
}
.menu > li.nion a {
  /* color: #FFF; */
}
.menu > li.nion a {
	font-weight: 400;
}
.menu > li > a {
	color: #111;
	font-size: 1rem;
	line-height: 1;
	padding: 1rem .5rem;
	height:100%;
	/*  transform: skew(15deg);*/
}
.menu li li > a {
	color: #FFF;
	display: block;
	font-size: .975rem;
	background-color: #333;
	border-bottom: 1px solid #111;
	transition: color .2s ease-out;
	padding: .625rem 1rem;
}
.menu li li > a:hover, .menu li li > a.nion {
	background-color: #00668E;
}
.menu li li > a {
	line-height: 1;
}
.navigation .s1menu {
	border-width: 0 1px;
	border-style: solid;
	border-color: #111;
	display: flex;
	justify-content: space-between;
}

button svg, li svg, span > svg {
	fill: var(--kolorea);
}

.hizk li a:not(.nion):hover {
	color: #666;
}
header .hizk {
	position: static;
	padding-top: .9375rem;
	margin-left: 3rem;
	left: auto;
	right: 2rem;
}
header .hizk a {
	color: #333;
	/* height: 2rem; */
	padding: 0 .5rem;
	font-size: 1rem;
	/* display: inline-block; */
	text-align: center;
	line-height: 1.25;
}
header .hizk li a.nion {
	/* color: #cc3380; */
}
h1 {
	font-size: 5rem;
}

.group:after {
  content: none;
  display: table;
  clear: both;
}
a.azpimarra, a .azpimarra {
	position: relative;
}
a.azpimarra:after, a .azpimarra:after {
	content: "";
	position: absolute;
	bottom: .25rem;
	left: 50%;
	width: 0;
	height: 1px;
	background: var(--kolorea);
	background: #AFAFAF;
	transition: ease-out .2s;
	z-index: 0;
}	
a.azpimarrazuri:after, a .azpimarrazuri:after {
	background: #FFF;
}	
a.azpimarra:hover:after, a:hover .azpimarra:after, .nion .azpimarra:after {
	width: 100%;
	left: 0;
}

.azpimarra.bepads {
	padding-bottom: .375rem;
}

footer .belocation.eepad {
	padding-left: .25rem;
}
footer .hizk {
	display: none;
}
footer .horipad > div {
/*	width: 33%;*/
}

.bekoflex, .bekoflex:hover {
	border: none;
}
footer .horipad {
	padding-bottom: 2rem;
}

/*
.grid-sizer,
.grid-item { width: 32%; }
.gutter-sizer { width: 2%; }
*/

}

/* ------------------------------------------------------------------------------ mql=3 ------------------------------------------------------------------------------ */
@media screen and (min-width: 65em) { /* ---------------------------------------- w>1040 ---------------------------------------- */

.horipad {
	max-width: 99rem;
	margin: 0 auto;
}
.aftersuper {
	flex-grow: 1
}
.super {
	width: auto;
	height: auto;
	position: relative;
}
.horipad {
	padding: 0 2.5rem;
}
.gora {
	right: 2.5rem;
}
.aftersuper.fixed {
	top: 0;
}
header .hizk {
	padding-top: .75rem;
}

header .hizk a {
	color: #333;
	padding: .5rem .25rem;
	line-height: 1.1;
}
.super .horipad {
	padding-left: .5rem;
}
.aftersuper > .horipad {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.aftersuper.fixed .horipad {
/*	padding: 0 2.5rem;*/
}
.aftersuper.fixed .logodiv {
	width: 14rem;
	padding-top: 0;
	margin-bottom: 0;
	padding: .0625rem 1rem .0625rem .5rem;
}

.navigation {
	width: auto;
	margin-left: auto;
}
header .hizk {
	margin-top: .6875rem;
}
.menu {
	margin-top: .9375rem;
}
.aftersuper.fixed .menu {
	margin-top: .125rem;
}
.aftersuper.fixed .hizk {
	margin-top: 0;
	padding-top: .625rem;
}
.menu li {
	border-bottom: none;
}
header .hizk li a.nion {
/*
	color: #333;
	background-color: #FFF;
*/
}

.mailandtelhizkordez {
	display: none;
}
.goicontact a {
	color: #c2eeff;
	padding: .675rem 1rem .25rem;
}
.goicontact a .icon.kol2 {
	color: #FFF;
}
.group:after {
  content: "";
  display: table;
  clear: both;
}
.super {
/*
	background-color: #333;
	background-color: rgba(58,66,79,.7);
*/
}
.super .social {
	float: right;
	margin: 0 3rem;
	/* display: inline-block; */
}

.grid-sizer,
.grid-item { width: 32%; }
.gutter-sizer { width: 2%; }
/*.grid-item { margin-bottom: 1.5rem; }*/
.berrilist .grid-item { width: calc(33% - 2rem); }
.berrilist .gutter-sizer { width: 2%; }

}

/* ------------------------------------------------------------------------------ mql=4 ------------------------------------------------------------------------------ */
@media screen and (min-width: 90em) { /* ---------------------------------------- w>1440 ---------------------------------------- */
	
.horipad {
	padding: 0 3.5rem;
}
.gora {
	right: 3.5rem;
}
.grid-sizer,
.grid-item { width: 23.5%; }
/* .gutter-sizer { width: 2%; } */
.berrilist .grid-item { width: calc(25% - 2rem); }
.berrilist .gutter-sizer { width: 2%; }

.menu > li > a {
	/* font-size: 1.25rem; */
}
.navigation {
/*	margin-left: 15rem;*/
}


}
