.sofi_nadpis{font-size:16px;strong;
         }

.sofi_text{font-size:14px;
         }




#sofi_09{
        background: transparent url(../images/sofi_080.jpg) top center no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        }

#sofi_01{
        background: transparent url(../images/sofi_050.jpg) top right no-repeat;
        padding: 0px 450px 0px 0px;
        height: 250px;
        }

#sofi_02{
        background: transparent url(../images/sofi_vykres_010.jpg) top right no-repeat;
        padding: 0px 458px 40px 0px;
        height: 223px;
        }
#sofi_07{
        background: transparent url(../images/sofi_bmb_ulozak.jpg) top left no-repeat;
        padding: 20px 0px 0px 420px;
        height: 250px;
        }

    
#sofi_tabulka { width: 100%;                                                    
                          border: 1px solid black; 
                         
}
#sofi_tabulka td, tr {border: 1px solid black;
                                                             
}  
                          
 #sofi_tabulka {border-collapse:collapse;
}




#sofi_montaz{
        background: transparent url(../images/montaz_bmb_piktogram_text.jpg) top left no-repeat;
        padding: 0px 0px 0px 155px;
        height: 150px;
        }
#sofi_zvysena_nosnost{
        background: transparent url(../images/nosnost_bmb_at_zvysena.jpg) top left no-repeat;
        padding: 0px 0px 0px 155px;
        height: 150px;
        }






















































.nadpis_hl{font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_buk_pr{font-size: 14px;
           padding: 7px;
           margin: 0;}

#buk_jadro {
        background: transparent url(../images/buk_jadro_cink_rez.jpg) top left no-repeat;
        padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }


#buk_jadro_text {float: left;
                    max-width: 600px;
                }
#buk_jadro_obr {float: left;
                    width: 150px;}
.nadpis_hl{font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_dub_pr{font-size: 14px;
           padding: 7px;
           margin: 0;}

#dub_cink {
        background: transparent url(../images/dub_cink_rez.jpg) top left no-repeat;
              padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }


#dub_cink_text {float: left;
                    max-width: 600px;
                }
#dub_cink_obr {float: left;
                    width: 150px;}
#mahagon {
        background: transparent url(../images/masiv_mahagon.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#orech {
        background: transparent url(../images/masiv_tmavy_orech.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#nature {
        background: transparent url(../images/masiv_prirodni_buk.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#nature_vosk {
        background: transparent url(../images/masiv_vosk.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#jablon {
        background: transparent url(../images/masiv_jablon.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#origin {
        background: transparent url(../images/masiv_dub_olej_origin.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#olej_natur {
        background: transparent url(../images/masiv_dub_olej_natur.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#olse {
        background: transparent url(../images/masiv_olse.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#bordo {
        background: transparent url(../images/masiv_bordo.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#kava {
        background: transparent url(../images/masiv_kava.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#white {
        background: transparent url(../images/masiv_bile.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#bleached {
        background: transparent url(../images/masiv_beleny.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#gray {
        background: transparent url(../images/masiv_sedy.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#antracit {
        background: transparent url(../images/masiv_antracit.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#black {
        background: transparent url(../images/masiv_black.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#olej_palisandr {
        background: transparent url(../images/masiv_dub_olej_palisandr.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#olej_wenge {
        background: transparent url(../images/masiv_dub_olej_wenge.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#olej_white {
        background: transparent url(../images/masiv_dub_olej_white.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#olej_beleny {
        background: transparent url(../images/masiv_dub_olej_beleny.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#grafit_buk_masiv {
        background: transparent url(../images/masiv_buk_grafit.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#dekory_20 {
        background: transparent url(../images/dekory_20_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
        
        }
#masiv_bunka {
        background: transparent url(../images/masiv_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
        
        }
#ul_dokup {
        background: transparent url(../images/ulozny_prostor_dokup_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
#strednice_masiv {
        background: transparent url(../images/strednice_masiv_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height:100px;
        width:100px;
        float: left;
        margin: 2px;
        
        }
#rohy {
        background: transparent url(../images/rovne_oble_rohy_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
#vyska_plochy {
        background: transparent url(../images/vyska_volitelna_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
.nadpis_hl_rohy{font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_rohy_pr{font-size: 14px;
           padding: 7px;
           margin: 0;}

#rohy_rovne {
        background: transparent url(../images/bmb_rovne_rohy_css.jpg) top left no-repeat;
        padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }

#rohy_rovne_text {float: left;
                    max-width: 600px;
                }


#rohy_rovne_obr {float: left;
                    width: 150px;}
.nadpis_hl_rohy_oble {font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_rohy_oble {font-size: 14px;
           padding: 7px;
           margin: 0;}

#rohy_oble {
        background: transparent url(../images/bmb_oble_rohy_css.jpg) top left no-repeat;
        padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }

#rohy_oble_text {float: left;
                    max-width: 600px;
                }


#rohy_oble_obr {float: left;
                    width: 150px;}
#nosnost_masiv_1 {
        background: transparent url(../images/nosnost_bmb_standard_masiv_luzko.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
#nosnost_plus {
        background: transparent url(../images/nosnost_180kg_bmb.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
#montaz_snad {
        background: transparent url(../images/montaz_bmb_piktogram_vlastnost.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
#nosnost_masiv_2 {
        background: transparent url(../images/nosnost_bmb_standard_masiv_2l_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
#olej_grafit{
        background: transparent url(../images/ccs_masiv_dubolej_grafit.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }
#dozivotni_zar {
        background: transparent url(../images/zaruka_masivd.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }
.nadpis_zaruka_nekat{font-size: 16px;
           padding: 7px;
           margin: 0;}

.text_zaruka_nekat{font-size: 14px;
           padding: 7px;
           margin: 0;}

#zaruka_nekat {
        background: transparent url(../images/dozivot_bmb_zaruk.jpg) top left no-repeat;
        padding: 20px 0px 0px 155px;
        height: 150px;
        }
.nadpis_hl{font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_buk_pr{font-size: 14px;
           padding: 7px;
           margin: 0;}

#buk_jadro {
        background: transparent url(../images/buk_jadro_cink_rez.jpg) top left no-repeat;
        padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }


#buk_jadro_text {float: left;
                    max-width: 600px;
                }
#buk_jadro_obr {float: left;
                    width: 150px;}.nadpis_hl{font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_dub_pr{font-size: 14px;
           padding: 7px;
           margin: 0;}

#dub_cink {
        background: transparent url(../images/dub_cink_rez.jpg) top left no-repeat;
              padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }


#dub_cink_text {float: left;
                    max-width: 600px;
                }
#dub_cink_obr {float: left;
                    width: 150px;}#mahagon {
        background: transparent url(../images/masiv_mahagon.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#orech {
        background: transparent url(../images/masiv_tmavy_orech.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#nature {
        background: transparent url(../images/masiv_prirodni_buk.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#nature_vosk {
        background: transparent url(../images/masiv_vosk.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#jablon {
        background: transparent url(../images/masiv_jablon.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#origin {
        background: transparent url(../images/masiv_dub_olej_origin.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#olej_natur {
        background: transparent url(../images/masiv_dub_olej_natur.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#olse {
        background: transparent url(../images/masiv_olse.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#bordo {
        background: transparent url(../images/masiv_bordo.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#kava {
        background: transparent url(../images/masiv_kava.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#white {
        background: transparent url(../images/masiv_bile.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#bleached {
        background: transparent url(../images/masiv_beleny.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#gray {
        background: transparent url(../images/masiv_sedy.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#antracit {
        background: transparent url(../images/masiv_antracit.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#black {
        background: transparent url(../images/masiv_black.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#olej_palisandr {
        background: transparent url(../images/masiv_dub_olej_palisandr.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#olej_wenge {
        background: transparent url(../images/masiv_dub_olej_wenge.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#olej_white {
        background: transparent url(../images/masiv_dub_olej_white.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#olej_beleny {
        background: transparent url(../images/masiv_dub_olej_beleny.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#grafit_buk_masiv {
        background: transparent url(../images/masiv_buk_grafit.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#dekory_20 {
        background: transparent url(../images/dekory_20_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
        
        }#masiv_bunka {
        background: transparent url(../images/masiv_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
        
        }#ul_dokup {
        background: transparent url(../images/ulozny_prostor_dokup_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }#strednice_masiv {
        background: transparent url(../images/strednice_masiv_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height:100px;
        width:100px;
        float: left;
        margin: 2px;
        
        }#rohy {
        background: transparent url(../images/rovne_oble_rohy_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }#vyska_plochy {
        background: transparent url(../images/vyska_volitelna_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }.nadpis_hl_rohy{font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_rohy_pr{font-size: 14px;
           padding: 7px;
           margin: 0;}

#rohy_rovne {
        background: transparent url(../images/bmb_rovne_rohy_css.jpg) top left no-repeat;
        padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }

#rohy_rovne_text {float: left;
                    max-width: 600px;
                }


#rohy_rovne_obr {float: left;
                    width: 150px;}.nadpis_hl_rohy_oble {font-size: 15px;
           padding: 7px;
           margin: 0;}

.text_rohy_oble {font-size: 14px;
           padding: 7px;
           margin: 0;}

#rohy_oble {
        background: transparent url(../images/bmb_oble_rohy_css.jpg) top left no-repeat;
        padding: 10px 0px 0px 0px;
        height: 150px;
        width: 150px;
        float: left;
        }

#rohy_oble_text {float: left;
                    max-width: 600px;
                }


#rohy_oble_obr {float: left;
                    width: 150px;}#nosnost_masiv_1 {
        background: transparent url(../images/nosnost_bmb_standard_masiv_luzko.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }#nosnost_plus {
        background: transparent url(../images/nosnost_180kg_bmb.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }#montaz_snad {
        background: transparent url(../images/montaz_bmb_piktogram_vlastnost.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }#nosnost_masiv_2 {
        background: transparent url(../images/nosnost_bmb_standard_masiv_2l_new.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }#olej_grafit{
        background: transparent url(../images/ccs_masiv_dubolej_grafit.jpg) top left no-repeat;
        padding: 100px 0px 0px 0px;
        height: 28px;
        width: 100px;
        float: left;
        margin: 5px;
        text-align: center;
        font-size: 14px;
        font-family: verdana, arial;
        }#dozivotni_zar {
        background: transparent url(../images/zaruka_masivd.jpg) top left no-repeat;
        padding: 0px 0px 0px 0px;
        height: 100px;
        width: 100px;
        float: left;
        margin: 2px;
       
        }.nadpis_zaruka_nekat{font-size: 16px;
           padding: 7px;
           margin: 0;}

.text_zaruka_nekat{font-size: 14px;
           padding: 7px;
           margin: 0;}

#zaruka_nekat {
        background: transparent url(../images/dozivot_bmb_zaruk.jpg) top left no-repeat;
        padding: 20px 0px 0px 155px;
        height: 150px;
        }
#logo_bmb{
        background: transparent url(../images/logobmbsize2.jpg) bottom center no-repeat;
        padding: 0px 0px 0px 0px;
        height: 128px;
		}

/* CSS PRO GALERII NA KLIKNUTÍ */
.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
  visibility: hidden;
  width: auto;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}

.popup .hidden {
  visibility: hidden;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}