/***********************************************************
 * Basics
 ***********************************************************/
body, html { overflow: hidden; margin: 0; padding: 0; width: 100%; height: 100%; background: #f3f9fd; }
.clear { font-size: 1px; line-height: 1px; clear: both; }

#loader { position: absolute; top: 0; left: 0; }
#loader img { width: 1px; height: 1px; }

#bg { position: absolute; left: 0; top: 0; width: 100%; z-index: 1 }

/***********************************************************
 * DIALOG (FROM "Even more rounded corners with CSS: Base stylesheet")
 ***********************************************************/
.dialog {
    font: 14px Trebuchet MS, Verdana, Tahoma, san-serif; position: relative; min-width: 8em; color: #164862; z-index: 100001;
    width: 580px; max-width: 580px; /* based on image dimensions */
    margin-left: 6px; /* default, width of left corner */ }
.dialog * { margin: 0; }
.dialog .content,.dialog .t,.dialog .b,.dialog .b div {
    background: transparent url(../images/editor/kiddle/dialog.png) no-repeat top right; }
.dialog .content { position: relative; background-position: top right;
    padding: 9px 24px 6px 8px; /* empirical */
    zoom: 1; _overflow-y: hidden; }
.dialog .t { /* top+left vertical slice */
    width: 19px; /* top slice width */
    position: absolute; left: 0px; top: 0px; margin-left: -19px; height: 100%;
	_height: 1600px; /* arbitrary long height, IE 6 */
    background-position: top left; }
.dialog .b { /* bottom */
    position: relative; width: 100%; background-position: bottom right; font-size: 1px; line-height: 1px; }
.dialog .b,.dialog .b div { height: 19px; /* height of bottom cap/shade */
    font-size: 1px; }
.dialog .b div { position: relative;
    width: 19px; /* bottom corner width */
    margin-left: -19px; background-position: bottom left; }
.dialog h1 { font: 22px Trebuchet MS, Verdana, Tahoma, san-serif; color: white; padding: 8px 0 12px 0; }
.dialog .buttons { clear: both; }
.dialog p { padding: 3px 0; }

/***********************************************************
 * DIALOG WIDGETS
 ***********************************************************/
.dlgbutton, .dlgbutton span { background: url(../images/editor/kiddle/dlgbutton.png) no-repeat top left;
    border: 0 none; text-decoration: none; color: white; cursor: pointer; text-align: center; font-size: 14px; font-weight: bold; }
.dlgbutton span { background-position: top right; padding-right: 32px; display: block; height: 27px; }
.dlgbutton { line-height: 27px; padding-left: 32px; margin: 8px 0 0 8px;
    display: block; float: right; height: 27px; width: auto; }
.dlgbutton:hover, .dlgbutton:hover span { background-image: url(../images/editor/kiddle/dlgbutton_o.png) }

.dlgbutton.green { background-position: center left; }
.dlgbutton.green span { background-position: center right; }

.dlgbutton.blue { background-position: bottom left; }
.dlgbutton.blue span { background-position: bottom right; }


/***************************************************************************
  ASK INFO PAGE
 ***************************************************************************/
#dlgouter { position: absolute; left: 0; top: 0; z-index: 1000; width: 600px }
#privacyMsg { text-align: center; margin: 20px 35px 0 10px;
    font: 14px/16px Trebuchet MS, Verdana, Tahoma, san-serif;
    font-style: italic; color: #438cb1;
}
.dialog .questions { line-height: 22px; }
.dialog .questions .clear { margin-bottom: 5px; }
.dialog input.dlg { border: 0 none; background: url(../images/editor/kiddle/dlgfield.png) no-repeat top left;
    display: block; float: left; width: 163px; height: 18px; padding: 2px 5px; margin: 0 5px;
    font: 14px/22px Trebuchet MS, Verdana, Tahoma, san-serif; color: #2d96cb }
.dialog input.dlg.small { background-image: url(../images/editor/kiddle/dlgfield_s.png); width: 113px; }
.dialog b { font-weight: normal; float: left; }

input.lined { border: 0 none; border-bottom: 1px solid #2d96cb; padding: 0; background: white; color: #004a80; font-weight: bold; }
.dlg_line span { float: left; }
.dlg_line { clear: both; }
.multi { text-align: right; background: url(../images/editor/kiddle/dlgcheck.png) no-repeat top left; cursor: pointer;
    float: left; display: block; width: 44px; height: 22px; padding: 0 8px 0 0; margin: 0 0 0 5px;
    color: white; font-size: 12px; }
.multi:hover { background-position: bottom left }
.multi.chosen { background-position: top right }
.multi.chosen:hover { background-position: bottom right }

.apply { padding-top: 32px; }

/***************************************************************************
  MAYBE NOT USED?
 ***************************************************************************/
.pagebutton { width: 100px; height: 100px; float: left; position: relative; }
.pageref { position: absolute; left: 20px; top: 10px; border: 1px solid #ccc; margin: 0 auto; }
.pagesize { position: absolute; margin: 0 auto; border: 1px solid #616161; }
.select_marker { left: 70px; top: 70px; position: absolute; z-index: 200; display: none; }
#pagesizes .selected .select_marker { display: block; }
#chooser_container { width: 100%; height: 240px; overflow: auto; border: 1px solid #ccc; }
#chooser_container .icon { margin: 10px 0 0 10px; width: 60px; color: #616161; float: left; text-align: center; padding: 5px; }
#chooser_container .icon img { width: 60px; height: 60px; }
#chooser_container .chosen { background: #00ADEF; color: #fff; }