@charset "UTF-8";
/* ===================================
   VENDOR.MIN.CSS - 第三方插件樣式
   生成時間: 2026-01-10
   包含檔案:
   - app/css/app.common.css (522行)
   - css/subsys/atis/colorbox.css (182行)
   =================================== */

@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);

@font-face {
  font-family: MyCustomFont;
  src: local(LiHei Pro), local("Noto Sans TC");
  /* no unicode-range; default to all characters */
}

/* Latin characters 專用 */
@font-face {
  font-family: MyCustomFont; /* 同樣的 font-family */
  unicode-range: U+00-024F;  /* Latin, Latin1 Sup., Ext-A, Ext-B */
  src: local(Helvetica),     /* OS X preferred */
       local(Verdana);       /* Other OS */
}

/* 注音符號專用 */
@font-face {
  font-family: MyCustomFont;      /* 同樣的 font-family */
  unicode-range: U+3100-312F;     /* Bopomofo */
  src: local(LiHei Pro),          /* OS X */
       local("Noto Sans TC"); 	  /* Windows Vista+ */
}

/* 日文假名專用 */
@font-face {
  font-family: MyCustomFont;            /* 同樣的 font-family */
  unicode-range: U+3040-30FF;           /* Hiragana, Katakana */
  src: local(Hiragino Kaku Gothic Pro), /* OS X */
       local(Meiryo);                   /* Windows Vista+ */
}

body, html {
  font-family: MyCustomFont, 'Noto Sans TC', Microsoft JhengHei, 微軟正黑體 !important;
}
/*--------------------------------------------*/
.ui-menu .ui-menu-item{
	font-family: MyCustomFont, 'Noto Sans TC', Microsoft JhengHei, 微軟正黑體; 
}
.ui-widget {
    font-family: MyCustomFont, 'Noto Sans TC', Microsoft JhengHei, 微軟正黑體 ;
    font-size: 0.813rem;
}

.ui-buttonset{
	-webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
}
.ui-contextmenu{
	z-index:99998;
}


/* custom
   ========================================================================== */
/* Layout */
.hide {
	display: none;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

.clear-float {
	clear: both;
}

.text-left {
	text-align: left;
}

.text-right {
	text-align: right;
}

.text-center {
	text-align: center;
}

/* Font weight */
.font-300 {
	font-weight: 300;
}

.font-400 {
	font-weight: 400;
}

.font-600 {
	font-weight: 600;
}

.font-700 {
	font-weight: 700;
}

/* Font colors */
.text-dark {
	color: #555555;
}

.text-purple {
	color: #a696ce;
}

.text-pink {
	color: #db5e8c;
}

.text-yellow {
	color: #fcd76a;
}

.text-green {
	color: #94b86e;
}
/* 必填欄位  */
.required::before {
	content: "*";
}

.required {
	color: red;
}




/*共用底色*/
.mdi-bgL-color-1 {
	background: #edf7fc;
}
.mdi-bgL-color-2 {
	background: #FFF;
}
.mdi-bgS-color-1 {
	background: #7DB9DE;
}

/*按鈕共用*/
.mdi-btn-add {
    color: #238ba6;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #238ba6;
}

.mdi-btn-add:hover,
.mdi-btn-add:focus,
.mdi-btn-add:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #238ba6 0%, #238ba6 100%);
    background-image: -o-linear-gradient(top, #238ba6 0%, #238ba6 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#238ba6), to(#238ba6));
    background-image: linear-gradient(to bottom, #238ba6 0%, #238ba6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#238ba6', endColorstr='#238ba6', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #238ba6;
}

.mdi-btn-modify {
    color: #088c52;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #088c52;
}

.mdi-btn-modify:hover,
.mdi-btn-modify:focus,
.mdi-btn-modify:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #088c52 0%, #088c52 100%);
    background-image: -o-linear-gradient(top, #088c52 0%, #088c52 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#088c52), to(#088c52));
    background-image: linear-gradient(to bottom, #088c52 0%, #088c52 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#088c52', endColorstr='#088c52', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #088c52;
}

.mdi-btn-copy {
    color: #cb4800;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #cb4800;
}

.mdi-btn-copy:hover,
.mdi-btn-copy:focus,
.mdi-btn-copy:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #cb4800 0%, #cb4800 100%);
    background-image: -o-linear-gradient(top, #cb4800 0%, #cb4800 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#cb4800), to(#cb4800));
    background-image: linear-gradient(to bottom, #cb4800 0%, #cb4800 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cb4800', endColorstr='#cb4800', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #cb4800;
}

.mdi-btn-paste {
    color: #cb4800;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #cb4800;
}

.mdi-btn-paste:hover,
.mdi-btn-paste:focus,
.mdi-btn-paste:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #cb4800 0%, #cb4800 100%);
    background-image: -o-linear-gradient(top, #cb4800 0%, #cb4800 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#cb4800), to(#cb4800));
    background-image: linear-gradient(to bottom, #cb4800 0%, #cb4800 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cb4800', endColorstr='#cb4800', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #cb4800;
}

.mdi-btn-delete {
    color: #b21f1f;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #b21f1f;
}

.mdi-btn-delete:hover,
.mdi-btn-delete:focus,
.mdi-btn-delete:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #b21f1f 0%, #b21f1f 100%);
    background-image: -o-linear-gradient(top, #b21f1f 0%, #b21f1f 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#b21f1f), to(#b21f1f));
    background-image: linear-gradient(to bottom, #b21f1f 0%, #b21f1f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b21f1f', endColorstr='#b21f1f', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #b21f1f;
}

.mdi-btn-save {
    color: #088c52;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #088c52;
}

.mdi-btn-save:hover,
.mdi-btn-save:focus,
.mdi-btn-save:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #088c52 0%, #088c52 100%);
    background-image: -o-linear-gradient(top, #088c52 0%, #088c52 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#088c52), to(#088c52));
    background-image: linear-gradient(to bottom, #088c52 0%, #088c52 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#088c52', endColorstr='#088c52', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #088c52;
}

.mdi-btn-view {
    color: #266db6;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #266db6;
}

.mdi-btn-view:hover,
.mdi-btn-view:focus,
.mdi-btn-view:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #266db6 0%, #266db6 100%);
    background-image: -o-linear-gradient(top, #266db6 0%, #266db6 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#266db6), to(#266db6));
    background-image: linear-gradient(to bottom, #266db6 0%, #266db6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#266db6', endColorstr='#266db6', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #266db6;
}

 .mdi-btn-close {
    color: #f64949;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #f64949;
}

.mdi-btn-close:hover,
.mdi-btn-close:focus,
.mdi-btn-close:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #f64949 0%, #f64949 100%);
    background-image: -o-linear-gradient(top, #f64949 0%, #f64949 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f64949), to(#f64949));
    background-image: linear-gradient(to bottom, #f64949 0%, #f64949 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f64949', endColorstr='#f64949', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #f64949;
}

.mdi-btn-print {
    color: #9EAAB3;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #9EAAB3;
}

.mdi-btn-print:hover,
.mdi-btn-print:focus,
.mdi-btn-print:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #9EAAB3 0%, #9EAAB3 100%);
    background-image: -o-linear-gradient(top, #9EAAB3 0%, #9EAAB3 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#9EAAB3), to(#9EAAB3));
    background-image: linear-gradient(to bottom, #9EAAB3 0%, #9EAAB3 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9EAAB3', endColorstr='#9EAAB3', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #9EAAB3;
}

.mdi-btn-trend {
    color: #E8AA43;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #E8AA43;
}

.mdi-btn-trend:hover,
.mdi-btn-trend:focus,
.mdi-btn-trend:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #E8AA43 0%, #E8AA43 100%);
    background-image: -o-linear-gradient(top, #E8AA43 0%, #E8AA43 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#E8AA43), to(#E8AA43));
    background-image: linear-gradient(to bottom, #E8AA43 0%, #E8AA43 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8AA43', endColorstr='#E8AA43', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #E8AA43;
}
.mdi-btn-default {
    color: #008b8b;
	background-image: -webkit-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -o-linear-gradient(top, #FFF 0%, #FFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FFF));
    background-image: linear-gradient(to bottom, #FFF 0%, #FFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #008b8b;
}

.mdi-btn-default:hover,
.mdi-btn-default:focus,
.mdi-btn-default:active {
    color: #fff;
	background-image: -webkit-linear-gradient(top, #008b8b 0%, #008b8b 100%);
    background-image: -o-linear-gradient(top, #008b8b 0%, #008b8b 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#008b8b), to(#008b8b));
    background-image: linear-gradient(to bottom, #008b8b 0%, #008b8b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#008b8b', endColorstr='#008b8b', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    background-repeat: repeat-x;
    border-color: #008b8b;
}



/*tab頁簽顏色統一*/
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
	color: #007898;
/*     被選中的tab較高 */
    height: 41px;
    padding-top: 15px;
    top: 0px;
}
/* 按下去tab的顏色 */
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: #fff;
    color: #007898;
    border-bottom-color: transparent;
}
.nav-tabs > li > a {
    margin-right: 0;
    background: #ffb1b5;
    color: #fff;
    border: 1px solid #ddd;
    /*     沒被選中的tab較低 */
   	line-height: 13px;
    height: 32px;
    top: 8px;
}
.nav-tabs .dropdown-menu {
    margin-top: 7px;
}
.nav-tabs > li.active > .dropdown-menu, .nav-tabs > li.active a:focus .dropdown-menu{
    margin-top: -1px;
}
/* 移上去tab的顏色 */
.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background: #c2c2c2;
}


.mdi-panel-primary {
    border-color: #adc1c7;
}
.mdi-panel-primary > .panel-heading {
    background-image: -webkit-linear-gradient(top, #adc1c7 0%, #adc1c7 100%);
    background-image: -o-linear-gradient(top, #adc1c7 0%, #adc1c7 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#adc1c7), to(#adc1c7));
    background-image: linear-gradient(to bottom, #adc1c7 0%, #adc1c7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
    background-repeat: repeat-x;
}
.mdi-panel-primary > .panel-heading {
    color: #fff;
    background-color: #adc1c7;
    border-color: #adc1c7;
}

.mdi-panel-info {
    border-color: #199bd1;
}
.mdi-panel-info > .panel-heading {
    background-image: -webkit-linear-gradient(top, #199bd1 0%, #199bd1 100%);
    background-image: -o-linear-gradient(top, #199bd1 0%, #199bd1 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#199bd1), to(#199bd1));
    background-image: linear-gradient(to bottom, #199bd1 0%, #199bd1 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#199bd1', endColorstr='#199bd1', GradientType=0);
    background-repeat: repeat-x;
}
.mdi-panel-info > .panel-heading {
    color: #ebfcff;
    background-color: #199bd1;
    border-color: #199bd1;
}

.mdi-panel-warning {
    border-color: #faf2cc;
}
.mdi-panel-warning > .panel-heading {
    background-image: -webkit-linear-gradient(top, #faf2cc 0%, #faf2cc 100%);
    background-image: -o-linear-gradient(top, #faf2cc 0%, #faf2cc 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#faf2cc), to(#faf2cc));
    background-image: linear-gradient(to bottom, #faf2cc 0%, #faf2cc 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#faf2cc', endColorstr='#faf2cc', GradientType=0);
    background-repeat: repeat-x;
}
.mdi-panel-warning > .panel-heading {
    color: #8a6d3b;
    background-color: #faf2cc;
    border-color: #faf2cc;
}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox,
#cboxOverlay,
#cboxWrapper {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    overflow: hidden;
}
#cboxWrapper {
    max-width: none;
}
#cboxOverlay {
    position: fixed;
    width: 100%;
    height: 100%;
}
#cboxMiddleLeft,
#cboxBottomLeft {
    clear: left;
}
#cboxContent {
    position: relative;
}
#cboxLoadedContent {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}
#cboxTitle {
    margin: 0;
}
#cboxLoadingOverlay,
#cboxLoadingGraphic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#cboxPrevious,
#cboxNext,
#cboxClose,
#cboxSlideshow {
    cursor: pointer;
}
.cboxPhoto {
    float: left;
    margin: auto;
    border: 0;
    display: block;
    max-width: none;
    -ms-interpolation-mode: bicubic;
}
.cboxIframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
    padding: 0;
    margin: 0;
}
#colorbox,
#cboxContent,
#cboxLoadedContent {
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay {
    background: #000;
}
#colorbox {
    outline: 0;
}
#cboxContent {
    margin-top: 20px;
    background: #000;
}
.cboxIframe {
    background: #fff;
}
#cboxError {
    padding: 50px;
    border: 1px solid #ccc;
}
#cboxLoadedContent {
    border: 5px solid #000;
    background: #fff;
}
#cboxTitle {
    position: absolute;
    top: -20px;
    left: 0;
    color: #ccc;
}
#cboxCurrent {
    position: absolute;
    top: -20px;
    right: 0px;
    color: #ccc;
}
#cboxLoadingGraphic {
    background: url(images/loading.gif) no-repeat center center;
}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious,
#cboxNext,
#cboxSlideshow,
#cboxClose {
    border: 0;
    padding: 0;
    margin: 0;
    overflow: visible;
    width: auto;
    background: none;
}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active,
#cboxNext:active,
#cboxSlideshow:active,
#cboxClose:active {
    outline: 0;
}

#cboxSlideshow {
    position: absolute;
    top: -20px;
    right: 90px;
    color: #fff;
}
#cboxPrevious {
    position: absolute;
    top: 50%;
    left: 5px;
    margin-top: -32px;
    background: url(images/controls.png) no-repeat top left;
    width: 28px;
    height: 65px;
    text-indent: -9999px;
}
#cboxPrevious:hover {
    background-position: bottom left;
}
#cboxNext {
    position: absolute;
    top: 50%;
    right: 5px;
    margin-top: -32px;
    background: url(images/controls.png) no-repeat top right;
    width: 28px;
    height: 65px;
    text-indent: -9999px;
}
#cboxNext:hover {
    background-position: bottom right;
}
#cboxClose {
    position: absolute;
    top: 5px;
    right: 5px;
    display: block;
    background: url(images/controls.png) no-repeat top center;
    width: 38px;
    height: 19px;
    text-indent: -9999px;
}
#cboxClose:hover {
    background-position: bottom center;
}
