@CHARSET "UTF-8";
* img {border:none}
body{font-family:'Droid sans', Arial;font-size:16px;}
.awesome{
display: inline-block;
padding: 7px 10px 8px;
color: white !important;
font-weight:bold;
text-decoration: none;
line-height: 1;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 0 1px 3px #999;
-moz-box-shadow: 0 1px 3px #999;
-webkit-box-shadow: 0 1px 3px #999;
text-shadow: 0 -1px 1px #222;
border-bottom: 1px solid #222;
position: relative;
cursor: pointer;
-moz-transition: opacity 1s ease;  /* FF3.7+ */
-o-transition: opacity 1s ease;  /* Opera 10.5 */
-webkit-transition: opacity 1s ease;  /* Saf3.2+, Chrome */
transition: opacity 1s ease;
}
.awesome:hover{text-decoration: none;}
.small.awesome{font-size:11px}.medium.awesome{font-size:13px}.large.awesome{font-size:14px;padding:8px 14px 9px}
.blue.awesome{background-color:#2daebf}
.red.awesome{background-color:#e33100}
.magenta.awesome{background-color:#a9014b}
.orange.awesome{background-color:#ff5c00}
.yellow.awesome{background-color:#ffb515}
.green.awesome{background-color:#749A02}


.green.awesome:hover{background-color:#9bb515}
.blue.awesome:hover{background-color:#007D9A}
.magenta.awesome:hover{background-color:#630030}
.orange.awesome:hover{background-color:#D45500}
.yellow.awesome:hover{background-color:#FC9200}

input:focus, textarea:focus, select:focus {
	outline-color: #C00;
}

input[type="text"], input[type="password"], input[type="email"], .input-text, textarea, select {
    border: 1px solid #a2a2a3;
    padding: 5px;
    outline: none;
    font-size: 0.8125em;
    color: #888;
    margin: 0;
    display: block;
    background: #fff;
        border-radius:4px;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}
option { padding: 5px; }
select { padding: 5px; }
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus, .input-text:focus {
    border: 1px solid #aaa;
    color: #444;
    -moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
    box-shadow:  0 0 3px rgba(0,0,0,.2);
    border-radius:4px;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}
textarea {
    display: block;
    width: 94%;
    min-height: 60px;
}
input[type="radio"] { vertical-align: middle; }
input[type="checkbox"] { display: inline; }
input[type="submit"]:hover { cursor: pointer }
#content{margin: 0 auto;
/* width:990px; */

background:#E9F7FB; box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 5px 18px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
    border-style: solid;
    border-left-width:2px;
    border-right-width:2px;
    border-top-width:0px;
    border-bottom-width:0px;
    border-color: #cccccc;
    min-height:100%}
    
table.general{font-size:11px;background-color:#f9f6be;color:#373B3D;border:1px solid black;padding:0px;}
/*table tr td.remark{background-color:#FADB5A}*/

table.general tr:nth-child(odd) td {
    background: none repeat scroll 0 0 #f9f175;border:1px solid black;padding:0px
}

table.general tr:nth-child(even) td {
    background: none repeat scroll 0 0 #FADB5A;border:1px solid black;padding:0px
}

table.general tr:hover td{
   background-color: #D7E3ED !important;
}

table.general tr td:hover{
   background-color:#fdcece !important;
}

input[type="number"]::-webkit-outer-spin-button
{
	-webkit-appearance: none;
	border: 5px solid red;
	cursor:pointer;
    display:block;
}

input[type=number]::-webkit-inner-spin-button { 
    -webkit-appearance: none;
    cursor:pointer;
    display:block;
    width:15px;
    border:1px solid #BBB;
    background-color:green;
    margin-left:5px;
    color: #333;
    text-align:center;
    position:relative;
    opacity: 1; /* shows Spin Buttons per default (Chrome >= 39) */
    background: #f9f175 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKUlEQVQYlWNgwAT/sYhhKPiPT+F/LJgEsHv37v+EMGkmkuImoh2NoQAANlcun/q4OoYAAAAASUVORK5CYII=) no-repeat center center;
}

input[type=number]::-webkit-inner-spin-button:before,
input[type=number]::-webkit-inner-spin-button:after {
    /* content: "^"; */
    position:absolute;
    right: 0;
    font-family:monospace;
    line-height:
    border:1 px solid orange;
}

input[type=number]::-webkit-inner-spin-button:before {
    top:0px;
    border:3 px solid orange;
}

input[type=number]::-webkit-inner-spin-button:after {
    bottom:0px;
    -webkit-transform: rotate(180deg);
    border:3 px solid yellow;
}

/*
input[type="number"]::-webkit-outer-spin-button, 
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    background: #FFF url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKUlEQVQYlWNgwAT/sYhhKPiPT+F/LJgEsHv37v+EMGkmkuImoh2NoQAANlcun/q4OoYAAAAASUVORK5CYII=) no-repeat center center;
    width: 1em;
    border-left: 1px solid #BBB;
    opacity: .5; /* shows Spin Buttons per default (Chrome >= 39) * /
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
*/

input[type="number"]::-webkit-inner-spin-button:hover,
input[type="number"]::-webkit-inner-spin-button:active{
    box-shadow: 0 0 2px #0CF;
    opacity: .8;
}


/* Override browser form filling */
input:-webkit-autofill {
    background: black;
    color: red;
}


/*
@media screen and (max-device-width: 650px) {
  body{background-color:red !important}
}*/

  @media screen and (max-device-width: 480px) {
  	/* body{background-color:purple !important} */
  }
  
  /* Vertical: no need specify heigh, auto */
@media all and (orientation:portrait) and (min-device-width: 600px) {
  /*html{min-height:154px}*/
  body{
  	/*width:550px !important;min-height:200px !important;*/
  	
  	/*padding:0px;margin:0px*/} /* background-color:blue !important; */
  #content{
  	/* width:560px !important; */
  	
  	/*border: 5px solid orange;min-height:795px */}

  #header_logo{border:5px solid yellow !important;width:550px}
  #header_logo a img{width:550px !important}
  #login_box{width:450px !important;margin:0 auto}
  #login_title{width:450px !important;margin:0 auto;font-size:75px;text-align:center}
  #frm_login input
  {
  	width:450px;
  	font-size:40px;
  }
  
  #frm_login .fieldname{font-size:40px;}
  
  /*#content{background-color:blue !important}*/
  
  @-viewport {
  	/*zoom: .5;*/
  }

}
/* VALID */
/*
@media all and (orientation:landscape)
{
  body{background-color:green !important;width:300px !important;height:400px !important}
  #content{width:500px !important; border: 5px solid purple}
  #header_logo{border:5px solid red !important;}
}*/

/*@media orientation:landscape
{

}*/
 
/*
@media (max-width: 699px) and (min-width: 520px) {
  @-viewport {
    #header_logo{border:5px solid blue;}
    width: 640px;
    zoom: .5;
    min-zoom: 0.25;
    max-zoom: 5;
    / * orientation: landscape;* /
  }
}
*/

/*@media screen and (min-aspect-ratio: 13/9){ #content{width:500px}; body{background-color:purple !important}; } // landscape
@media screen and (max-aspect-ratio: 13/9){ #content{width:700px}; body{background-color:brown !important}; } // portrait*/

/* 
@media (min-width:320px) { body{background-color:red !important};/ * smartphones, iPhone, portrait 480x320 phones * / }
@media (min-width:481px) { body{background-color:green !important};/ * portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. * / }
@media (min-width:641px) { body{background-color:yellow !important};/ * portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones * / }
*/
/*@media (min-width:961px) { body{background-color:black !important};/* tablet, landscape iPad, lo-res laptops ands desktops */ } */
/* @media (min-width:1025px) { body{background-color:orange !important};/ * big landscape tablets, laptops, and desktops * / }
@media (min-width:1281px) { body{background-color:blue !important};/ * hi-res laptops and desktops * / }*/