h2,h3,h4{
        text-align: center;
        }

.anim_filler{
   float: left;
   color: #FFFFFF;
   /*border: 2px solid red; border-width: thin;*/
}


.display_animator{
/*
    position: absolute;
    top: 250px;
    left: 200px;
*/

    float: left; 

    width: 800px;
    /*height:500px;*/
    height: auto;
    /*overflow:auto; */
   /* border: 2px dashed gold; border-width: thin; */
}

.animation_control_panel {	
        float: left;
        width: 660px;
	color:	#3300CC; 
	background:	#9FC1FF;
        border: 2px solid blue; border-width: thin;
        padding-bottom: 0px;
        padding-left: 0px;
        margin-left: 2em;
}

.panel_item{
    text-align:center;
    font-size: .75em;
    float: left;
    border-right: 2px solid white; border-width: thin;
    padding-right: 1px;
    margin-right: 1px;
}

#button_panel{
    width: auto;
    margin-left: auto;
    margin-right: auto;
    display:inline;
}
#frame_slider_panel{
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    height: 50px;
    display:inline;
}

.frame_slider{
}

.slider_item{
    float: left;
    padding: .2em;
}

#slider{
    display:inline;
}
.slider_cell{
    float: left;
    padding-top: .1em;
}

/* This controls the actual Image window beneath the control panel */
.animation_screen{
   /*float: left;*/

    position: absolute;
    /* Moved down to accomodate Note: */
    top: 510px;
    left: 200px;  

    margin-top: 1em;
  /*  height: 500px ; */

    height: auto;
    width: auto;
/*    width: 80%; width calculated dynamically in Animator.pm*/

/*    margin-left: auto;
    margin-right:auto;
    overflow: auto;
    margin-top: .2em;
*/ 
   /* border: 2px solid blue; border-width: thin;  */
}

.anim_button_row{
    float: left;
    width: 700px;
    display:inline;
    padding: .1em;
border: 2px solid blue; border-width: thin;
}

.anim_select_button_row{
    float: left;
    width: 600px;
    height: 1.2em;
    display:inline;
    padding-right: .1em;
   /*border: 2px solid white; border-width: thin; */
}

.anim_button{
    float: left;
}

/* This positioning is why there are several differen XXX_animator.css files
/* Animation Select Images form */
.anim_form{
    /*float: left; */ 
    background:#9FC1FF;
    color: #3300CC;
    position: absolute;
    top: 400px;
    left: 200px; 
    width:620px;
    height:810px;
    padding-top: .5em;
    padding-left: 1em;
    padding-bottom: .1em;
    margin-left: .5em;
    /*z-index: -5;*/ 
    border: 2px solid cyan; border-width: thin;
}

.anim_form_filler{
   float: left;
    width:600px;
    height:900px;
}

/* This filler is for the new Table selection form _css2 */
.anim_form_filler2{
   float: left;
    width:800px;
    height:900px;
  /* border: 2px solid red; border-width: thin;*/ 
}

.mosaic_form{
    float: left;
    background:#9FC1FF;
    color: #3300CC;
    /*position: absolute;*/
    top: 100px;
    left: 130px;
    width:640px;
    height:400px;
    padding-top: .5em;
    padding-left: 1em;
    padding-bottom: 1em;
    margin-left: .5em;
    /*z-index=-5;*/
    border: 2px solid white; border-width: thin;
}

.display_mosaic{
    //float: left;
    text-align: center;
    margin-left: .5em;
    margin-bottom: 1em;
    width:900px;
    /*border: 2px dashed red; border-width: thin;*/
}

.display_mosaic_filler{
    float left;
    width: 100%;
    height: 100%;
    color: #006;
    border: 2px dashed green; border-width: thin;*/ 
}





