html, body 
{
    font-size: 14px;
	font-family : Verdana, Arial, Sans-Serif;
	color: #2E2E2E;
	margin: 0;
	padding: 0;
}

/* ------------------------ Input Style ------------------------ */

input[type="submit"],
input[type="button"]
{
    /*background-color: #334151;
    border: solid 1px #E5E4E2;*/
    background-color: #C24641;
    border: solid 2px #D1D0CE;
    color: #FFFFFF;
    height: 25px;
    font-size: 14px;
    font-weight: bold;
}
input[type="submit"]:hover, input[type="button"]:hover { cursor: pointer; background-color: #FFA500; }

input[type="text"], 
input[type="password"]
{
    background-color: #FFFFFF;
    border: solid 1px #848482;
    height: 20px;
}
.input-validate input[type="text"], 
.input-validate input[type="password"]
{
    background-color: #FFD8D5;
    border: solid 1px #C11B17;
    height: 20px;
}

input[type="button"]:disabled { background-color: #696969; color: #DCDCDC; cursor: default; }

input[readonly="readonly"]
{
    background-color: #EBEBE4;
}

.input-search { width: 300px; }
.input-date { width: 80px; }
.input-number { width: 40px; text-align: center; }

.input-button-small 
{
    height: 20px !important;
    font-size: 12px !important;
    font-weight: normal !important;
}

.input-button-activator { height: 30px !important; width: 200px !important; }
.input-button-green { background-color: #489040 !important; }
.input-button-green:hover { background-color: #70B868 !important; }
.input-button-red { background-color: #A30A1C !important; }
.input-button-red:hover { background-color: #CB3244 !important; }
.input-button-disabled { background-color: #696969 !important; color: #DCDCDC !important; cursor: default !important; }

.input-global-search 
{
    margin-top: 9px;
    background: none !important;
    border: none !important;
    width: 320px;
}
.input-global-search:focus { outline: 0; }

.input-content-change { background-color: #FF6464 !important; border-color: #FF0000 !important; color: #000000 !important; }

/* ------------------------ End ------------------------ */


/* ------------------------ Text Style ------------------------ */

.text-10px { font-size: 10px; }
.text-11px { font-size: 11px; }
.text-12px { font-size: 12px; }
.text-13px { font-size: 13px; }
.text-14px { font-size: 14px; }

.text-gray { color: #837E7C; }
.text-blue { color: #0000FF; }
.text-green { color: #008000; }
.text-red { color: #FF0000; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-top { vertical-align: top; }
.text-strike { text-decoration:line-through; }
.text-bold { font-weight: bold; }
.text-middle { vertical-align: middle; }

.text-no-result { font-size: 14px; font-style: Italic; font-weight: bold; color: #C11B17; }
.text-extra-info { font-size: 9px; color: #837E7C; }
.text-error { color: #FF0000; font-size: 10px; display: none; }
.text-result { color: #008000; font-size: 10px; display: none; }
.text-info { font-style: italic; color: #837E7C; font-size: 12px; }
.text-title { font-size: 14px; font-style: Italic; font-weight: bold; color: #837E7C; }

/* ------------------------ End ------------------------ */


/* ------------------------ General Style ------------------------ */

.float-left { float: left; }
.float-right { float: right; }
.vertical-center { position: absolute; margin: auto; top: 0; bottom: 0; }
.padding-left-20px { padding-left: 20px; }
.padding-right-20px { padding-right: 20px; }
.padding-top-20px { padding-top: 20px; }
.width-40px { width: 40px; }
.width-80px { width: 80px; }
.width-100px { width: 100px; }
.width-200px { width: 200px; }
.width-500px { width: 500px; }
.width-1000px { width: 1000px !important; }
.width-100pc { width: 100%; }
.width-50pc { width: 50%; }
.height-100vh { height: 100vh; }
.margin-auto { margin: auto; }
.hide { display: none; }
.inline-block { display: inline-block; }
.block { display: block; }

.bg-white { background-color: #FFFFFF !important; }
.hr-line { border: dashed 1px #C0C0BE; }
.spacer { height: 10px; width: 100%; }
.noscroll { overflow: hidden; padding-right: 17px; }

.art-work img { border: solid 2px #D1D0CE; }
.art-work-no-image { border: solid 2px #D1D0CE; width: 250px; height: 250px; display: block; }
.art-work-no-image img { border: none; margin: auto; display: block; margin-top: 100px; }

.loading { color: #008000; }
.clickable-thumb { cursor: pointer; }
.clickable-thumb:hover img { border-color: #2F4F4F !important; }

.white-link a { color: #666362; text-decoration: underline; }
.white-link a:hover { color: #666362; text-decoration: none; }
.white-link a:visited { color: #666362; text-decoration: underline; }

/* ------------------------ End ------------------------ */


/* ------------------------ Line Style ------------------------ */

.line-red { background-color: #CC0000; }
.line-gray { background-color: #DCDCDC; }

.line-10px { height: 10px; width: 100%; }
.line-5px { height: 5px; width: 100%; }

/* ------------------------ End ------------------------ */


/* ------------------------ Header Style ------------------------ */

#divHeader 
{
    background-color: #FFFFFF;
    width: 100%;
    height: 80px;
    position: relative;
}
#divHeader table { width: 100%; height: 80px; margin: 0; padding: 0; }

#divHeaderSeparator  
{
    width: 100%; 
    -moz-box-shadow: 0px 5px 10px #000000;
    -webkit-box-shadow: 0px 5px 10px #000000;
    box-shadow: 0px 5px 10px #000000;
}

/* ------------------------ End ------------------------ */


/* ------------------------ Div Style ------------------------ */

#divMain { width: 100%; }
#divBodyContent { width: 100%; min-height: 500px; }
#divLoginForm { color: #6D7B8D; padding-top: 20px; }
#divLoginForm table { margin: auto; }
#divFooter { width: 100%; }
#divTitle { width: 100%; height: 50px; text-align: left; vertical-align: text-bottom; font-size: 22px; color: #837E7C; }

#divResultContent { width: 100%; text-align: center; }

#div-header { width: 90%; text-align: center; margin: 0 auto; }
#div-content { width: 90%; text-align: center; margin: 0 auto; }
#div-footer { width: 90%; text-align: center; margin: 0 auto; }
#div-hidden-data { display: none; }

#divForwardPaging { float: right; }
#divBackwardPaging { float: left; }

#div-search-header { width: 100%; text-align: center; margin: 0 auto; }
#div-search-content { width: 100%; text-align: center; margin: 0 auto; }
#div-search-footer { width: 100%; text-align: center; margin: 0 auto; }
#div-search-hidden-data { display: none; }

#divSearchContent { width: 100%; text-align: center; }
#divSearchDisplayInfo { width: 50%; text-align: right; float: right; font-style: italic; color: #837E7C; font-size: 12px; }
#divSearchForwardPaging { float: right; }
#divSearchBackwardPaging { float: left; }

/* ------------------------ End ------------------------ */


/* ------------------------ Overlay Style ------------------------ */

#divOverlayLoader,
#divOverlayExtraContent 
{
    display: none;
    position: fixed;
    background-image: url(../img/bg_black_50.png);
    background-repeat: repeat;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

#divOverlayLoader img.img-load 
{
    position: absolute;
}

#divExtraContent
{
    position: absolute;
    background-color: #FFFFFF;
    overflow: auto;
    overflow-x: hidden;
    border: solid 2px #C0C0C0;
}

#divCloseButton
{
    position: absolute;
    width: 24px;
    height: 24px;
}

#div-content-title 
{
    font-size: 14px;
    font-style: Italic;
    font-weight: bold;
    color: #FFFFFF;
    padding: 5px;
    background-color: #C0C0C0;
    text-align: center;
}

/* ------------------------ End ------------------------ */