/* Setting */

#SolatPanel_H .frame { height:30px; }
#marqueecontainer1 { height: 200px; }	/* Notice Board */

/* jqxWidget   
----------------------------------------------------------*/
.jqx-widget, .jqx-widget-content, .jqx-grid-header, .jqx-grid-cell, .jqx-tree-item-li, .jqx-menu ul, .jqx-listbox, .jqx-button
{ font-size:12px; font-family: 'Open Sans', sans-serif; }          
.jqx-grid-column-header { font-weight:bold; }
.jqx-dropdownlist-content { font-size:12px; font-family: 'Open Sans', sans-serif;}
.jqx-checkbox { font-size:12px; font-family: 'Open Sans', sans-serif; } 
.jqx-tabs-title { font-size:11px; font-family: 'Open Sans', sans-serif; }
.jqx-grid-cell-publication { cursor:pointer; }

/* Style */

html { font-family: arial,helvetica,sans-serif;;  font-size:17px; }
body { -webkit-print-color-adjust: exact; margin:0; padding:0; }
.background1,.background2,.background3 { background-repeat:repeat; background-position:left top; }
h1,h2,h4,h6{ font-weight:bold; margin:0; padding:0; font-family: 'Open Sans', sans-serif; }
h1 { font-size:200%; }
h3 { font-weight:normal; margin:0; padding:0; font-family: 'Open Sans', sans-serif; }
a {text-decoration: none;}
img { border:none; }
table { border-collapse:collapse; } 
.FullWidthStyle {width:100%}
.HiddenControl {display:none}
.CustomScrollbar { height:100%; }

[class*="w-"] { float:left; }
.w-12 { width:12.5%; }
.w-14 { width:14.285%; }
.w-16 { width: 16.66%; }
.w-20 { width: 20%; }
.w-25 { width: 25%; }
.w-30 { width: 30%; }
.w-33 { width: 33.33%; }
.w-40 { width: 40%; }
.w-50 { width: 50%; }
.w-60 { width: 60%; }
.w-70 { width: 70%; }
.w-80 { width: 80%; } 
.w-100 { width: 100%; }
.clearfix { clear:both; } 

h1.pagetitle { margin:15px 0; border-bottom:solid 1px #c3c2c2; padding-bottom:5px; color:#227601; }

.MainPanel { max-width: 1920px; width: 95%; margin:auto; }
/*.MainPanel {
    width: 1000px;
    margin: auto;
}*/

.TopPanel { position:relative; margin:auto; width:100%; background:#238823;
            -moz-box-shadow: 0 0 10px 1px #9e9e9e; 
	        -webkit-box-shadow: 0 0 10px 1px #9e9e9e; 
	        box-shadow: 0 0 10px 1px #9e9e9e;
}
.TopPanel > .container { margin:auto; width:1000px; }
.TopPanel > .container > .left { float:left; width:auto; }
.TopPanel > .container > .right { float:right; padding-left:10px; padding-top:0px; }

#HeaderPanel {
    max-width: 1920px;
    width: 95%;
    margin:auto;
    /*box-shadow: inset 0 50px rgba(255,255,255,0.2), 
                           inset 0 -15px 30px rgba(0,0,0,0.4),
                           0 5px 10px rgba(0,0,0,0.5);*/
}
#HeaderPanel > .container {  }
#HeaderPanel > .container img { width:100%; }

.BannerPanel {
    margin: 0px 0 10px 0;
    position: relative;
    max-width:1920px; width:100%; margin:auto;
}
    
.BannerPanel .container { }

/*.BannerPanel.ImageSlide, .BannerPanel.ImageSlide .slides { width: 1000px; height: 200px; }*/
.PosterPanel.ImageSlide, .PosterPanel.ImageSlide .slides { width: 555px; height: 120px; }

.ImageSlide { position: relative; top: 0px; left: 0px; width: 1000px; height: 200px; }
.ImageSlide .slides { visibility:hidden; cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; }
.ImageSlide .navigator, .ImageSlide .arrowleft, .ImageSlide .arrowright { visibility:hidden; }

.ImageSlide .loading { position: absolute; top: 0px; left: 0px; }
.ImageSlide .loading .background { filter: alpha(opacity=70); opacity: 0.7; position: absolute; display: block; top: 0px; left: 0px; width: 100%; height: 100%; }
.ImageSlide .loading .image { position: absolute; display: block; background: url(images/jssor/loading.gif) no-repeat center center; top: 0px; left: 0px; width: 100%; height: 100%; }


/* Bullet Navigator */
.ImageSlide .jssorb21 { position: absolute; }
.ImageSlide .jssorb21 div, .jssorb21 div:hover, .jssorb21 .av {
    position: absolute;
    /* size of bullet elment */
    width: 19px;
    height: 19px;
    text-align: center;
    line-height: 19px;
    color: white;
    font-size: 12px;
    background: url(images/jssor/b21.png) no-repeat;
    overflow: hidden;
    cursor: pointer;        
}
.ImageSlide .jssorb21 div { background-position: -5px -5px; }
.ImageSlide .jssorb21 div:hover, .jssorb21 .av:hover { background-position: -35px -5px; }
.ImageSlide .jssorb21 .av { background-position: -65px -5px; }
.ImageSlide .jssorb21 .dn, .jssorb21 .dn:hover { background-position: -95px -5px; }

.ImageSlide .jssorb06 { position: absolute; }
.ImageSlide .jssorb06 div, .ImageSlide .jssorb06 div:hover, .ImageSlide .jssorb06 .av {
    position: absolute;
    /* size of bullet elment */
    width: 18px;
    height: 18px;
    background: url(images/jssor/b06.png) no-repeat;
    overflow: hidden;
    cursor: pointer;
}
.ImageSlide .jssorb06 div { background-position: -6px -6px; }
.ImageSlide .jssorb06 div:hover, .ImageSlide .jssorb06 .av:hover { background-position: -36px -6px; }
.ImageSlide .jssorb06 .av { background-position: -66px -6px; }
.ImageSlide .jssorb06 .dn, .ImageSlide .jssorb06 .dn:hover { background-position: -96px -6px; }

                
/* Arrow Navigator */    
.ImageSlide .jssora02l, .ImageSlide .jssora02r {
    display: block;
    position: absolute;
    /* size of arrow element */
    width: 55px;
    height: 55px;
    cursor: pointer;
    background: url(images/jssor/a02.png) no-repeat;
    overflow: hidden;
}
.ImageSlide .jssora02l { background-position: -3px -33px; }
.ImageSlide .jssora02r { background-position: -63px -33px; }
.ImageSlide .jssora02l:hover { background-position: -123px -33px; }
.ImageSlide .jssora02r:hover { background-position: -183px -33px; }
.ImageSlide .jssora02l.jssora02ldn { background-position: -3px -33px; }
.ImageSlide .jssora02r.jssora02rdn { background-position: -63px -33px; }
    
/* Arrow Navigator */
.ImageSlide .jssora21l, .jssora21r {
    display: block;
    position: absolute;
    /* size of arrow element */
    width: 55px;
    height: 55px;
    cursor: pointer;
    background: url(images/jssor/a21.png) center center no-repeat;
    overflow: hidden;
}
.ImageSlide .jssora21l { background-position: -3px -33px; }
.ImageSlide .jssora21r { background-position: -63px -33px; }
.ImageSlide .jssora21l:hover { background-position: -123px -33px; }
.ImageSlide .jssora21r:hover { background-position: -183px -33px; }
.ImageSlide .jssora21l.jssora21ldn { background-position: -243px -33px; }
.ImageSlide .jssora21r.jssora21rdn { background-position: -303px -33px; }



.CenterPanel {
    background: #ffffff;
    padding: 5px 0;
    margin: auto;
    /*border:solid 1px #9e9e9e;
	            -moz-box-shadow: 0 0 5px 1px #9e9e9e; 
	            -webkit-box-shadow: 0 0 5px 1px #9e9e9e; 
	            box-shadow: 0 0 5px 1px #9e9e9e;*/
}

#ContentPanel { float:left; width:100%; }
#ContentPanel.right, #ContentPanel.left { width:79.5%; }
#ContentPanel.left.right { width:59%; }
#ContentPanel > div { padding:0 7px 5px 7px; }
#ContentPanel .ContentPanel-Center { padding:0; }

.BottomPanel {
    margin-top: 10px;
    background: #333333;
}
.BottomPanel .container { padding:8px 0 10px 0; margin:auto; width:1000px;  position: relative;
    }
.BottomPanel a { text-decoration:none; font-weight:bold; color:#9f9f9f; }

.BottomPanel .container:before, .BottomPanel .container:after {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
    top: 10px;
    bottom: 10px;
    left: 0;
    right: 0;
    -moz-border-radius: 100px / 10px;
    border-radius: 100px / 10px;
}

.BottomPanel .container:after {
    right: 10px;
    left: auto;
    -webkit-transform: skew(8deg) rotate(3deg);
    -moz-transform: skew(8deg) rotate(3deg);
    -ms-transform: skew(8deg) rotate(3deg);
    -o-transform: skew(8deg) rotate(3deg);
    transform: skew(8deg) rotate(3deg);
}

#FooterPanel { font-size:100%; color:#fff; text-align:center; padding:10px; background:#ff0066; max-width:1920px; width:100%; margin:auto; }
#FooterPanel > .container {  }
#FooterPanel a { text-decoration:none; color:#9f9f9f;  }
#FooterPanel a:hover { color: #fe6c17; }
#FooterPanel .EditorLink a { color:#f9f68f; text-decoration:none; }
#FooterPanel .EditorLink a:hover { color: #D2CD0B; }

/* ----------------------------	

			Menu 

------------------------------*/

#MainMenu { margin:auto; position:relative; z-index:2000; font-size:102%; }
#MainMenu .container { width:1000px; margin:auto; }
/*#MainMenu .container .left { width: 80%; float:left; }
#MainMenu .container .right { width: 20%; float: right; }*/
#MainMenu .SearchPanel { width:20%; float:right; }
#MainMenu .downarrowclass { font-size:15px; }
#MainMenu .rightarrowclass { font-size:15px; padding-top:5px; }
#MainMenu .ddsmoothmenu {  }
#MainMenu .ddsmoothmenu ul li a{ font-size:100%; display: block; font-weight:bold; padding: 15px 15px; text-decoration: none; cursor:pointer; background-position:2px 10px; background-repeat:no-repeat; }
#MainMenu .ddsmoothmenu ul li a.ImageIcon{ padding-left:25px; }
#MainMenu .ddsmoothmenu ul li a, .ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited { color:#FFFFFF; }
#MainMenu .ddsmoothmenu ul li a.selected { background-color: #ffbf00; }
#MainMenu .ddsmoothmenu ul li a:hover { background-color: #ffbf00; }
#MainMenu .ddsmoothmenu ul li ul li a { padding: 10px 15px; background-color: #f9cf2f; color:#000; border-right:solid 1px #e1a900; filter: Alpha(Opacity=100);}
#MainMenu .ddsmoothmenu ul li ul li a:hover {	color: #666; }
#MainMenu .ddsmoothmenu ul li ul li a.selected { background-image: none; color: #666; }
.ddsmoothmenu-v .downarrowclass { font-size:15px; }
.ddsmoothmenu-v .rightarrowclass { font-size:15px; }
.ddsmoothmenu-v ul li a, .ddsmoothmenu-v ul li a:link, .ddsmoothmenu-v ul li a:visited, .ddsmoothmenu-v ul li a:active { color: #000000; }
.ddsmoothmenu-v ul li a.selected { color:#ffffff; background-color: #60bee4; filter: Alpha(Opacity=95); -moz-opacity: 0.95; opacity: 0.95; }
.ddsmoothmenu-v ul li a:hover { color:#ffffff; background-color: #60bee4; filter: Alpha(Opacity=95); -moz-opacity: 0.95; opacity: 0.95; }
.ddsmoothmenu-v ul li ul li a, .ddsmoothmenu-v ul li ul li a:link, .ddsmoothmenu-v ul li ul li a:visited, .ddsmoothmenu-v ul li ul li a:active { color: #FFFFFF; }
.ddsmoothmenu-v ul li ul li a { background-color: #fe6c17; filter: Alpha(Opacity=97); -moz-opacity: 0.97; opacity: 0.97; border-right:solid 1px #dc5100; }
.ddsmoothmenu-v ul li ul li a:hover { color:#ffffff; background-color: #c24700; filter: Alpha(Opacity=95); -moz-opacity: 0.95; opacity: 0.95; }
.ddsmoothmenu-v ul li ul li a.selected { color:#ffffff;	background-color: #c24700; filter: Alpha(Opacity=95); -moz-opacity: 0.95; opacity: 0.95; }

.background1 #MainMenu { background-color: #238823; }
.background2 #MainMenu { background-color: #d0341b; }
.background3 #MainMenu { background-color: #773507; }
#MainMenu .ddsmoothmenu ul li a.selected { background-color: #f9cf2f; color:#000; }

#MainMenu .ddsmoothmenu ul li a:hover { background-color: #f9cf2f; color:#000; }

#SlickMenu .slicknav_menu { }
#SlickMenu .slicknav_btn { background-color: #ffffff; }
#SlickMenu .slicknav_menu .slicknav_icon-bar { background-color: #272727; }
#SlickMenu ul li a { background-position:0; background-repeat:no-repeat; }
#SlickMenu ul li a.ImageIcon{ padding-left:25px; }  
                                                     
#LeftMenu { float:left; width:20.5%; padding-top:7px}
#RightMenu { float:right; width:20.5%; padding-top:7px}
#FooterMenu { color: #98979c; text-align: left; }
#FooterMenu a { font-size: 100%; text-decoration: none; color: #98979c; }
#FooterMenu a:hover { color: #fff; }
#FooterMenu > .container { margin: auto; text-align: left; }
#FooterMenu > .container > ul { list-style: none; margin: 0; padding: 0; display: inline-table; }
#FooterMenu > .container > ul li { display: inline; background: url('Images/dot.png') right center no-repeat; 
                                   -webkit-background-size: 10px 10px; -moz-background-size: 8px; -o-background-size: 8px;
                                   background-size: 8px; padding: 0 15px 0 1px; }
#FooterMenu > .container > ul li:last-child { background: none; }
#FooterMenu > .container > ul li a { padding-left: 3px; }

#BottomMenu { color:#98979c; text-align:left; }
#BottomMenu > .container .item { width:25%; float:left; }
#BottomMenu > .container .item > .container { padding:5px; width:100%; }
#BottomMenu > .container .item > .container > .title { text-align:left; font-weight:bold; text-transform:uppercase; color:#999; margin-bottom:15px; font-size:120%; }
#BottomMenu > .container .item > .container > .title > span { display:block; border:none; }
.background1 #BottomMenu > .container .item > .container > .title > span {  }
.background2 #BottomMenu > .container .item > .container > .title > span {  }
.background3 #BottomMenu > .container .item > .container > .title > span {  }
#BottomMenu > .container .item > .container > .content > ul { margin: 0; padding: 0; list-style-type: none; }
#BottomMenu > .container .item > .container > .content > ul li { text-align:left; padding:3px 0; font-size:105%; }
#BottomMenu > .container .item > .container > .content > ul li a { font-weight: normal; text-decoration: none; color: #9f9f9f; }
#BottomMenu > .container .item > .container > .content > ul li a:hover { color:#fff; }

#TopMenu { float:left; margin-top:10px; }
#TopMenu > .container { width:  auto; text-align: right; }
#TopMenu > .container > ul { list-style:none; margin:0; padding:0; display: inline-table; }
#TopMenu > .container > ul li { display: block; padding:0 8px 0 8px; float:left; }
#TopMenu > .container > ul li:hover { }
#TopMenu > .container > ul li a { padding:0; padding-left:3px; color:#000; font-size:80%; font-weight:bold; }
#TopMenu > .container > ul li a > img { width:40px; height:auto; display:block; margin:auto; }
#TopMenu > .container > ul li a:hover { color:#fdad37; }

.TabMenu { width:99%; margin:auto; display:none; }
.TabMenu .jqx-tabs { border:none; }
.TabMenu .jqx-tabs-title { font-weight:bold; font-size:120%; padding:15px 10px 15px 10px; }
.TabMenu .jqx-tabs-content { background:#f0eeee; }

#CenterMenu { max-width: 1000px; padding: 0 5px; margin:auto;  clear: both; }

.CenterMenu { width:100%; padding-top:5px; }
.CenterMenu .TabMenu { width:100%; margin:auto; }
.CenterMenu .TabMenu .tabTitle { cursor:pointer;  }
.CenterMenu .TabMenu .tabTitle { margin-left:5px; }
.CenterMenu .TabMenu .jqx-tabs { border:solid 1px #e5e5e5; border-radius:0; }
.CenterMenu .TabMenu .jqx-tabs-header { background:#fd4642; border-radius:0; }
.CenterMenu .TabMenu .jqx-tabs-title { font-weight:bold; padding-left:10px; color:#ffffff; }
.CenterMenu .TabMenu .jqx-tabs-title-selected-top { color:#000000; font-weight:bold; }
.CenterMenu .TabMenu .jqx-tabs-title-hover-top { background-color:#fe6c17; border-color:#cf4f04; }

.background1 .CenterMenu .jqx-tabs-header { background-color: #fd4642; }
.background2 .CenterMenu .jqx-tabs-header { background-color: #40c0cb; }
.background3 .CenterMenu .jqx-tabs-header { background-color: #f69e60; }

.CenterMenu .title a { color:#FFFFFF; font-weight:bold; text-transform: uppercase; text-decoration: none; display: block; padding:0; }

.treeMenu ul { margin:0; padding:5px; list-style: none outside none; }
.treeMenu li a { padding: 0 0 0 22px; line-height: 25px; }
.treeMenu > ul > li > a { color: #3B4C56; display: block; font-weight: normal; position: relative; text-decoration: none; }
.treeMenu li.parent a { cursor:pointer; }
.treeMenu li a:before { cursor:pointer; background-repeat:no-repeat; background-image: url("Images/Theme.png"); background-position:-194px -36px;    
                        content: ""; display: block; height: 18px; left: 0; position: absolute; top: 2px; vertical-align: middle; width: 18px; }
.treeMenu li.parent > a:before { background-position:-194px 0px; }
.treeMenu ul li.active > a:before { background-position:-194px -18px;}
.treeMenu ul li ul { border-left: 1px solid #D9DADB; display: none; margin: 0 0 0 12px; overflow: hidden; padding: 0 0 0 12px; }
.treeMenu ul li ul li { position: relative; }
.treeMenu ul li ul li:before { border-bottom: 1px dashed #E2E2E3; content: ""; left: -20px; position: absolute; top: 12px; width: 15px; }

/* ----------------------------

			Dock 

------------------------------*/

.DockMenu { visibility:hidden; z-index:3000; }
.DockMenu.left { position: fixed; top: 100px; left: 5px; }
.DockMenu.right { position: fixed; top: 100px; right: 5px; }
.DockMenu ul { list-style: none; padding:0; margin:0; }
.DockMenu .jqDock { position: relative; bottom: 48px; }
.DockMenu .jqDock li { list-style: none; }
.DockMenu .jqDockLabel { background: #333; color: #fff; padding: 3px 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }

/* ----------------------------

			Content 

------------------------------*/

.ContentContainer { }
.ContentContainer .Content {}
.ContentContainer .TitleBar .TitleContent { text-align: center; font-weight: bold; text-transform: uppercase; color: #0000FF; padding-bottom: 5px; }
.ContentContainer .TitleBar .TopIcon {}
.ContentContainer .TitleBar .BottomIcon { display:none; background:url('Images/Theme.png') no-repeat 0 -126px; width:370px; height:15px; margin:auto; }


/* ----------------------------

			Box

------------------------------*/

.BoxPanel { width: 100%; min-height:14px; margin:auto; margin-bottom:10px; position:relative; }
.BoxPanel .BoxPanel-Title { text-align:center;                                             
                             padding: 10px 0px 10px 0px; text-align:left; display:block; border-bottom:1px solid #cfcfcf; }
.BoxPanel .BoxPanel-Title a { font-size:125%; color:#333; font-weight:bold; text-transform: uppercase; text-decoration: none; display: block; padding:0; }
.BoxPanel .BoxPanel-Title a:hover { }
.BoxPanel .active { }
.BoxPanel .BoxPanel-Container {}

.BoxPanel.NoTitle { }
.BoxPanel .BoxPanel-Content.NoTitle { padding-top:0; }

.BoxPanel .BoxPanel-Content{ padding-top:0; }
.BoxPanel .BoxPanel-Component{ padding:3px; }
.BoxPanel .BoxPanel-WidgetBoard { padding:3px; }
.BoxPanel .BoxPanel-Disabled { display:none; }

.background1 .BoxPanel-Title {  }
.background2 .BoxPanel-Title {  }
.background3 .BoxPanel-Title {  }                             
                               
#CenterMenu .BoxPanel { }
#CenterMenu .BoxPanel .BoxPanel-Content { margin:0; padding:0; }
#CenterMenu .BoxPanel .BoxPanel-Container { }

#LeftMenu .BoxPanel { width:98%; }
#LeftMenu .BoxPanel .BoxPanel-Title { }
#LeftMenu .BoxPanel .BoxPanel-Design-Left { }
#LeftMenu .BoxPanel .BoxPanel-Design-Right { display:none; }

#RightMenu .BoxPanel { width:98%; }
#RightMenu .BoxPanel .BoxPanel-Title { }
#RightMenu .BoxPanel .BoxPanel-Design-Left { }
#RightMenu .BoxPanel .BoxPanel-Design-Right { display:none; }

/* ----------------------------

	     Box Container 

------------------------------*/
.BoxContainer { }
.BoxContainer .item { }
.BoxContainer .group { float:left; }
.BoxContainer .row { float:left; }
.BoxContainer .row > .container { padding:5px; }
.BoxContainer .row > .container > div { border-radius:5px; display:block; padding:10px 20px; }
.BoxContainer .row > .container > div p {}

.background1 .BoxContainer .row .BoxPanel { margin:0; }
.background1 .BoxContainer .row .BoxPanel .BoxPanel-Title { }
.background2 .BoxContainer .row .BoxPanel .BoxPanel-Title { }
.background3 .BoxContainer .row .BoxPanel .BoxPanel-Title { }

/* ----------------------------

	     Sitemap 

------------------------------*/

#SitemapPanel { font-weight:bold; color:#000000; }
#SitemapPanel .SitemapPanel-Link a { font-weight:bold; color:#000000; }
#SitemapPanel .SitemapPanel-Link  a:hover { color:#CC3333; }
#SitemapPanel .SitemapPanel-Container { }
#SitemapPanel .SitemapPanel-Link { float:left;}
#SitemapPanel .SitemapPanel-Next { float:left; padding:0 4px; }
#SitemapPanel .home { font-size:16px; float:left; color:#000000; }
#SitemapPanel .navigator { font-size:15px; color:#363636; }

/* ----------------------------

	     Toolbar 

------------------------------*/

#ToolbarPanel { padding:0px 0; color:#ffffff; background-color: #BDBDBD; z-index: 3002; display:none; }
#ToolbarPanel > .container { }
#ToolbarPanel .container > .title { display:block; background:#f7f7f7; font-size:90%; color:#000000; font-weight:bold; border-top:solid 1px #dddddd; border-bottom:solid 1px #dddddd; padding:5px 10px; }
#ToolbarPanel .container > div { padding:5px; }
.left-shadow-overlay{ box-shadow: 10px 0 15px 10px #585858; }
#ToolbarPanel .separator { background-color: #2E2E2E; padding: 10px; margin: 0; font-size:150%; font-weight:bold; text-transform:uppercase; }
#ToolbarPanel .separator i { font-size:30px; }
#ToolbarPanel .handle { background-color: #2E2E2E; left: -40px; padding: 10px; position: absolute; top: 0px; width: 20px; cursor: pointer;}
#ToolbarPanel .handle span.fa { color:#fd4642; font-size:25px; }
#ToolbarPanel .handle span.fa:hover { color:#fe6c17; }

#ToolbarPanel ul { list-style:none; margin:0; padding:0px; }
#ToolbarPanel ul li { float:left; padding:3px; }

#ToolbarPanel a.w3c-font1 { font-size:13px; font-weight:bold; display:block; padding:5px 5px 0 5px; color: #424242; }
#ToolbarPanel a.w3c-font2 { font-size:17px; font-weight:bold; display:block; padding:3px 5px 0 5px; color: #424242;}
#ToolbarPanel a.w3c-font3 { font-size:22px; font-weight:bold; display:block; padding:0 5px 0 5px; color: #424242; }
#ToolbarPanel a.w3c-background1 { background:#444547; width:20px; height:18px; display:block; border:solid 1px #ffffff; }
#ToolbarPanel a.w3c-background2 { background:#d0341b; width:20px; height:18px; display:block; border:solid 1px #ffffff; }
#ToolbarPanel a.w3c-background3 { background:#773507; width:20px; height:18px; display:block; border:solid 1px #ffffff; }
#ToolbarPanel a.w3c-background { margin:0 1px; }
#ToolbarPanel a.w3c-background > span { display:none; }
#ToolbarPanel a.w3c-color { position:relative; width:20px; height:20px; display:block; }
#ToolbarPanel a.w3c-color > span { display:none; }
#ToolbarPanel a.w3c-color i { font-size:20px; position:absolute; display:block; }
#ToolbarPanel a.w3c-color i.line { color:#ffffff; }
#ToolbarPanel a.w3c-color i.shape { font-size:18px; top:1px; left:1px; }
#ToolbarPanel a.w3c-color1 i.shape { color:#000000; }
#ToolbarPanel a.w3c-color2 i.shape { color:#ff0000; }
#ToolbarPanel a.w3c-color3 i.shape { color:#0000ff; }
#ToolbarPanel a.w3c-color4 i.shape { color:#00ff00; }
#ToolbarPanel a.w3c-fontType1,
#ToolbarPanel a.w3c-fontType2,
#ToolbarPanel a.w3c-fontType3 { color:#000000; font-weight:bold; padding:0 7px; }
#ToolbarPanel a.w3c-language { font-size:11px; text-transform:uppercase; color:#ffffff; font-weight:bold; padding:5px; background:#575757; -webkit-box-shadow: 0 8px 6px -6px #000000; -moz-box-shadow: 0 8px 6px -6px #000000; box-shadow: 0 8px 6px -6px #000000;}
#ToolbarPanel .container.language li { padding:10px 3px; }

/* ----------------------------

	    Message Board 

------------------------------*/

.MessagePanel { margin:auto; overflow:hidden; position:relative; padding:5px; height:103px; }
.BoardPanel { width:100%; margin-top:30px; }
.BoardPanel table { width:100%; padding:0; margin:0; }
.BoardPanel table .left {
    background: url('/userfiles/files/Photo/Design/text-box-left.png') no-repeat;
    width: 127px;
    height: 103px;
}
.BoardPanel table .center {
    background: url('/userfiles/files/Photo/Design/text-box-center.png') repeat-x;
}
.BoardPanel table .right {
    background: url('/userfiles/files/Photo/Design/text-box-right.png') no-repeat;
    width: 57px;
}
.BoardPanel .contact-container { position:relative; }
.BoardPanel img { width:150px; height:auto; position:absolute; top:-100px; right:0; }

.MessagePanel ul.marquee {
	/* required styles */
	display: block;
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
	position: relative;
	overflow: hidden;

	/* optional styles for appearance */	
	height: 22px; /* height should be included to reserve visual space for the marquee */		
	margin:auto;		
}
.MessagePanel ul.marquee li {
	/* required styles */
	position: absolute;
	top: -999em;
	left: 0;
	display: block;
	white-space: nowrap; /* keep all text on a single line */

	/* optional styles for appearance */	
	padding: 3px 5px;
	font-weight:bold;
}

/* ----------------------------

	    Notice Board 

------------------------------*/

#marqueecontainer1 { visibility:hidden; position: relative; overflow: hidden; text-align:left; }
.marqueeBox {}
.marqueeBox #vmarquee1 { position: absolute; left: 0px; width:100%; }
.marqueeBox ul { list-style:none; margin:0; padding:0; }
.marqueeBox ul li div.content { border-bottom:solid 1px #b7b7b7; padding-bottom:10px; margin-bottom:10px; }
.marqueeBox ul li:last-child div.content { border:none; } 

/* ----------------------------

	    Announcement

------------------------------*/

.AnnouncementPanel .royalSlider { width:100%; visibility:hidden; }
.AnnouncementPanel .rsVideoFrameHolder { background:#ffffff; }
.AnnouncementPanel .rsTextSlide .CustomScrollbar .content { padding:5px; }
    
/* ----------------------------

	    Procurement

------------------------------*/

.ProcurementPanel > .noProcurement { }
.ProcurementPanel > .title a { font-weight:bold; text-decoration:none; color:#000; }
.ProcurementPanel > .title a:hover { color:#124e75; }
.ProcurementPanel > .procurementType { margin-top:10px; }
.ProcurementPanel > .procurementType .label { font-weight:bold; color:blue; }
.ProcurementPanel > .closeDate { }
.ProcurementPanel > .closeDate .label { font-weight:bold; color:blue; }
.ProcurementPanel > .link { text-align:right; padding:10px 5px; }
.ProcurementPanel > .link a { padding:5px; font-weight:bold; color:#ffffff; background-color:#04263c; text-align:center; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; }
.ProcurementPanel > .link a:hover { background:#124e75; }

/* ----------------------------

	     Weather 

------------------------------*/

#WeatherPanel { display:block; overflow:hidden; width:195px; margin:auto; }
.weatherFeed { width: 195px; }
.weatherItem { padding: 0.8em; text-align: right; }
.weatherCity { text-transform: uppercase; }
.weatherTemp { font-size: 2.8em; font-weight: bold; }
.weatherDesc, .weatherCity, .weatherForecastDay  { font-weight: bold; }
.weatherDesc { margin-bottom: 0.4em; }
.weatherRange, .weatherWind, .weatherLink, .weatherForecastItem { font-size: 0.8em; }
.weatherLink, .weatherForecastItem { margin-top: 0.5em; text-align: left; }
.weatherForecastItem { padding: 0.5em 0.5em 0.5em 80px; background-color: #fff; background-position: left center; color:#000000; }
.weatherForecastDay { font-size: 1.1em; }
.odd { background-color: #e8e8fc; }
.even { background-color: #d4d4e8; }
.day { background-color: #e8e8f2; }
.day a { color: #555; }
.night { background-color: #2a2a33; color: #eaeaf0; }
.night a:hover { color: #fff; }

/* ----------------------------

	     Poll 

------------------------------*/

.PollPanel { padding:0 3px; }
.PollPanel .title { padding-top:5px; padding-bottom:5px; text-align:center; font-weight:bold; }
.PollPanel .content { width:120px; margin:5px auto 0 auto; }
.PollPanel .button { width:175px; padding:5px 0; margin:auto; padding-left:1px; }
.PollPanel .button .ButtonSubmit { width:83px; }
.PollPanel .button .ButtonResult { width:83px; }
.PollPanel .notification { text-align:center; color:#ff0000; font-weight:bold; padding:5px 0; }
.PollPanel .PanelPollType { font-weight:bold; padding:2px 0; margin:auto; width:185px; }
.PollPanel > .PanelPollType .jqx-button { font-weight:bold; font-size:9px; padding:5px; cursor:pointer; }
.PollPanel.expired .content, .PollPanel.comingsoon .content,
.PollPanel.expired .button, .PollPanel.comingsoon .button { display:none; }
.PollPanel .chart { min-height:300px; display:none; }

.PanelPoll {}
.PanelPoll > .question { text-align:center; font-size:130%; font-weight:bold; margin-bottom:10px; }

/* ----------------------------

	     Public Login 

------------------------------*/

#LoginPanel { font-weight:bold; width:180px; margin:auto; padding:5px; }
#LoginPanel .LoginPanel-Username { margin-bottom:5px; }
#LoginPanel > .LoginPanel-Username > .title { display:none; }
#LoginPanel .LoginPanel-Username > input { width:175px; }
#LoginPanel .LoginPanel-Password { margin-bottom:5px; }
#LoginPanel > .LoginPanel-Password > .title { display:none; }
#LoginPanel .LoginPanel-Password > input { width:175px; }
#LoginPanel .LoginPanel-Button { text-align:right; padding-bottom:3px; }
#LoginPanel input.marked, textarea.marked { color: #999; }
#LoginPanel > .LoginPanel-Username input[type=text], 
#LoginPanel > .LoginPanel-Password input[type=password] { width:170px; }
#LoginPanel .watermark { color: #999 !important; width:170px; }
#LoginPanel .jqx-checkbox { font-size:10px; font-weight:bold; } 

#LoginPanel .button { display:block; float:left; cursor:pointer; }

#AccountPanel > .ButtonContainer { background:#dedede; border:solid 1px #b1b1b1; padding:0 0 5px 7px; border-radius:10px; width:115px; margin:auto; }    
#AccountPanel > .ButtonContainer > .Container a { float:left; cursor:pointer; }

/* ----------------------------

	     Counter 

------------------------------*/

#CounterPanel { padding:5px 5px 7px 5px; }
#CounterPanel .tbCounterPanel { margin:auto; }
#CounterPanel .CounterPanel-DigitPanel { height:30px; }
#CounterPanel .CounterPanel-Title { text-align:left; font-weight:bold; padding-right:20px; }
#CounterPanel .CounterPanel-Number { text-align:right; }

/* ----------------------------

	     Archive 

------------------------------*/

#ArchivePanel { padding:5px; width:165px; margin:auto; } 
#ArchivePanel .ArchivePanel-Button { cursor:pointer; }
#ArchivePanel .ArchivePanel-Year select { width:60px; }
#ArchivePanel .ArchivePanel-Month select { width:80px; }
#ArchivePanel #btnArchivePanel-Submit { font-size:25px; color:#626262; cursor:pointer; margin-left:5px; }
#ArchivePanel #btnArchivePanel-Submit:hover { color:#288db1; }

/* ----------------------------

	     Newsletter 

------------------------------*/

#NewsletterPanel { width:185px; margin:auto; padding:5px 0; } 
#NewsletterPanel > .Title { font-size:98%; padding-bottom:3px; }
#NewsletterPanel > .Component > #lblMessageNewsletter { color:#ff0000; font-size:95%; padding-bottom:5px; font-weight:bold; }
#NewsletterPanel > .Button { text-align:right; }

/* ----------------------------

	     Solat 

------------------------------*/

#SolatPanel_V { width:190px; margin:5px auto 0 auto; padding-bottom:5px; }
#SolatPanel_V > table { width:90%; margin:auto; }
#SolatPanel_V > table tr > .HeaderTitle { font-weight:bold; text-align:center; padding:10px 0; font-size:110%; }
#SolatPanel_V > table tr > .Title { width:50%; font-weight:bold; text-align:right; padding:2px 10px; }
#SolatPanel_V > table tr > .Time { text-align:left; }

/* ----------------------------

	   Image Scroller 

------------------------------*/

#ImageScroller
{
    position:relative; 	
	padding:0 5px;	
	margin:auto;
	width:1000px;
}
#ImageScroller a.left, #ImageScroller a.right { color:#fd4642; }
#ImageScroller a.right:hover, #ImageScroller a.left:hover { color:#fe6c17; }    
#ImageScroller .scrollable img { margin:10px 20px; }

/* ----------------------------

	     Search 

------------------------------*/

.SearchPanel { padding-top:4px; }
.styleSearchPanel {	padding-left:13px; background:#ffffff; padding:5px; }
.styleSearchPanel .searchLabel { display:none; }
.styleSearchPanel .searchTextBox > input { width:168px; height:38px; margin-right:2px; border:none; }
.styleSearchPanel #SearchPanel-SearchButton { font-size:18px; color:#212121; margin-left:3px; cursor:pointer; }

/* ----------------------------

	     Calendar 

------------------------------*/

.CalendarPanel { width:190px; margin:auto; font-size:10px; position:relative; left:-1px; padding-bottom:2px; line-height:10px; letter-spacing:0; }
.CalendarEvent a { background-color: #42B373 !important; background-image :none !important;  color: #ffffff !important; }

/* ----------------------------

			Icon 

------------------------------*/

.icon-document { display:block; background-image:url('Images/ico_document.png'); background-repeat:no-repeat; }

.icon-download { width:45px; height:45px; } /* Download */
.icon-download-audio { background-position:-200px -115px; }
.icon-download-zip { background-position:-245px -115px; }
.icon-download-ppt { background-position:-290px -115px; }
.icon-download-swf { background-position:-335px -115px; }
.icon-download-video { background-position:-384px 0; }
.icon-download-image { background-position:-384px -45px; }
.icon-download-pdf { background-position:-384px -90px; }
.icon-download-txt { background-position:-384px -135px; }
.icon-download-file { background-position:-429px 0; }
.icon-download-folder { background-position:-429px -45px; }
.icon-download-doc { background-position:-429px -90px; }
.icon-download-xls { background-position:-429px -135px; }

.icon-gallery { width:128px; height:115px; } /* Gallery */
.icon-gallery-folder { background-position:0 0; }
.icon-gallery-video { background-position:-256px 0; }
.icon-gallery-audio { background-position:-128px 0; }

.icon-theme { display:block; background-image:url('Images/Theme.png'); background-repeat:no-repeat;}
.icon-counter { float:left; width:19px; height:25px} /* counter */
.icon-counter-0 { background-position:-0 0}
.icon-counter-1 { background-position:-19px 0 }
.icon-counter-2 { background-position:-38px 0 }
.icon-counter-3 { background-position:-57px 0 }
.icon-counter-4 { background-position:-76px 0 }
.icon-counter-5 { background-position:-95px 0 }
.icon-counter-6 { background-position:-114px 0 }
.icon-counter-7 { background-position:-133px 0 }
.icon-counter-8 { background-position:-152px 0 }
.icon-counter-9 { background-position:-171px 0 }
.icon-login {}
.icon-login-detail { background-position:0 -26px; width:35px; height:35px; }
.icon-login-logout { background-position:-35px -26px; width:35px; height:35px; }
.icon-login-complaint { background-position:-70px -26px; width:35px; height:35px; }
.icon-login-forgot-password { background-position:-105px -26px; width:30px; height:35px; }
.icon-login-account-new { background-position:-135px -26px; width:30px; height:35px; }
.icon-login-forgot-username { background-position:-165px -26px; width:30px; height:35px; }

/* Form */

#PanelForm {}
#PanelForm tr td { padding:2px 0; }
#PanelForm > .container .PanelForm-Title { width:140px; padding-right:5px; }
#PanelForm > .container .PanelForm-Content {}
#PanelForm > .container .PanelForm-Content > .FullWidth { width:100%; }
#PanelForm > .container .PanelForm-Content > .TextBox { width:200px; } 
#PanelForm > .container .PanelForm-Content > .SampleText { font-size:80%; font-style: italic }
#PanelForm > .container .ButtonContainer { margin:20px auto; width:50%; }
#PanelForm > .container .ButtonContainer input[type="button"] { width:48%; margin:0 2px; }
   
#PanelForm > .loading { display:none; }   
#PanelForm > .loading .icon { background:url('Images/6.gif') no-repeat center; height:19px; }
#PanelForm > .loading .label { text-align:center; font-weight:bold; padding:5px; }

#PanelForm .watermark { color:#ffffff; }   
#PanelChart { display:none; position:relative; z-index:10; }

/* Event */
#PanelEvent { }
#PanelEvent li.item { padding:10px 5px; }
#PanelEvent li.item a { color:#000000; }
#PanelEvent li.item .title { font-size:140%; font-weight:bold; padding-bottom:3px; }
#PanelEvent li.item .date { color:#3b3b3b; }
#PanelEvent .info { }
#PanelEvent .info.potrait { float:left; width:50%; }
#PanelEvent .info > .container { padding:5px; }
#PanelEvent .label { font-weight:bold; font-size:110%; padding:10px 0 2px 0; }
#PanelEvent .map { width:100%; height:200px; margin:5px 0; border-radius:10px; -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black; }
#PanelEvent .image { text-align:center; }
#PanelEvent .image.potrait { float:right; width:50%; }
#PanelEvent .image.potrait > .container { padding:0 20px; }
#PanelEvent .image > .container > a > img { max-width:100%; height:auto; }
#PanelEvent .status { font-weight:bold; font-size:130%; }
#PanelEvent .status.open { color:#03a303; }
#PanelEvent .status.close { color:#ff0000; }

#PanelEvent > .filter { margin-bottom:10px; border:solid 1px #cccccc; padding:10px; border-radius:5px; }
#PanelEvent > .filter #txtArchiveFilterBox { padding:0 5px; width:170px; height:20px; }
#PanelEvent > .filter #btnArchiveReset { display:none; }
#PanelEvent > .filter span.label { font-weight:bold; }
#PanelEvent > .filter ul { list-style: none; margin: 0; padding: 0; }
#PanelEvent > .filter ul li { float:left; padding:0 2px; }


.PanelLoginApps { padding-top:50px; }
.PanelLoginApps .ButtonPanel { padding-top:10px; }
.PanelLoginApps .ButtonPanel > .Button { width:100%; padding:10px; font-weight:bold; cursor:pointer; background:#4d90fe; border:none; color:#ffffff; }

.SlidePanel { margin:5px 0; }
.SlidePanel .container { width:573px; height:290px; }
.SlidePanel .container img { width:573px; height:290px; }
.SlidePanel .title { background:#ff0000; margin-bottom:8px; padding: 6px 0px; text-align:center; display:block; 
                            border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;
                            font-size:105%;                            
                            -webkit-box-shadow: 0 8px 6px -6px black;
	                        -moz-box-shadow: 0 8px 6px -6px black;
	                        box-shadow: 0 8px 6px -6px black;	                    
                              background-color: #d42224;
                              /*background: url(images/linear_bg_2.png);
                              background-repeat: repeat-x;*/
                             
                              background-color: #d42224;
                                background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ff0000), to(#d42224));
                                background: -webkit-linear-gradient(top, #720000, #d42224);                             
                                background: -moz-linear-gradient(top, #720000, #d42224);                              
                                background: -ms-linear-gradient(top, #720000, #d42224);                              
                                background: -o-linear-gradient(top, #2F2727, #d42224); }
.SlidePanel .title a { color:#FFFFFF; font-weight:bold; text-transform: uppercase; text-decoration: none; display: block; padding:0; }

/* Bulletin
----------------------------------------------------------*/
.PanelBulletin { padding:5px 0; }
.PanelBulletin ul { list-style: none; margin: 0; padding: 0; }
.PanelBulletin .bulletin { margin-bottom:10px; position:relative; }
.PanelBulletin .bulletin > .top { background-color: #d0341b; padding:5px; margin: 0; }
.PanelBulletin .bulletin > .top > .title { width:100%; font-weight: bold; color: #FFFFFF; cursor:pointer; }
.PanelBulletin .bulletin > .top > .title > a { display:block; font-size:90%; }
.PanelBulletin .bulletin > .container { padding:0px 3px 3px 3px; display:none; }
.PanelBulletin .bulletin > .container > .date { color:#A8A8A8; text-align:right; }
.PanelBulletin .bulletin > .container > .content {}
.PanelBulletin .bulletin > .container > .link { display:none; text-align:right; }
.PanelBulletin .bulletin.more > .container > .link { display:block; }
.PanelBulletin .bulletin > .container > .link a { padding:5px; font-weight:bold; color:#ffffff; background-color:#fe6c17; text-align:center; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; }
.PanelBulletin .bulletin > .right { display:none; }
.PanelBulletin .morelink a { font-size:80%; }

.background2 .PanelBulletin .bulletin > .top { background-color: #3aadb6; } 
.background3 .PanelBulletin .bulletin > .top { background-color: #c57943; } 

#PanelDownload li.item { padding:8px 0; }
#PanelDownload .image { width:50px; float:left; padding-left:5px; }
#PanelDownload .container { width:auto; float:left; }
#PanelDownload .container .title { font-weight:bold; }
#PanelDownload .container .detail { color:#807e7e; padding-top:3px; font-size:90%; letter-spacing:0; line-height:15px }
#PanelDownload .container .detail .date { display:block; padding:0; margin:0; }
#PanelDownload .container .detail .size { display:block; padding:0; margin:0; }
#PanelDownload .icon { width:40px; float:right; padding-top:10px; }
#PanelDownload .icon .download { font-size:30px; color:#266f00; }
#PanelDownload a:link, #PanelDownload a:visited { color:#000000; }

#PanelArchive { }
#PanelArchive li.item { padding:8px 10px; }
#PanelArchive li.item a > .title { font-weight:bold; font-size:120%; color:#000000; }
#PanelArchive li.item a > .date { color:#303030; }
#PanelArchive > .filter { margin-bottom:10px; visibility:hidden; border:solid 1px #cccccc; padding:10px; border-radius:5px; }
#PanelArchive > .filter #txtArchiveFilterBox { padding:0 5px; width:170px; height:20px; }
#PanelArchive > .filter #btnArchiveReset { display:none; }
#PanelArchive > .filter span.label { font-weight:bold; }
#PanelArchive > .filter ul { list-style: none; margin: 0; padding: 0; }
#PanelArchive > .filter ul li { float:left; padding:0 2px; }

#PanelSearch { }
#PanelSearch li.item { padding:8px 10px; }
#PanelSearch li.item a > .title { font-weight:bold; font-size:120%; color:#000000; }
#PanelSearch li.item a > .description { color:#000000; }
#PanelSearch li.item a > .link { color:#0000ff; font-size:95%; }
#PanelSearch > .filter { margin-bottom:10px; visibility:hidden; border:solid 1px #cccccc; padding:10px; border-radius:5px; }
#PanelSearch > .filter #txtArchiveFilterBox { padding:0 5px; width:170px; height:20px; }
#PanelSearch > .filter #btnArchiveReset { display:none; }
#PanelSearch > .filter span.label { font-weight:bold; }
#PanelSearch > .filter ul { list-style: none; margin: 0; padding: 0; }
#PanelSearch > .filter ul li { float:left; padding:0 2px; }

#PanelNewsletter img { max-width:100%; height:auto; }

#PanelSitemap a:link, #PanelSitemap a:visited { color:#000000; cursor:pointer; }
#PanelSitemap a:hover { color:#CC3333; }
#PanelSitemap ul { list-style-type:disc; }
#PanelSitemap ul li { padding:2px 0; }
        
.listControl { visibility:hidden; }
.listControl > ul { list-style: none; margin: 0; padding: 0; }
.listControl > ul li:nth-child(even) { background: #F3F3D1; }
.listControl > ul li:nth-child(odd) { background: #FFFFFF; }
.listControl > ul li:nth-child(even):hover,
.listControl > ul li:nth-child(odd):hover { background-color: #B9B9B9; }

.listControl > .holder { margin: 50px 0 15px 0; float:right; }
.listControl > .holder a { font-size: 12px; cursor: pointer; margin: 0 5px; color: #333; }
.listControl > .holder a:hover { background:none; color: #1900d6; }
.listControl > .holder a.jp-previous { margin-right: 15px; }
.listControl > .holder a.jp-next { margin-left: 15px; }
.listControl > .holder a.jp-current, .listControl a.jp-current:hover { color: #FF4242; font-weight: bold; }
.listControl > .holder a.jp-disabled, .listControl a.jp-disabled:hover { color: #bbb; }
.listControl > .holder a.jp-current, .listControl a.jp-current:hover,
.listControl > .holder a.jp-disabled, .listControl a.jp-disabled:hover { cursor: default; background: none; }
.listControl > .holder span { margin: 0 5px; }

/* ----------------------------

			W3C 

------------------------------*/

body.fontType1 { font-family:"Helvetica Neue","Lucida Grande","Segoe UI",Arial,Helvetica,Verdana,sans-serif; }
body.fontType2 { font-family:Verdana; }
body.fontType3 { font-family:'Comic Sans'; }

.font1 { font-size:80%; }
.font2 { font-size:100%; }
.font3 { font-size:120%; }

.font1 h1, .font2 h1, .font3 h1 { font-size:200%; }
.font1 .font-xsmall, .font2 .font-xsmall, .font3 .font-xsmall { font-size:72%; }
.font1 .font-small, .font2 .font-small, .font3 .font-small { font-size:85%; }
.font1 .font-medium, .font2 .font-medium, .font3 .font-medium { font-size:90%; }
.font1 .font-large, .font2 .font-large, .font3 .font-large { font-size:120%; }
.font1 .font-xlarge, .font2 .font-xlarge, .font3 .font-xlarge { font-size:130%; }

.color2,
.color2 .FontColor, 
.color2 .FontColor a, 
.color2 .FontColor a:link, 
.color2 .FontColor a:visited { color:Red !important; }

.color3,
.color3 .FontColor, 
.color3 .FontColor a, 
.color3 .FontColor a:link, 
.color3 .FontColor a:visited { color:Blue !important; }

.color4,
.color4 .FontColor, 
.color4 .FontColor a, 
.color4 .FontColor a:link, 
.color4 .FontColor a:visited { color:Green !important; }

.color2 .FontColor a:hover,
.color3 .FontColor a:hover,
.color4 .FontColor a:hover { color:#FFFF00 !important;}

/* ----------------------------

		Background 

------------------------------*/

.TopBackground { display:none; width:100%; min-width:1000px; height:300px; position:absolute; top:0; left:0; z-index:-10; }
.background1 .TopBackground { background-color: #570000;
                              background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000), to(#570000));
                              background: -webkit-linear-gradient(top, #000000, #570000);                             
                              background: -moz-linear-gradient(top, #000000, #570000);                              
                              background: -ms-linear-gradient(top, #000000, #570000);                              
                              background: -o-linear-gradient(top, #000000, #570000); 
                              -moz-box-shadow: 0 0 50px 50px #570000;
                              -webkit-box-shadow: 0 0 50px 50px #570000;
                              box-shadow: 0 0 50px 50px #570000; }
.background2 .TopBackground { background-color: #004671;
                              background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000), to(#004671));
                              background: -webkit-linear-gradient(top, #000000, #004671);                             
                              background: -moz-linear-gradient(top, #000000, #004671);                              
                              background: -ms-linear-gradient(top, #000000, #004671);                              
                              background: -o-linear-gradient(top, #000000, #004671); 
                              -moz-box-shadow: 0 0 50px 50px #004671;
                              -webkit-box-shadow: 0 0 50px 50px #004671;
                              box-shadow: 0 0 50px 50px #004671; }
.background3 .TopBackground { background-color: #773507;
                              background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000), to(#773507));
                              background: -webkit-linear-gradient(top, #000000, #773507);                             
                              background: -moz-linear-gradient(top, #000000, #773507);                              
                              background: -ms-linear-gradient(top, #000000, #773507);                              
                              background: -o-linear-gradient(top, #000000, #773507); 
                              -moz-box-shadow: 0 0 50px 50px #773507;
                              -webkit-box-shadow: 0 0 50px 50px #773507;               
                              box-shadow: 0 0 50px 50px #773507; }

#topcontrol { z-index:50; }
.scrolltop { background:#202020; opacity:0.9; position:relative; padding:5px 8px 10px 10px; text-align:center; vertical-align:middle; font-weight:bold; color:#FFFFFF; border-radius:5px; letter-spacing:2px; }

#PanelLogin {}
#PanelLogin > .title { margin-bottom:10px; }
#PanelLogin .label { font-weight:bold; padding-right:10px; }
#PanelLogin input[type="text"] { width:300px; }
#PanelLogin .button { text-align:right; padding:10px; }
#PanelLogin .message { color:#ff0000; padding-left:85px; font-weight:bold; font-size:95%; display:none; }

#PanelComplaintList { display:none; }   
#PanelComplaintList .jqx-grid-cell { cursor:pointer; }         
#PanelComplaintDetail { display:none; }
#PanelComplaintDetail > table { width:100%; border-collapse:collapse; }
#PanelComplaintDetail > table td { border:solid 1px #d5d5d5; padding:5px; }
#PanelComplaintDetail .Title { font-weight:bold; width:100px; }
#PanelComplaintDetail .Content { }

#FixedPanel { position:fixed; right:0; top:50px; width:40px; height:auto; display:none; }
#FixedPanel ul { list-style:none; margin:0; padding:0; }
#FixedPanel ul li { padding:2px 5px; }
  
/* CUSTOMIZE */

.ezyweb.rounded { border-radius:5px; }      
.ezyweb.shadow { -moz-box-shadow: 0 0 5px #888; -webkit-box-shadow: 0 0 5px#888; box-shadow: 0 0 5px #888; }
.ezyweb.shadow.bottom { -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black; }
.ezyweb.border { border:solid 1px #bcbcbc; }


#adPopup {
    display:none;
    background: #fff;
    padding:20px;
}
#adPopup img {
    max-width:1000px; 
    height:auto;
}
#adPopup > div.info {
    padding:10px;
    text-align:center;
    z-index:1000;
}
#adPopup > div.info > a{
    font-weight:bold;
    font-size:130%;
    color:#000;
}
#adPopup > div.info > a:hover{
    color:#fdad37;
}
#adPopup > .b-close {
	color: #fff;
	background: #ff0000;
	padding: 5px 10px;
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
}

    .glow-on-hover {
        width: 150px;
        height: 150px;
        border: none;
        outline: none;
        color: #fff;
        cursor: pointer;
        position: relative;
        z-index: 0;
        border-radius: 10px;
        margin:0 8px;
        padding-top:5px;
    }
    .glow-on-hover:hover {  opacity: 0.5; }

    .glow-on-hover > div {
        width: 100%;
        text-align: center;
    }

    .glow-on-hover img {
        width:130px;
        height:auto;
    }
    .glow-on-hover > div > span {
        width: 100%;
        display: block;
        text-align: center;
        font-weight: bold;
        display:none;
    }

    
#PanelPopupMenu {
    display: none;
    background: #fff;
    padding: 40px;
    min-width:400px;
}

#PanelPopupMenu > .b-close {
    color: #fff;
    background: #ff0000;
    padding: 5px 10px;
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

    #PanelPopupMenu ul {
        margin:0;
        padding:0;
        list-style:none;
    }

    #PanelPopupMenu ul li {
        padding:5px;
        border-bottom:solid 1px #ccc;
    }

    #PanelPopupMenu ul li a {
        color: #141414;
        font-size: 120%;
        display:block;
    }

    #PanelPopupMenu ul li:hover {
        background:#cccccc;
    }