
/*
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local('Open Sans'), url('../fonts/Open-Sans.woff') format('woff');
}*/

@font-face {
	/*font-family: 'corbel';
	src: url('../fonts/CORBEL.TTF');*/
	font-weight: normal;
	font-style: normal;
}

body{
	padding:0;
	margin:0;
}

#top-login{
	background-color:#C30000;
	border-bottom:1px solid #AD0000;
	color:#EEEEEE;
	font-family:Arial;
	height:39px;
	left:0;
	padding:7px 0 0;
	position:relative;
	width:100%; 
}

#top-login .logo{
	color: #FFFFFF;
    font-family: corbel,Arial;
    font-size: 33px;
    font-weight: lighter;
    letter-spacing: -1.6px;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.2);
    margin-left:12px;
  }
   	
#top-login #smaller-detail{
	color:#FF7878;
	display:block;
	font-size:0.766em;
	letter-spacing:-0.03em;
	margin-left:10px;
	margin-top:-3px;
}

#top-shadow{
	background:url("../images/common/bottom-sha.png") repeat-x scroll 0 0 #ffffff;
	height:4px;
	position:absolute;
	top:44px;
	width:100%;
}

/*#logo-login{
	background-color: #F5F5F5;
	padding:0;
	text-align:left !important;
}

#content-login {
	margin: 20px 60px 20px 40px;
	background-color: #F5F5F5;
    border:3px solid #E5E5E5;
	float:right;
	text-align:right;
	width:27%;
	height:375px;
}

#logo-login img.icon {
	float: right;
	margin: 15px;
}*/

#bottom-login{
	background-attachment:scroll;
	background-color:transparent;
	background-image:url("../images/login/template-bottom.jpg");
	background-position:left top;
	background-repeat:repeat-x;
	height:50px;
}

#rightCol{
	border: solid 0px #3079ED !important;
	float:left;
	margin:20px 0 0 40px;
	width:60%;
	height:375px;
}

/*
#rightCol{
	float:left;margin:30px 0 0 40px;width:57%}*/

#bottomCol{
	border: solid 0px #3079ED !important;
	clear: both;
	margin:30px 0 0 40px;
	width:93%;
}

/*span.h2 {
    background-color: transparent;
    color: #555555;
    display: block;
    font-family: 'Open Sans',corbel,Helvetica,Arial,sans-serif;
    font-size: 26px !important;
    letter-spacing: -1.5px;
    line-height: 24px;
    margin: 0;
    padding: 14px 14px 0;
    text-align: left;
}

span.h3 {
    background-color: transparent;
    color: #555555;
    font-family: corbel,Helvetica,Arial,sans-serif;
    font-size: 12px !important;
    margin: 0;
    padding: 0 14px 14px;
    text-align: left;
}*/

#form-login {
  padding: 17px;
  text-align: right;
}

#form-login p{
	color:#333333;
  	padding: 0 15px;
  	text-align: left;
}

#form-login-shadow{
	background:url("../images/common/bottom-sha.png") repeat-x scroll 0 0 #ffffff;
	margin-left:40px;
	width:250px;
}

.form-element{
	display: block;
    padding: 4px 0;
    text-align: left;
}

.submit{
	margin: 12px 0;
    text-align: left;
}

label{
 	color: #505050;
    display: block;
    font-weight: bold;
    padding: 4px 0;
    text-align: left;
}
input[type="text"],input[type="password"]{
	background-color:#ffffff;
	border-top:1px solid #999999;
	border-right:1px solid #e6e6e6;
	border-bottom:1px solid #e6e6e6;
	border-left:1px solid #999999;
	color:#303030;
	font-family:Tahoma,"Lucida Grande","Lucida",Arial,Verdana,sans-serif;
	font-size:1em;
	font-weight:normal;
	margin-top:2px;
	padding:6px 3px;
	transition: all .218s ease;
	-o-transition: all .218s ease;
	-moz-transition: all .218s ease;
	-webkit-transition: all .218s ease;
	width:98%;
}

input[type="submit"], input[type="button"], input[type="reset"] {
	background: #E3E3E3;
	background: -webkit-gradient(linear, 0% 40%, 0% 70%, from(#F9F9F9), to(#E3E3E3));
	background: -moz-linear-gradient(center top , #F9F9F9, #E3E3E3) repeat scroll 0 0 transparent;
	 -moz-box-shadow: 0 1px 0 0 #FFFFFF inset, 0 1px 0 0 rgba(0, 0, 0, 0.05);
	border: 1px solid #aaa;
	border-color:#C9C9C9 #C9C9C9 #999999;
	font: 'Tahoma','Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif;
	padding: 4px 7px;
	cursor:pointer;
	font-size:12px;
	font-weight:bold;
	padding:4px 7px;
	color:#333333;
	text-shadow:1px 1px #FFFFFF;
	transition: all .218s ease;
	-o-transition: all .218s ease;
	-moz-transition: all .218s ease;
	-webkit-transition: all .218s ease;
}

input[type="button"]{margin:1px 0 0 0;}
input[type="button"]:hover {margin:1px 0 0 0;}
input[type="button"]:active {margin:1px 0 0 0;}

input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover {
	background: #eee;
	background: -webkit-gradient(linear, 0% 40%, 0% 70%, from(#eee), to(#eee));
	background: -moz-linear-gradient(center top , #eee, #eee) repeat scroll 0 0 transparent;
	border: 1px solid #aaa;
	border-color:#C9C9C9 #C9C9C9 #999999;
	box-shadow: 0 1px 5px #CCCCCC;
	font: tahoma,'Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif;
	padding: 4px 7px;
	cursor:pointer;
	color:#cf0000;
}

input[type="submit"]:active, 
input[type="button"]:active, 
input[type="reset"]:active {
	box-shadow: 0 1px 3px #505050 inset;
}

.default {
	font-weight:bold;
}

.button, button {
  -moz-box-shadow: 0 1px 0 0 #FFFFFF inset, 0 1px 0 0 rgba(0, 0, 0, 0.05);
  background: -moz-linear-gradient(-90deg, #F8F8F8, #DDDDDD) repeat scroll 0 0 transparent;
  border-color: #C9C9C9 #C9C9C9 #999999;
  border-style: solid;
  border-width: 1px;
  cursor: pointer;
  font-family: 'Tahoma','Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif;
  font-size: 12.5px;
  height: 28px;
  outline: 0 none;
  padding: 0 5px;
  vertical-align: middle;
  letter-spacing:0.5px;
}


#error-login{
	font-size:12px;
	color:#fc0000;
	text-align:left !important;
}

.copyright{
	color:#505050;
	font-size:10px;
	margin:auto 20px;
	text-align:left !important;
}

#version{
	color:#F00000;
	font-family:comic Sans MS;
	font-size:9px;
	font-weight:normal;
	margin-left:3px;
}

.forgot-password a{
	text-decoration:none;
	font-size:0.9em;
}

.forgot-password a:hover{
	text-decoration:underline;
	font-size:0.9em;
}

#breadcrumb-bar {
	background-color: #CF0000;
	border-bottom: 1px solid #9A0000;
	border-top: 1px solid #E80000;
	height: 28px;
	position: relative;
	width: 100%;
	z-index: 99;
}

#breadcrumb-bar span{
	color: #FFFFFF;
    display: block;
    font-family: corbel,tahoma,arial,sans-serif;
    font-size: 13px;
    padding: 2px 0 0 10px;
}


.box-entity {
	background-color: #FFFFFF;
	height: 78px;
	margin: 10px 10px 16px 0px;
	padding: 5px;
	width: 93%;
}

input.accept {
	background: #4D90FE !important;
	background: -webkit-gradient(linear,left top,left bottom,from(#4D90FE),to(#4787ED)) !important;
	background: -moz-linear-gradient(top,#4D90FE,#4787ED) !important;
	background: -o-linear-gradient(top,#4D90FE,#4787ED) !important;
	border: solid 1px #3079ED !important;
	color: white !important;
	text-shadow:none;
	border-radius:2px;
	box-shadow: 0 1px 0 0 #FFFFFF , 0 1px 0 0 rgba(0, 0, 0, 0.05);
}

.box-entity a{
	text-decoration:none;
	display:block;
}

.box-entity > a img{
	border: 0px;
}

/*.entity-text {
  color: #CF0000;
  font-family: corbel,arial,tahoma,sans-serif;
  font-size: 26px;
  letter-spacing: -1px;
  line-height: 24px;
}*/

.entity-text{background-color:transparent;font-family:Impact, Charcoal, sans-serif;font-size:24px!important;font-weight:normal;color:#cf0000;background:-webkit-linear-gradient(#cf0000, #f26a6a);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.entity-text-title{background-color:transparent;font-family:Impact, Charcoal, sans-serif;font-size:20px!important;font-weight:normal;color:#fff;text-transform: uppercase;}


.entity-image-frame{
	  background-color: #CF0000;
    color: #FFFFFF;
    float: left;
    height: 74px;
    margin: 0 12px 0 0;
    position: relative;
    width: 112px;
}

.entity-image{
	  background-color: #FFFFFF;
    color: #FFFFFF;
    float: left;
    height: 63px;
    margin: 5px;
    width: 102px;
}

/*.text-entity-detail {
  color: #505050;
  font-family: corbel,tahoma,arial,sans-serif;
  font-size:12px;line-height:14px;display:block 
}*/

  .text-entity-detail{color:#505050;font-family:tahoma,arial,sans-serif;font-size:12px;line-height:14px;display:block}
  .text-entity-detail a{text-decoration:none;display:inline-block;}
  .text-entity-detail a:hover{text-decoration:underline}
  .text-entity-reminder{color:#505050;font-family:corbel,tahoma,sans-serif;font-size:12px}

/*
.text-entity-reminder {
  color: #505050;
  font-family: corbel,tahoma,sans-serif;
  font-size: 12px;
}

.instructions {
  background-color: #ECEFF5;
  border: 1px solid #B1C3DA;
  font-size: 11px;
}

.instructionsText{
	font-family:corbel, tahoma, arial, sans-serif;
}*/

#login-overlay{
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: #fff;
	z-index: 1100;
	display: none;
}





  /*@font-face {
	font-family: 'corbel';
	src: url('<%=request.getContextPath()%>/fonts/CORBEL.TTF');
	font-weight: normal;
	font-style: normal;}
  body{height: 100%;padding:0;margin:0;}*/
  
  #top-header{background-color:#c30000;border-bottom:1px solid #ad0000;color:#eee;font-family:Arial;height:42px;left:0;padding:5px 0 0;position:relative;width:100%;z-index:5;}
  #top-header .logo-brand{font-family:Impact, Charcoal, sans-serif;color:#ccc;text-transform:uppercase;letter-spacing:4px;font-size:3vmin;text-shadow:-3px -3px 0 rgba(0,0,0,0.2);margin-left:12px;}/*color:#fff;font-family:corbel,Arial;font-weight:bold;letter-spacing:1px;*/
  #top-header .logo-user{color:#fff;}
  #top-header .logo-text{font-family: Impact, Charcoal, sans-serif;font-size:3vmin;color:#fff;letter-spacing:1px;text-shadow:-5px -5px 0 rgba(0,0,0,0.2);}  
  #version{color:#fff;font-family:comic Sans MS;font-size:3vmin;font-weight: bold;margin-left:4px;letter-spacing: 1px;margin-right:20px;}
  #top-header #smaller-detail{color:#FF7878;display:block;font-size:0.766em;letter-spacing:-0.03em;margin-left:10px;margin-top:-3px;}
  #breadcrumb-bar{background-color:#cf0000;height:23px;border-bottom:1px solid #9a0000;border-top:1px solid #e80000;position:relative;margin-top:42px;width:100%;z-index:99}/**/
  
  #globalContainer{}
  
  #content-left{
	/*overflow-x:auto;*/
	float:left;
	margin:30px 0px 20px 30px;
  	height:750px;
  	border:1px solid #f6d4d4;
  	/*width:63%;*/
  	border:2px solid #e7cdce;
  	background: linear-gradient(to left, #a5abad, 25%, white);
  	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.75), 0 12px 40px 0 rgba(0, 0, 0, 0.75);
  } 

  #content-login{
	/*overflow-x:auto;*/
	text-align:right;width:560px;height:750px; 
	float:right;
	margin:30px 30px 20px 30px;
	border:2px solid #e7cdce;
  	background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#a1a5a7))!important;
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.75), 0 12px 40px 0 rgba(0, 0, 0, 0.75); 
  }
  
  .bg-login {
	padding:0;margin:0;
	background-image: url("<%=request.getContextPath()%>/images/nlogin_main2.jpg");
	/* Center and scale the image nicely */
	background-position: left bottom;
	background-repeat: no-repeat;
	background-size: 49.5% 85%;

	/* Add the blur effect 
	filter: blur(2px);
	-webkit-filter: blur(1px);*/
	
	/* Full height */
	height: 100%; 
  }
  
  #content_popup{font-family:corbel,tahoma,arial,sans-serif}.desc_recovery{font-size:11px;color:#666}.forgot-password{font-family:corbel,tahoma,arial,sans-serif;text-decoration:none;}
  #fancybox-loading{position:fixed;top:50%;left:50%;height:40px;width:40px;margin-top:-20px;margin-left:-20px;cursor:pointer;overflow:hidden;z-index:1104;display:none}* html #fancybox-loading{position:absolute;margin-top:0}#fancybox-loading div{position:absolute;top:0;left:0;width:40px;height:480px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancy_loading.png)}#fancybox-overlay{position:fixed;top:0;left:0;bottom:0;right:0;background:#000;z-index:1100;display:none}* html #fancybox-overlay{position:absolute;width:100%}#fancybox-tmp{padding:0;margin:0;border:0;overflow:auto;display:none}#fancybox-wrap{position:absolute;top:0;left:0;margin:0;padding:20px;z-index:1101;display:none}#fancybox-outer{position:relative;width:100%;height:100%;background:#FFF;border:1px solid rgba(0,0,0,0.333)}#fancybox-inner{position:absolute;top:0;left:0;width:1px;height:1px;padding:0;margin:0;outline:0;overflow:hidden}#fancybox-hide-sel-frame{position:absolute;top:0;left:0;width:100%;height:100%;background:transparent}#fancybox-close{position:absolute;top:-15px;right:-15px;width:30px;height:30px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px 0;cursor:pointer;z-index:1103;display:none}#fancybox_error{color:#444;font:normal 12px/20px Arial;padding:7px;margin:0}#fancybox-content{height:auto;width:auto;padding:0;margin:0}#fancybox-img{width:100%;height:100%;padding:0;margin:0;border:0;outline:0;line-height:0;vertical-align:top;-ms-interpolation-mode:bicubic}#fancybox-frame{position:relative;width:100%;height:100%;border:0;display:block}#fancybox-title{bottom:0;left:0;font-family:Arial;font-size:12px;z-index:1102;border-bottom:1px solid #cecece}.fancybox-title-inside{padding:10px 0;text-align:center;color:#333}.fancybox-title-outside{padding-top:5px;color:#FFF;text-align:center;font-weight:bold}.fancybox-title-over{color:#FFF;text-align:left}#fancybox-title-over{padding:10px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancy_title_over.png);display:block}#fancybox-title-wrap{display:inline-block}#fancybox-title-wrap span{height:32px;float:left}#fancybox-title-left{background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px -90px;background-repeat:no-repeat}#fancybox-title-main{font-weight:bold;line-height:29px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox-x.png);background-position:0 -40px;color:#FFF}#fancybox-title-right{padding-left:15px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-55px -90px;background-repeat:no-repeat}#fancybox-left,#fancybox-right{position:absolute;bottom:0;height:100%;width:35%;cursor:pointer;outline:0;background-image: url(<%=request.getContextPath()%>/css/fancybox/blank.gif);z-index:1102;display:none}#fancybox-left{left:0}#fancybox-right{right:0}#fancybox-left-ico,#fancybox-right-ico{position:absolute;top:50%;left:-9999px;width:30px;height:30px;margin-top:-15px;cursor:pointer;z-index:1102;display:block}#fancybox-left-ico{background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px -30px}#fancybox-right-ico{background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px -60px}#fancybox-left:hover,#fancybox-right:hover{visibility:visible}#fancybox-left:hover span{left:20px}#fancybox-right:hover span{left:auto;right:20px}.fancy-bg{position:absolute;padding:0;margin:0;border:0;width:20px;height:20px;z-index:1001}#fancy-bg-n{top:-20px;left:0;width:100%;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox-x.png)}#fancy-bg-ne{top:-20px;right:-20px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px -162px}#fancy-bg-e{top:0;right:-20px;height:100%;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox-y.png);background-position:-20px 0}#fancy-bg-se{bottom:-20px;right:-20px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px -182px}#fancy-bg-s{bottom:-20px;left:0;width:100%;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox-x.png);background-position:0 -20px}#fancy-bg-sw{bottom:-20px;left:-20px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px -142px}#fancy-bg-w{top:0;left:-20px;height:100%;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox-y.png)}#fancy-bg-nw{top:-20px;left:-20px;background-image: url(<%=request.getContextPath()%>/css/fancybox/fancybox.png);background-position:-40px -122px}#fancybox-loading.fancybox-ie div{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_loading.png',sizingMethod='scale')}.fancybox-ie #fancybox-close{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png',sizingMethod='scale')}.fancybox-ie #fancybox-title-over{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_over.png',sizingMethod='scale');zoom:1}.fancybox-ie #fancybox-title-left{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_left.png',sizingMethod='scale')}.fancybox-ie #fancybox-title-main{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_main.png',sizingMethod='scale')}.fancybox-ie #fancybox-title-right{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_right.png',sizingMethod='scale')}.fancybox-ie #fancybox-left-ico{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_left.png',sizingMethod='scale')}.fancybox-ie #fancybox-right-ico{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_right.png',sizingMethod='scale')}.fancybox-ie .fancy-bg{background:transparent!important}.fancybox-ie #fancy-bg-n{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png',sizingMethod='scale')}.fancybox-ie #fancy-bg-ne{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png',sizingMethod='scale')}.fancybox-ie #fancy-bg-e{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png',sizingMethod='scale')}.fancybox-ie #fancy-bg-se{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png',sizingMethod='scale')}.fancybox-ie #fancy-bg-s{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png',sizingMethod='scale')}.fancybox-ie #fancy-bg-sw{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png',sizingMethod='scale')}.fancybox-ie #fancy-bg-w{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png',sizingMethod='scale')}.fancybox-ie #fancy-bg-nw{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png',sizingMethod='scale')}
  
  #error-login{color:#cf0000;float:left;font-family:Arial;font-size:14px;margin:5px 0 0px 14px}
  
  #form-login{margin:20px 60px 10px 60px;border:3px solid #FFF;padding:20px;border-radius:10px;}
  #form-login label{color:#ccc;display:block;font-weight:bold;padding:4px 0;text-align:left}
  #form-login .form-element{display:block;padding:4px 0;}
  #form-login .submit{margin:12px 0;text-align:center} 

  #instructions{margin:20px 55px 0 55px;border-bottom:2px solid #ccc;font-family: Impact, Charcoal, sans-serif;font-size:14px;letter-spacing:4px;background: -webkit-linear-gradient(#eee, #333);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
  #instructionsText{margin:1px 55px 5px 55px;border-bottom:2px solid #ccc;font-family:corbel,Helvetica,Arial,sans-serif;font-size:12px;color:#000;background-color:transparent;text-align:justify}  
  #logo-login{padding:0;text-align:left!important}/*background-color:#f5f5f5;*/
  #logo-login img.icon{float:right;margin:15px} 
  
  .box-entity {background-color: #FFFFFF;border:1px solid #cf0000;padding: 8px;margin-right: 10px;margin-bottom: 16px;} /*background-color:transparent;*/

  .style1 {color: #990000}
  .style2 {color: #990000; font-weight: bold; }
  .style3 {font-size: 16px; font-family: corbel, arial, tahoma, sans-serif; text-transform: uppercase;color:#000;}
  .style4 {font-size: 14px; font-family: corbel, arial, tahoma, sans-serif; font-weight:bold;text-transform: uppercase;padding-right:10px;}

  input[type="text"],input[type="password"]{background-color:#fff;border-top:1px solid #999;border-right:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;border-left:1px solid #999;color:#303030;font-family:Tahoma,"Lucida Grande","Lucida",Arial,Verdana,sans-serif;font-size:1em;font-weight:normal;margin-top:2px;padding:6px 3px;transition:all .218s ease;-o-transition:all .218s ease;-moz-transition:all .218s ease;-webkit-transition:all .218s ease;width:100%}
  input[type="submit"],input[type="button"],input[type="reset"]{background:#e3e3e3;background:-webkit-gradient(linear,0% 40%,0% 70%,from(#f9f9f9),to(#e3e3e3));background:-moz-linear-gradient(center top,#f9f9f9,#e3e3e3) repeat scroll 0 0 transparent;-moz-box-shadow:0 1px 0 0 #fff inset,0 1px 0 0 rgba(0,0,0,0.05);border:1px solid #aaa;border-color:#c9c9c9 #c9c9c9 #999;font:'Tahoma','Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif;padding:4px 7px;cursor:pointer;font-size:16px;font-weight:bold;padding:4px 7px;color:#333;text-shadow:1px 1px #fff;transition:all .218s ease;-o-transition:all .218s ease;-moz-transition:all .218s ease;-webkit-transition:all .218s ease}
  input[type="button"]{margin:1px 0 0 0}input[type="button"]:hover{margin:1px 0 0 0}input[type="button"]:active{margin:1px 0 0 0}
  input[type="submit"]:hover,input[type="button"]:hover,input[type="reset"]:hover{background:#eee;background:-webkit-gradient(linear,0% 40%,0% 70%,from(#eee),to(#eee));background:-moz-linear-gradient(center top,#eee,#eee) repeat scroll 0 0 transparent;border:1px solid #aaa;border-color:#c9c9c9 #c9c9c9 #999;box-shadow:0 1px 5px #ccc;font:tahoma,'Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif;padding:4px 7px;cursor:pointer;color:#cf0000}
  .accept{width: -webkit-fill-available; text-transform: uppercase; background:#4d90fe;background:-webkit-gradient(linear,0% 40%,0% 70%,from(#4d90fe),to(#012245));background:-moz-linear-gradient(center top,#012245,#012245) repeat scroll 0 0 transparent}
  input[type="submit"]:active,input[type="button"]:active,input[type="reset"]:active{box-shadow:0 1px 3px #505050 inset}
  .default{font-weight:bold}.button,button{-moz-box-shadow:0 1px 0 0 #fff inset,0 1px 0 0 rgba(0,0,0,0.05);background:-moz-linear-gradient(-90deg,#f8f8f8,#ddd) repeat scroll 0 0 transparent;border-color:#c9c9c9 #c9c9c9 #999;border-style:solid;border-width:1px;cursor:pointer;font-family:'Tahoma','Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif;font-size:12.5px;height:45px;outline:0 none;padding:0 5px;vertical-align:middle;letter-spacing:.5px}

  input.login{width:100%;height:40px;font-size:14px;background:#cf0000!important;background:-webkit-gradient(linear,left top,left bottom,from(#f26a6a),to(#cf0000))!important;background:-moz-linear-gradient(top,#f26a6a,#cf0000)!important;background:-o-linear-gradient(top,#f26a6a,#cf0000)!important;border:solid 1px #cf0000!important;color:white!important;text-shadow:none;border-radius:5px;box-shadow:0 1px 0 0 #ccc,0 1px 0 0 rgba(0,0,0,0.05)}
  input.login:hover{width:100%;height:40px;font-size:14px;background:#cf0000!important;border:solid 1px #cf0000!important;color:white!important;text-shadow:none;border-radius:5px;box-shadow:0 1px 0 0 #ccc,0 1px 0 0 rgba(0,0,0,0.05)}  	
  
  .forgot-password a{text-decoration:none;font-size:.9em;color:blue;}
  .forgot-password a:hover{text-decoration:underline;font-size:.9em}
  
  #bottom-footer{background-color:#c30000;position:fixed;bottom:0;width:100%;height:30px;font-weight:bold;padding-top:5px;color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:12px;text-align:center;z-index: 1;background: linear-gradient(to bottom, #000, 10%, #cf0000);} 
  #bottom-footer a{text-decoration:none;color:#ccc;font-size: 12px;}
  #bottom-footer a:hover{text-decoration:underline;color:blue;font-size: 12px;}   
  
  /* for responsive screen - mobile friendly */
  @media only screen and (min-width: 0px) and (max-width: 700px){
    #top-header{height:70px;position:fixed;}
    #top-header div{float:left;}    
    #breadcrumb-bar{margin-top:70px;position:fixed;}
    #globalContainer{padding-top:70px;padding-bottom:20px;}    
    #globalContainer td{float:right;padding:5px;width:98%;}  
    #content-left{overflow-x:auto;}  
    #imgsgs{height:120px;display:block;}
  } 







  /* Whastapp */
  .whatsapp-number {
    background-color: #25D366;
    color: white;
    padding: 4px 8px;
    border-radius: 6px;
    font-weight: 600;
    margin-left: 4px;
    transition: all 0.3s ease;
    text-decoration: none;
    letter-spacing:2px;
  }

  .whatsapp-number:hover {
    background-color: #32e375; /* warna hijau lebih terang */
    transform: scale(1.05); /* sedikit besar bila hover */
  }


  /* Announcement */
  .announcement-box {
	margin-top:8px;
	width: 100%;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	overflow: hidden;
	/*font-family: 'Segoe UI', sans-serif;
	font-family:Impact, Charcoal, sans-serif;
	letter-spacing: 2px;*/
  }
	
  .announcement-header {
	background: linear-gradient(90deg, #cf0000, #f26a6a);
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
	padding: 10px 14px;
	letter-spacing: 1px;
	display: flex;
	align-items: center;
	font-size: 15px;
  }
	
  .announcement-header i {
	margin-right: 8px;
	font-size: 18px;
  }
  
  .announcement-body {
	padding: 8px 14px;
	background: #fafafa;
	height: 250px;
  }
	
  .announcement-item {
	margin-bottom: 12px;
	color: #333;
	line-height: 1.5;
  }
	
  .announcement-item p {
	margin: 0;
	font-size: 14px;
  }
	
  .announcement-item hr {
	border: 0;
	border-top: 1px dashed #ddd;
	margin: 8px 0;
  }
  
  /* Announcement Message */
  .msg-info {
	font-size: 12px !important;
	font-family: Arial,Helvetica,sans-serif !important;
  }
  .msg-info h4 {
	font-size: 14px !important;
	text-transform: uppercase;
  }

  /* Link */
  .info-links {
	padding-top:2px;
	display: flex;
	flex-direction: column;
	gap: 3px;
	font-family: "Segoe UI", sans-serif;
  }
	
  .info-card {
	/*background: #fff;
	border: 1px solid #abb0b2;*/
	border: 1px solid #eee;
	border-left: 10px solid #cf0000;
	border-radius: 8px;
	/*border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;*/
	box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	transition: all 0.3s ease;
	overflow: hidden;
  }
	
  .info-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 4px 12px rgba(0,0,0,0.12);
  }

  .info-card a {
	display: flex;
	align-items: center;
	text-decoration: none;
	color: #333;
	padding: 6px 12px;
  }
	
  .info-card img {
	width: 90px;
	height: 54px;
	object-fit: contain;
	margin-right: 14px;
	border-radius: 6px;
	background: #f8f8f8;
	transition: transform 0.3s ease;
  }
	
  .info-card:hover img {
	transform: scale(1.05);
  }

  .info-text h4 {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
	color: #cf0000;
	text-transform: uppercase;
	letter-spacing: 0.5px;
  }

  .info-text p {
    margin: 4px 0 0 0;
    font-size: 14px;
    color: #555;
    line-height: 1.4;
  }

  /* Follow Bar */
.follow-bar {
  /*margin: 4px 0;*/
  background: linear-gradient(90deg, #b00000 0%, #d40000 50%, #a80000 100%);
  /*border-radius: 12px;*/
  padding: 6px 20px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  position: relative;
  overflow: hidden;
}

.follow-bar::before {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-25deg);
  animation: shine 4s infinite linear;
}

@keyframes shine {
  0% { left: -75%; }
  100% { left: 125%; }
}

.arrow-animate { /* Animated Arrow */
  display: inline-block;
  animation: moveRight 1.2s infinite ease-in-out;
}

@keyframes moveRight {
  0%, 100% { transform: translateX(0); opacity: 0.7; }
  50% { transform: translateX(6px); opacity: 1; }
}

/*.social-icons {
  display: flex;
  align-items: center;
  gap: 20px;
}

.social-icons a {
  color: white;
  font-size: 24px;
  transition: all 0.35s ease;
  text-shadow: 0 2px 5px rgba(0,0,0,0.3);
  position: relative;
}

.social-icons a:hover {
  transform: translateY(-4px) scale(1.2);
  color: #fff8e1;
  text-shadow: 0 0 10px #fff, 0 0 20px #ffd700;
}

.social-icons a::after {
  content: attr(title);
  position: absolute;
  bottom: -28px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 6px;
  opacity: 0;
  transition: opacity 0.3s, bottom 0.3s;
}

.social-icons a:hover::after {
  opacity: 1;
  bottom: -32px;
}*/

.social-icons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px; /* jarak antara ikon */
}

.social-icons a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: #b30000;
  font-size: 18px;
  transition: all 0.3s ease;
  text-decoration: none;
  box-shadow: 0 0 0 rgba(255, 255, 255, 0); /* tiada glow awal */
}

.social-icons a:hover {
  background: #b30000;
  color: #fff;
  transform: scale(1.15);
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.6), 0 0 20px rgba(255, 80, 80, 0.5);
}


/* System Name */
.system-name {
  /*background: linear-gradient(90deg, #b00000 0%, #d40000 50%, #a80000 100%);
  background: linear-gradient(180deg, #e7dcdc 0%, #d40000 50%, #c7abab 100%);*/
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);

  font-family: 'Orbitron', sans-serif;
  text-align: center;
  position: relative;
  
  height:118px;
}

/*.system-name::before {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-25deg);
  animation: shine 4s infinite linear;
}

@keyframes shine {
  0% { left: -75%; }
  100% { left: 125%; }
}

.arrow-animate { 
  display: inline-block;
  animation: moveRight 1.2s infinite ease-in-out;
}

@keyframes moveRight {
  0%, 100% { transform: translateX(0); opacity: 0.7; }
  50% { transform: translateX(6px); opacity: 1; }
}
*/

/* Tajuk utama */
.system-name .maintitle {
  /*letter-spacing: 18px;
  font-size: 50px;
  font-weight: 900;
  color: #c30000; 
  animation: glowPulse 2s infinite alternate;*/
  position: relative;
  font-size: 70px;
  font-weight: 800;
  letter-spacing: 3px;
  background: linear-gradient(90deg, #b00000 0%, #d40000 50%, #a80000 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 20px rgba(255, 0, 0, 0.5);
  overflow: hidden;
}

/* animasi kilau bergerak */
.maintitle::after {
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.8), transparent);
  animation: shine 4s infinite;
}

@keyframes shine {
  0% { left: -75%; }
  60% { left: 125%; }
  100% { left: 125%; }
}

@keyframes moveRight {
  0%, 100% { transform: translateX(0); opacity: 0.7; }
  50% { transform: translateX(6px); opacity: 1; }
}

/* Subtajuk */
.system-name .subtitle {
  /*padding: 10px 20px;
  border-radius: 50px;
  background: linear-gradient(180deg, #e7dcdc 0%, #d40000 50%, #c7abab 100%);
  backdrop-filter: blur(6px);
  color: #fff;
  font-size: 12px;
  letter-spacing: 1px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 10px rgba(255, 0, 0, 0.4);*/
  display: inline-block;
  margin-top: 15px;
  padding: 10px 45px;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.8px;
  color: #fff;
  background: linear-gradient(90deg, #c80000, #e00000, #b00000);
  border-radius: 50px;
  box-shadow: inset 0 2px 6px rgba(255,255,255,0.25),
              0 0 20px rgba(255, 0, 0, 0.5);
  border: 1px solid rgba(255,255,255,0.2);
  animation: pulseGlow 3s infinite ease-in-out;
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 10px rgba(255, 0, 0, 0.4); }
  50% { box-shadow: 0 0 25px rgba(255, 0, 0, 0.8); }
}


/* Animasi glow teks */
/*@keyframes glowPulse {
  from {
    text-shadow:
      0 0 10px rgba(255, 70, 70, 0.8),
      0 0 40px rgba(200, 0, 0, 0.9);
  }
  to {
    text-shadow:
      0 0 20px rgba(255, 120, 120, 1),
      0 0 80px rgba(200, 0, 0, 1);
  }
}*/

/* Animasi background logo perlahan */
/*@keyframes rotateGradient {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}*/



.logo-container {
  text-align: center;
  font-family: 'Orbitron', sans-serif;

  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  position: relative;
  height:118px;
}

.logo-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transform: skewX(-25deg);
  animation: shine 4s infinite linear;
}

@keyframes shine {
  0% { left: -75%; }
  100% { left: 125%; }
}

.arrow-animate { 
  display: inline-block;
  animation: moveRight 1.2s infinite ease-in-out;
}

@keyframes moveRight {
  0%, 100% { transform: translateX(0); opacity: 0.7; }
  50% { transform: translateX(6px); opacity: 1; }
}

/* icon + teks utama */
.logo-top {
  display: flex;
  align-items: center;
  justify-content: center;
  /*gap: 12px;*/
  position: relative;
  margin-bottom: 5px;
}

/* tajuk utama i-GIMS */
.logo-reflect {
  position: relative;
  display: inline-block;
}

.logo-title {
  position: relative;
  font-size: 54px;
  font-weight: 800;
  letter-spacing: 5px;
  /*background: linear-gradient(90deg, #800000 0%, #c00000 50%, #660000 100%);*/
  background: linear-gradient(90deg, #ff3333 0%, #b00000 45%, #5a0000 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow:
    0 0 15px rgba(255, 80, 80, 0.3),
    0 0 30px rgba(192, 0, 0, 0.4);
  overflow: hidden;
  animation: pulseTextGlow 3s infinite ease-in-out;
  /*filter: drop-shadow(0 0 3px rgba(255,0,0,0.6));*/
}

/* --- Efek pantulan lembut bawah teks --- */
.logo-title::after {
  content: attr(data-text);
  position: absolute;
  top: 100%; 
  left: 0;
  width: 100%;
  height: 100%;
  transform: scaleY(-1);
  opacity: 0.15;
  background: linear-gradient(to bottom, rgba(255,255,255,0.25), transparent 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: blur(1px);
}

/* Tambah animasi khas untuk teks supaya tak terlalu terang */
@keyframes pulseTextGlow {
  0%, 100% {
    text-shadow:
      0 0 15px rgba(255, 80, 80, 0.3),
      0 0 30px rgba(192, 0, 0, 0.4);
  }
  50% {
    text-shadow:
      0 0 25px rgba(255, 0, 0, 0.7),
      0 0 50px rgba(192, 0, 0, 0.8);
  }
}

/* subtitle oval */
.logo-subtitle {
  display: inline-block;
  /*margin-top: 20px;*/
  padding: 10px 22px;
  font-size: 11px;
  /*font-weight: 600;*/
  letter-spacing: 0.5px;
  color: #fff;
  background: linear-gradient(90deg, #900000, #b80000, #7a0000);
  /*background: linear-gradient(340deg, #e7dcdc 0%, #d40000 50%, #c7abab 100%);*/
  border-radius: 50px;
  border: 1px solid rgba(255,255,255,0.25);
  /*box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.25),
    0 0 18px rgba(192, 0, 0, 0.5);*/
    
  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.25),
    0 0 10px rgba(192, 0, 0, 0.6),
    0 4px 12px rgba(0,0,0,0.3);
    
    
  animation: pulseGlow 3s infinite ease-in-out;
  backdrop-filter: blur(4px);
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 10px rgba(192, 0, 0, 0.5); }
  50% { box-shadow: 0 0 25px rgba(255, 0, 0, 0.8); }
}

