Problemi css tab con firefox

[aldo75]

Salve a tutti, sto cercando di realizzare un css tab. Purtroppo mi sono accorto che con Firefox non lo visualizza bene e mi crea un iframe molto piccolo laterale.
Quando lo metto online si vede il difetto , in lavorazione no.
Vi sarei molto grato se mi risolvete il problema.
Grazie

<style type="text/css">.tab {
position: relative;


}
.tab-painel {
display: inline-block;
min-height: 50px;
}
.tab-painel .tab-open {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
.tab-nav {
border: #CFEBFF solid 1px;
cursor: pointer;
font-size: 14px;
display: inline-block;
padding: 5px 5px;
margin-right: 10px;
height:24px;
width:35px;
}
.tab-open .tab-nav:hover,
.tab-open:checked ~ .tab-nav {
background-color: #CFEBFF;
}
.tab-inner {
opacity: 0;
margin-top: 20px;
position: absolute;
left: 0;
-webkit-transition: opacity 0.1s;
-o-transition: opacity 0.1s;
transition: opacity 0.1s;
visibility: hidden;
}
.tab-open:focus:checked ~ .tab-nav {
outline: thin dotted;
}
.tab-open:checked ~ .tab-inner {
opacity: 100;
visibility: visible;
}
</style>
<div class="tab"> 
<!-- Tab Painel --> 
<div class="tab-painel"> 
<input class="tab-open" id="tab-1" name="tab-wrap-1" type="radio" checked> 
<label class="tab-nav" for="tab-1"><img title="Italiano" src="http://i955.photobucket.com/albums/ae39/crisoro/LEDA/Cartella1/ita_zpsb327c9ea.jpg" ></label> 
<div class="tab-inner"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/wanni/cartella%207/ok1_zpsaeb9acad.jpg" 0"=""> </div> 
</div> 


<div class="tab-painel"> 
<input class="tab-open" id="tab-2" name="tab-wrap-1" type="radio"> 
<label class="tab-nav" for="tab-2"><img src="http://i955.photobucket.com/albums/ae39/crisoro/LEDA/Cartella1/eng_zpsbc3bdbb4.jpg"></label> 
<div class="tab-inner"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/wanni/cartella%207/ok1_zpsaeb9acad.jpg" 0"=""> </div> 
</div> 


<div class="tab-painel"> 
<input class="tab-open" id="tab-3" name="tab-wrap-1" type="radio" > 
<label class="tab-nav" for="tab-3"><img src="http://i955.photobucket.com/albums/ae39/crisoro/LEDA/Cartella1/deu_zpsa06f7264.jpg" ></label> 
<div class="tab-inner"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/wanni/cartella%207/ok1_zpsaeb9acad.jpg" 0"=""></div> 
</div>


<div class="tab-painel"> 
<input class="tab-open" id="tab-4" name="tab-wrap-1" type="radio" > 
<label class="tab-nav" for="tab-4"><img src="http://i955.photobucket.com/albums/ae39/crisoro/LEDA/Cartella1/ola_zps34b18656.png" ></label> 
<div class="tab-inner"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/wanni/cartella%207/ok1_zpsaeb9acad.jpg" 0"=""> </div> 
</div>


<div class="tab-painel"> 
<input class="tab-open" id="tab-5" name="tab-wrap-1" type="radio" > 
<label class="tab-nav" for="tab-5"><img src="http://i955.photobucket.com/albums/ae39/crisoro/LEDA/Cartella1/esp_zpsfed73ed0.jpg" ></label> 
<div class="tab-inner"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/wanni/cartella%207/ok1_zpsaeb9acad.jpg" 0"=""></div> 
</div>


<div class="tab-painel"> 
<input class="tab-open" id="tab-6" name="tab-wrap-1" type="radio" > 
<label class="tab-nav" for="tab-6"><img src="http://i955.photobucket.com/albums/ae39/crisoro/LEDA/Cartella1/fra_zpse3585193.jpg"  ></label> 
<div class="tab-inner"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/wanni/cartella%207/ok1_zpsaeb9acad.jpg" 0"=""> </div> 
</div>


<div class="tab-painel"> 
<input class="tab-open" id="tab-7" name="tab-wrap-1" type="radio" > 
<label class="tab-nav" for="tab-7"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/LEDA/Cartella1/polonia_zps15c8cbbf.jpg" ></label> 
<div class="tab-inner"> <img src="http://i955.photobucket.com/albums/ae39/crisoro/wanni/cartella%207/ok1_zpsaeb9acad.jpg" 0"=""> </div> 
</div>


</div>
</div>


</div></div> 
</div>

[sgogghy]

Potresti postare uno screenshot della versione online?