﻿@media (min-width:320px)  { 
    #trvexpander { font-size: 10px;} 

    .size1 { visibility:visible; }
    .size2 { visibility: hidden; }
    .size3 { visibility: hidden; }
    .size4 { visibility: hidden; }
    .size5 { visibility: hidden; }
    .size6 { visibility: hidden; }

    .lagerplatz {
        height: 70px;
        font-size: 4em;
        width: 70px;
    }

    .modal {
        width: 320px;
    }

        tbody tr {
        font-size: 0.6em;
    }

        
        .rayTabForm input {
            width: 300px;
        }

        .kontaktdetails {
            font-size: 1.4em;
        }

}
@media (min-width:481px)  { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ 
                            #trvexpander { font-size: 10px; } #footer {height: 100px; } .cover { width: 100px; }

    .size1 { visibility:hidden; }
    .size2 { visibility: visible; }
    .size3 { visibility: hidden; }
    .size4 { visibility: hidden; }
    .size5 { visibility: hidden; }
    .size6 { visibility: hidden; }

     .lagerplatz {
        height: 100px;
        font-size: 5em;
        width: 100px;
    }

    tbody tr {
        font-size: 0.6em;
    }

    .modal {
        width: 480px;
    }
    
        .rayTabForm input {
            width: 300px;
        }

.kontaktdetails {
            font-size: 1.4em;
        }
}

@media (min-width:641px)  { 
    /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ 
    #trvexpander { font-size: 16px; } 
    #footer {height: 200px; } 
    .cover { width: 200px; }

        .size1 { visibility:hidden; }
    .size2 { visibility: hidden; }
    .size3 { visibility: visible; }
    .size4 { visibility: hidden; }
    .size5 { visibility: hidden; }
    .size6 { visibility: hidden; }

        .lagerplatz {
        height: 120px;
        font-size: 5em;
        width: 120px;
    }

                tbody tr {
            font-size: 0.8em;
        }

    .modal {
        width: 500px;
    }
    
        .rayTabForm input {
            width: 400px;
        }

        .kontaktdetails {
            font-size: 1.4em;
        }
}

@media (min-width:961px)  { 
    /* tablet, landscape iPad, lo-res laptops ands desktops */ 
    #trvexpander { font-size: 16px; } 
    #footer {height: 200px; } 
                                      
    .cover { width: 200px; }

        .size1 { visibility:hidden; }
    .size2 { visibility: hidden; }
    .size3 { visibility: hidden; }
    .size4 { visibility: visible; }
    .size5 { visibility: hidden; }
    .size6 { visibility: hidden; }

        .lagerplatz {
        height: 90px;
        font-size: 5em;
        width: 90px;
    }

                tbody tr {
            font-size: 0.8em;
        }

    .modal {
        width: 500px;
    }
    
        .rayTabForm input {
            width: 400px;
        }
}


@media (min-width:1025px) { 
    /* big landscape tablets, laptops, and desktops */ 
    #trvexpander { font-size: 14px; } 
    #footer {height: 200px; } 
    .cover { width: 200px; }

        .size1 { visibility:hidden; }
    .size2 { visibility: hidden; }
    .size3 { visibility: hidden; }
    .size4 { visibility: hidden; }
    .size5 { visibility: visible; }
    .size6 { visibility: hidden; }

        .lagerplatz {
        height: 120px;
        font-size: 5em;
        width: 150px;
    }

                tbody tr {
            font-size: 0.8em;
        }

    .modal {
        width: 500px;
    }
    
        .rayTabForm input {
            width: 400px;
        }
}

@media (min-width:1281px) { 
    /* hi-res laptops and desktops */ 
    #trvexpander { font-size: 14px; } 
    #footer {height: 200px; } 
    .cover { width: 200px; }

        .size1 { visibility:hidden; }
    .size2 { visibility: hidden; }
    .size3 { visibility: hidden; }
    .size4 { visibility: hidden; }
    .size5 { visibility: hidden; }
    .size6 { visibility: visible; }

        .lagerplatz {
        height: 90px;
        font-size: 5em;
        width: 90px;
    }
                tbody tr {
            font-size: 0.8em;
        }
    .modal {
        width: 500px;
    }

    
        .rayTabForm input {
            width: 400px;
        }
}



.LITreeLevel1 {
    margin-left: -40px;
    font-weight: bold;
    font-size: 1.4em;
}

.LITreeLevel2 {
    margin-left: -25px;
    font-weight: bold;
    font-size: 0.7em;
}

.LITreeLevel2 li {
    margin-left: -40px;
    margin-bottom: 10px;

}
.regalplatz, .bestnr, .interpret, .titel, .anzahl, .stock {
    

    font-weight: normal;
    display: inline-block;
    margin-right: 10px;

}

.regalplatz {
    font-weight: bold;
    width: 60px;
    color: #ff0000;
}

.bestnr {
    width: 90px;
}

.interpret {
    width: 25%;
    font-weight: normal !important;
    margin-right: 20px;
}

.anzahl {
    width: 25px;
}


.stock {
    width: 40px;
}

.anzahl {
    font-weight: bold;
    color: green;
}

.LITreeLevel3 {
    margin-left: -25px;
    font-weight: normal;
    font-size: 0.7em;
    margin-bottom: 10px;
}
#footer .barcode {

    display: inline-block;
}
.cover {
    
    /*float: right;*/
    display: inline-block;
    vertical-align: baseline;
    
}

#footer {
    
    width: 100%;
}

.notinstock {
    color: red;
}

span.intepret {
    margin-right: 20px;
}

.lagerplatz {
    margin-bottom: 20px;
}

.aendern {

    background-color: #b6ff00;
    color: black;
    border-radius: 7px;
    font-size: 1.4em;
    padding: 10px 10px 10px 10px;
    margin-top: 2px;
    border: solid 1px #126f04;
    width: 200px;
    display: inline-block;
    text-align: center;
}

        .fa-phone {
            font-size: 1.2em;
            margin-left: 10px;
        }

        .zoiper {
            color: red;
        }

        .telephone {
            color: green;
        }

        .tdlabel {
    font-weight: bold;
    padding-right: 50px;
}


