/* ---------------------------------------------[      botika superstylin'      ]----------------------------------------- */

:root {
	--erabakolorea: #38D430;
	--kol: #ABD03D;
}
.erabakolorea {
	color: var(--erabakolorea);
}
.kol- { color: var(--erabakolorea); }
.kol-over:hover, a:hover .kol-over { color: var(--erabakolorea); }
.boko-, a.boko-:hover, .boko-over:hover, a:hover .boko-over { border-color: var(--erabakolorea); }
.bako-, .bako-over:hover, a:hover .bako-over { background-color: var(--erabakolorea); }

.azpimarra:after, a.azpimarra:after, a .azpimarra:after {
	/* height: 2px; */
	background: var(--erabakolorea);
	background: white;
    left: 50%;
}
.azpimarra:after, a.azpimarra:hover:after, li:not(.nion) a:hover .azpimarra:after {
	left: 0;
}
.overlay {
  background: linear-gradient(45deg, #95C93D, #88d94f);
}

.logo img {
	width: 13rem;
}
.logodiv {
	margin-bottom: 1rem;
}
.erabasize {
    font-size: 2em;
}
header {
    margin-bottom: 2rem;
}
.ata0 header {
    margin-bottom: 0;
}
.ata0 main {
    padding-top: 0;
}
.atzeko {
    position: relative;
	background-image: url('../irudi/atzeko/zero.jpg');
	background-position: center;
	background-size: cover;
}
.ata1 .atzeko { background-image: url('../irudi/atzeko/atze1.jpg'); }
.ata2 .atzeko { background-image: url('../irudi/atzeko/atze2.jpg'); }
.ata3 .atzeko { background-image: url('../irudi/atzeko/atze3.jpg'); }
.ata4 .atzeko { background-image: url('../irudi/atzeko/atze4.jpg'); }
.ata0 .atzeko, .ata7 .atzeko {
    background-image: none;
	background: linear-gradient(45deg, #dcf47f, #88d94f);
}
.ata7 main {
    display: none;
}
.edukiwidth,
.edukiwidthgei {
  padding-left: 1rem;
  padding-right: 1rem;
}
a.menulia span {
    /* background-color: rgba(255,255,255,.5); */
}
.aftersuper:not(.fixed) .logo:hover img {
	opacity: 100;
}

.atzeko {
    min-height: 13rem;
    /* min-height: 35vw; */
    /* height: 100vh; */
    width: 100vw;
}
.ata0 .atzeko {
    min-height: 14vw;
}
.ata7 .atzeko {
    min-height: 50vw;
}
.atzebideo {
    position: absolute;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: -1;
}
.edulist li {
    line-height: 1.375;
}
.edulist.erabalist {
    list-style: none;
    text-indent: 0;
}
.edulist.erabalist li {
    padding-left: 2rem;
    position: relative;
}
.edulist.erabalist li:before {
    /* margin-right: 2rem; */
    content: "\2688";
    color: var(--kol);
    position: absolute;
    left: 0;
}
.bakoerabakiargi {
    background-color: #ebf2d1;
}
.atzeborobil {
    background-image: url('../irudi/borobil.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding: 2.9375rem 0;
}
.f21.jcc, .f31.jcc, .f41.jcc, .f22.jcc, .f32.jcc, .f42.jcc, .f23.jcc, .f33.jcc, .f43.jcc {
    justify-content: center;
}
.apoyos img {
    max-width: 7rem;
}
.proiektul img {
    max-height: 6rem;
}
.box {
    border: 4px solid var(--kol);
    /* border: 4px solid var(--erabakolorea); */
}
.partelist li:not(:last-child) {
    border-bottom: 1px solid #CCC;
}
.partelist li:nth-child(2) {
    margin-top: 1.75rem;
}
.partelist li div {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 14rem;
    margin: auto 2rem;
}
.partelist img {
    margin: 0 auto;
    max-width: 15rem;
}

.grafikoa ul {
    list-style: none;
    text-indent: 0;
}
.grafikoa ul li {
    width: 10rem;
    padding: 2rem;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background-color: white;
    border: 2px solid var(--kol);
}
.grafikoa ul li:hover,
.grafikoa ul li.mouseover {
    /* width: 16rem; */
    color: #FFF;
    background-color: var(--kol);
    z-index: 2;
}
.grafikoa ul li:hover {
}
.boroberdi {
    max-width: 20rem;
    border-radius: 100%;
    padding: 5rem 2rem;
    aspect-ratio: 1/1;
    background-color: var(--kol);
}
.boroberdi:hover {
    background-color: #000;
}
.proiekbuts a {
    display: inline-block;
    text-align: left;
    border-radius: 5rem;
    color: #FFF;
    background-image: url('../irudi/icon/lupa.png');
    background-size: 2rem;
    background-repeat: no-repeat;
    background-position: 1.5rem center;
    padding-left: 4rem;
    background-color: var(--kol);
}
.proiekbuts a.nion {
    background-color: #000;
}
.mediateka li {
    max-width: 20rem;
}
.altxorra a .argitasize {
	background-color: rgba(10,10,10,.85);
	line-height: 1.1;
    padding-top: .75rem;
    height: 5.25rem;
    top: auto;
}
@media screen and (min-aspect-ratio: 16/9) { /* ---------------------------------------- 16/9 ---------------------------------------- */

.atzebideo {
    width: 100%;
}

}
/* ------------------------------------------------------------------------------ mql=1 ------------------------------------------------------------------------------ */
@media screen and (min-width: 31em) { /* ---------------------------------------- w>496 ---------------------------------------- */
    
.logo img {
	width: auto;
}
.atzeko {
    min-height: 35vw;
}
  
}
@media screen and (min-width: 48em) { /* ---------------------------------------- w>768 ---------------------------------------- */
    
    .hizk > li > a {
        font-weight: 600;
    }
    .hizk li a.nion {
        font-weight: 800;
    }
    .menu > li > a {
        color: #000;
        font-weight: 400;
    }
    .menu > li.nion a {
        font-weight: 500;
    }
    .ata0 .hizk > li > a,
    .ata0 .menu > li > a {
        /* color: #FFF; */
    }
    .ata0 .fixed .menu > li > a {
        /* color: #000; */
    }
    
    .grafikoa {
        background-image: url('../irudi/borobilsei.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        padding: 5rem 0;
    }
    .grafikoa ul li {
        width: 13rem;
        padding: 3rem;
        background-color: transparent;
        border: none;
        box-shadow: 5px 5px 50px rgba(0,0,0,.3);
    }
    .circlebox {
        /* min-height: 35rem; */
        display: grid;
        place-items: center;
    }
    .circlebox .etxerdi {
        z-index: 1;
        position: absolute;
        border-radius: 50%;
    }
    .circle-container {
        position: relative;
        /* width: 27.5rem; */
        aspect-ratio: 1/1;
        list-style-type: none;
        /* border: 12px solid var(--kol); */
        border-radius: 50%;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 1fr);
        /* grid-column-gap: 60px; */
        grid-row-gap: 24px;
        place-items: center;
        /* transform: rotate(-90deg); */
        background-color: var(--kol1);
        background: radial-gradient(var(--kol0), #FFF);
        margin: 0 auto;
    }
    .circle-item {
        aspect-ratio: 1/1;
        transition: all .2s ease-out;
    }
    .circle-item:nth-child(2),
    .circle-item:nth-child(4),
    .circle-item:nth-child(6) {
        align-self: flex-start;
    }
    .circle-item:nth-child(2) {
        transform: translateY(-2rem);
    }
    .circle-item:nth-child(5) {
        transform: translateY(2rem);
    }
    .circle-item:nth-child(1),
    .circle-item:nth-child(3),
    .circle-item:nth-child(5) {
        align-self: flex-end;
    }
    .circle-item:nth-child(1) { order: 1; }
    .circle-item:nth-child(2) { order: 2; }
    .circle-item:nth-child(3) { order: 3; }
    .circle-item:nth-child(4) { order: 6; }
    .circle-item:nth-child(5) { order: 5; }
    .circle-item:nth-child(6) { order: 4; }
    
    .circle-item > span {
        width: 10rem;
        /* transform: rotate(90deg); */
    }

    #menu_0 {
        display: none;
    }

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

}
@media screen and (min-width: 75em) { /* ---------------------------------------- w>1200 ---------------------------------------- */

    .ata7 .atzeko {
        min-height: 45rem;
    }
 
}
/* ------------------------------------------------------------------------------ mql=4 ------------------------------------------------------------------------------ */
@media screen and (min-width: 80em) { /* ---------------------------------------- w>1280 ---------------------------------------- */
    
    #menu_0 {
        display: inline-block;
    }
  
}