
/*
Hier will ich euch eigentlich freien Lauf lassen.
Weiter unten seht Ihr allerdings eine komplette thickbox.css mit Kommentaren die bitte zu beachten sind.

Die Position des Titels des Bildes, der Blätter-Funktionen, der Nummerierung der Bilder sowie des Close-Buttons kann per position:absolute; frei bestimmt werden.
Beispiel-Ids für CSS:
#TB_caption = Titel des Bildes
#TB_secondLine = Nummerierung der Bilder
#TB_next = nächstes Bild
#TB_prev = vorhergehendes Bild
#TB_closeWindow = Close-Button für Schließen des Bildes

Firebug hilft da schnell weiter ;-)

Beispiel:
#TB_caption{padding:0;position:absolute;bottom:100%;left:0;margin-bottom:12px;}
#TB_secondLine{position:absolute;top:100%;width:100%;margin:12px auto 0;text-align:center;}
#TB_next {position:absolute;top:100%;right:10px;margin-top:4px;}
#TB_prev {position:absolute;top:100%;left:10px;margin-top:4px;}
#TB_closeWindow{position:absolute;bottom:100%;right:4px;margin-bottom:12px;}
*/

/***** Komplette Beispiel-CSS *****/

#TB_window{
font:12px Arial,Helvetica,sans-serif;
font-weight:bold;
position:fixed;
background:#ffffff;
z-index:1202;
color:#333333;
display:none;
border:4px solid #858585;
border-radius:6px;
text-align:left; 
top:50%;
left:50%;
padding:8px; 
box-shadow:0 0 14px #000, 0 0 8px #767676 inset;} /*** position, top, left mustn't be changed, z-index may be changed only considering other given z-indexes on page ***/

* html #TB_window{
position:absolute;} /*** mustn't be changed ***/

#TB_window img#TB_Image{
display:block;
margin:15px 0 15px 15px;} /*** mustn't be changed ***/

#TB_secondLine{
    bottom: 5px;
    width: 100%;
    text-align: center;
    position: absolute;
    color: #000;
}

#TB_window a:link{
color:#000;}

#TB_window a:visited{
color:#000;}

#TB_window a:hover{
color:#000;}

#TB_window a:active{
color:#000;}

#TB_window a:focus{
color:#000;}

#TB_overlay{
position:fixed;
z-index:1200;
top:0;
left:0;
height:100%;
width:100%;} /*** mustn't be changed ***/

.TB_overlayMacFFBGHack{
background:url(macFFBgHack.png) repeat;} /*** mustn't be changed ***/

.TB_overlayBG{
background-color:#000; 
filter:alpha(opacity=75); 
opacity:.75;}

* html #TB_overlay{
position:absolute;} /*** mustn't be changed ***/

#TB_caption{
    padding: 25px;
    position: absolute;
    bottom: 100%;
    left: 0;
    margin-bottom: -45px;
    color: #000;
}

#TB_closeWindow{
    position: absolute;
    bottom: 100%;
    right: 0px;
    margin-bottom: -21px;
}

#TB_closeAjaxWindow{
padding:5px 0 0 0;
margin-bottom:1px;
text-align:center;
float:right;} /*** float, padding and text-align may be changed considering properties of #TB_ajaxWindowTitle ***/

#TB_closeAjaxWindow a{
text-decoration:none;
font-size:14px;
width:15px;
line-height:15px;
font-family:Arial, Helvetica, sans-serif;
color:#fff !important;
background:#B3B3B3;
padding:3px;
display:block;
font-weight:bold;
text-align:center;
margin-right:5px;
border-radius:50%;
box-shadow:1px 1px 5px #333;}

#TB_closeWindow a{
    text-decoration: none;
    font-size: 18px;
    width: 15px;
    line-height: 14px;
    font-family: Arial, Helvetica, sans-serif;
    color: #000 !important;
    font-weight: bold;
    text-align: center;
    border: 2px #4C4A4A solid;
    border-radius: 4px;
    padding: 1px 5px 0px 5px;
    background-color: #DBDBDB;
}

#TB_closeAjaxWindow a:hover, #TB_closeWindow a:hover {
color:#c00 !important;
box-shadow:1px 1px 2px #333;}

#TB_ajaxWindowTitle{
float:left;
padding:7px 0 5px 10px;
margin-bottom:1px;} /*** only float and padding may be changed considering properties of #TB_title and #TB_closeAjaxWindow ***/ 

#TB_title{
background-color:#e8e8e8;
height:30px;
border:1px solid #fff;
border-radius:6px 6px 0 0;
box-shadow:0 0 6px #767676;} /*** height, border-width mustn't be changed ***/

#TB_ajaxContent{
clear:both;
padding:2px 15px 15px 15px;
overflow:auto;
text-align:left;
line-height:1.4em;} /*** only line-height may be changed ***/

#TB_ajaxContent.TB_modal{
padding:15px;} /*** mustn't be changed ***/

#TB_ajaxContent p{
padding:5px 0 5px 0;}

#TB_load{
position:fixed;
display:none;
height:13px;
width:208px;
z-index:103;
top:50%;
left:50%;
margin:-6px 0 0 -104px;} /*** mustn't be changed ***/

* html #TB_load{
position:absolute;} /*** mustn't be changed ***/

#TB_HideSelect{
z-index:99; 
position:fixed; 
top:0; 
left:0; 
background-color:#fff; 
border:none; 
opacity:0.0; 
height:100%;
 width:100%;} /*** only background may be changed ***/

* html #TB_HideSelect{
position:absolute;} /*** mustn't be changed ***/

#TB_iframeContent{
clear:both;
border:none;
margin-bottom:-4px;
margin-top:4px;} /*** mustn't be changed ***/

#TB_next {
    position: absolute;
    right: -38px;
    top: 37%;
    padding: 60px 8px 60px 8px;
    background-color: #ffffff;
    border: 2px #bfbdbc solid;
    border-radius: 30px;
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
	box-shadow: 0 0 14px #000, 0 0 8px #767676 inset;
}


#TB_prev {
    position: absolute;
    left: -37px;
    top: 37%;
    padding: 60px 8px 60px 8px;
    background-color: #ffffff;
    border: 2px #bfbdbc solid;
    border-radius: 30px;
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
	box-shadow: 0 0 14px #000, 0 0 8px #767676 inset;
}


#TB_next a, #TB_prev a{
font:bold 25px/25px Arial, Helvetica, sans-serif;
text-decoration:none;}

