#header { position: fixed; top: 0px; height: 115px; width: 100%; background: #a5b892; z-index: 99; } #body { position: fixed; height:100%; margin: 0px; padding: 0px; text-align: left; background-color: #e3f5d2; /*background-image:url("images/backcolor.png");*/ /*font-family: bangla;*/ font-family: Arial, Vrinda, Bangla, SolaimanLipi, Rupali, Verdana, Helvetica, Mangal, Lucida Grande, Geneva, Times New Roman, Times,Century Schoolbook L, URW Chancery L, URW Bookman L, Nimbus Mono L, URW Palladio L, Georgia, Tahoma, sans-serif; } #bodyx { margin: 0px; padding: 0px; text-align: left; background: #ced7db; /*background-color: #e6f8ff;*/ margin-top: 115px; overflow: auto; /*background-image:url("images/backcolor.png");*/ /*font-family: bangla;*/ font-family: Arial, Vrinda, Bangla, SolaimanLipi, Rupali, Verdana, Helvetica, Mangal, Lucida Grande, Geneva, Times New Roman, Times,Century Schoolbook L, URW Chancery L, URW Bookman L, Nimbus Mono L, URW Palladio L, Georgia, Tahoma, sans-serif; } div.dv { position: absolute; left: 0px; width: 99%; height: 50px; } /* DIV TEXT POSITON */ .txtDiv { background-image:url(''); margin:0; color:#000000; position:relative; top:10px; left:10px; font-size:14px; } input:required:focus { border: 1px solid red; outline: none; } .container { overflow-y: auto; } #divparent { display: flex; } #menudiv{ float: right; width: 200px; padding-top: 0px; padding-right: 5px; padding-bottom: 0px; padding-left: 10px; } #namediv { float: left; width: calc(100% - 200px); } @font-face { font-family: bangla; src: url('fonts/bangla.ttf'); } .fontstyl {color: #000000;font-size: 14px; font-family:Arial, Vrinda, Bangla, SolaimanLipi, Rupali, Verdana, Helvetica, Mangal, Lucida Grande, Geneva, Times New Roman, Times,Century Schoolbook L, URW Chancery L, URW Bookman L, Nimbus Mono L, URW Palladio L, Georgia, Tahoma, sans-serif;} #footer { position: fixed; background:gray; width:100%; bottom:0; } #divleft { float: left;} /*COLOR FOR TR */ .clor {background-color:#064E5B;} .litclor{background-color:#b1ccc6;} .adclor{background-color:#ffffff;} .adclorftr{background-color:#508a8f;} .adclormem{background-color:#ffffff;} .bd {font-weight: bold;} /*Gray COLOR*/ .gry {color: #c4bebe} .style10 {color: #000000;font-size: 10px;} .style10w {color: #FFFFFF;font-size: 10px;} .style10g {color: #02462A;font-size: 10px;} .style10gry {color: #565756;font-size: 10px;} .style11 {color: #000000;font-size: 11px;} .style11w {color: #FFFFFF;font-size: 11px;} .style11y {color: #FFFF00;font-size: 11px;} .style11g {color: #2B8029;font-size: 11px;} .style11r {color: #F82206;font-size: 11px;} .style12 {color: #000000;font-size: 12px;} .style12w {color: #FFFFFF;font-size: 12px;} .style12r {color: #F82206;font-size: 12px;} .style12rd {color: #982602;font-size: 12px;} .style12g {color: #2B8029;font-size: 12px;} .style12y {color: #FFFF00;font-size: 12px;} .style12g2 {color: #BFE8A3;font-size: 12px;} .style12blu {color: #042a55;font-size: 12px;} .style12blue {color: #0452ab;font-size: 12px;} .style12b {color: #000000;font-size: 12px;} .style12wb {color: #FFFFFF;font-weight:bold;font-size: 12px;} .style12bb {color: #000000;font-weight:bold;font-size: 12px;} .style12rb {color: #b30404;font-weight:bold;font-size: 12px;} .style12gb {color: #098b05;font-weight:bold;font-size: 12px;} .style13 {color: #000000;font-size: 13px;} .style13g {color: #2B8029;font-size: 13px;} .style13blu {color: #031BFF;font-size: 13px;} .style14 {color: #000000;font-size: 14px;} .style14y {color: #FFFF00;font-size: 14px;} .style14blu {color: #031BFF;font-size: 14px;} .style14b {color: #000000;font-weight:bold;font-size: 14px;} .style14wb {color: #FFFFFF;font-weight:bold;font-size: 14px;} .style14g {color: #094d02;font-size: 14px;} .style14gb {color: #015605;font-weight:bold;font-size: 14px;} .style14rd {color: #F82206;font-weight:bold;font-size: 14px;} .style14ydb {color: #8b8419;font-weight:bold;font-size: 14px;} .style14r {color: #F82206;font-size: 14px;} .style14dbrwn {color: #444a44;font-size: 14px;} .style14lbrwn {color: #afb5af;font-size: 14px;} .style15 {color: #000000;font-size: 15px;} .style15r {color: #F82206;font-size: 15px;} .style16gb {color: #015605;font-weight:bold;font-size: 16px;} .style16r {color: #F82206;font-size: 16px;} .style16rb {color: #F82206;font-weight:bold;font-size: 16px;} .style16 {color: #000000;font-size: 16px;} .style16y {color: #D7B410;font-size: 16px;} .style16w {color: #ffffff;font-size: 16px;} .style17 {color: #000000;font-size: 17px;} .style17b {color: #000000;font-weight: bold;font-size: 17px;} .style17r {color: #F82206;font-weight: bold;font-size: 17px;} .style18 {color: #000000;font-size: 18px;} .style18 {color: #000000;font-size: 18px;} .style18b {color: #000000;font-weight: bold;font-size: 18px;} .style19 {color: #000000;font-size: 19px;} .style16b {color: #000000;font-weight: bold;font-size: 16px;} .style19w {color: #FFFFFF;font-size: 19px;} .style30b {color: #000000;font-size: 30px;} /*Only white color link button*/ #lnk0 a:link {text-decoration: none;color: #ffffff;} #lnk0 a:visited {text-decoration: none;color: #ffffff;} #lnk0 a:hover {text-decoration: none;color: #ffffff;} #lnk0 a:active {text-decoration: none;} /*Black and Yellow color link button*/ #lnk1 a:link {text-decoration: none;color: #000000;} #lnk1 a:visited {text-decoration: none;color: #000000;} #lnk1 a:hover {text-decoration: none;color: #E9F67D;} #lnk1 a:active {text-decoration: none;} /*White and Red color link button*/ #lnk2 a:link {text-decoration: none;color: #FFFFFF;} #lnk2 a:visited {text-decoration: none;color: #FFFFFF;} #lnk2 a:hover {text-decoration: none;color: #fbf204;} #lnk2 a:active {text-decoration: none;} /*Blue and Red color*/ #lnk3 a:link {text-decoration: none;color: #081EF6;} #lnk3 a:visited {text-decoration: none;color: #081EF6;} #lnk3 a:hover {text-decoration: none;color: #FF0000;} #lnk3 a:active {text-decoration: none;} /*Black and Green color*/ #c4 a:link {text-decoration: none;color:#000000;} #c4 a:visited {text-decoration: none;color:#000000;} #c4 a:hover {text-decoration: none;color: #218f04;} #c4 a:active {text-decoration: none;} /*Dark green/bulue and yellow color*/ #lnk5 a:link {text-decoration: none;color: #365b6d;} #lnk5 a:visited {text-decoration: none;color: #365b6d;} #lnk5 a:hover {text-decoration: none;color: #def739;} #lnk5 a:active {text-decoration: none;} /*Blue and Brown color*/ #lnk6 a:link {text-decoration: none;color: #081EF6;} #lnk6 a:visited {text-decoration: none;color: #081EF6;} #lnk6 a:hover {text-decoration: none;color: #7b3003;} #lnk6 a:active {text-decoration: none;} /*Green black and white color*/ #c7 a:link {text-decoration: none;color: #C9D7D4;} #c7 a:visited {text-decoration: none;color: #C9D7D4;} #c7 a:hover {text-decoration: none;color: #FFFFFF;} #c7 a:active {text-decoration: none;} /*Yellow and white color*/ #lnk8 a:link {text-decoration: none;color: #ffffff;} #lnk8 a:visited {text-decoration: none;color: #ffffff;} #lnk8 a:hover {text-decoration: none;color: #f0f300;} #lnk8 a:active {text-decoration: none;} /*Green and dark green color*/ #c9 a:link {text-decoration: none;color: #127502;} #c9 a:visited {text-decoration: none;color: #127502;} #c9 a:hover {text-decoration: none;color: #0a4201;} #c9 a:active {text-decoration: none;} /*gray and yellow color*/ #lnk9 a:link {text-decoration: none;color: #bab6b6;} #lnk9 a:visited {text-decoration: none;color: #bab6b6;} #lnk9 a:hover {text-decoration: none;color: #f0f300;} #lnk9 a:active {text-decoration: none;} /*Box corner will be rounded*/ #menubox1 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/patinet.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox1 a:link {text-decoration: none;color: #0c0ce8;} #menubox1 a:visited {text-decoration: none;color: #081EF6;} #menubox1 a:hover {text-decoration: none;color: #03871c;} #menubox1 a:active {text-decoration: none ;color: #0c0ce8;} #menubox2 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/pca.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox2 a:link {text-decoration: none;color: #0c0ce8;} #menubox2 a:visited {text-decoration: none;color: #081EF6;} #menubox2 a:hover {text-decoration: none;color: #03871c;} #menubox2 a:active {text-decoration: none ;color: #0c0ce8;} #menubox3 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/caregiver.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox3 a:link {text-decoration: none;color: #0c0ce8;} #menubox3 a:visited {text-decoration: none;color: #081EF6;} #menubox3 a:hover {text-decoration: none;color: #03871c;} #menubox3 a:active {text-decoration: none ;color: #0c0ce8;} #menubox4 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/profile.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox4 a:link {text-decoration: none;color: #0c0ce8;} #menubox4 a:visited {text-decoration: none;color: #081EF6;} #menubox4 a:hover {text-decoration: none;color: #03871c;} #menubox4 a:active {text-decoration: none ;color: #0c0ce8;} #menubox5 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/patinetcaregiver.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox5 a:link {text-decoration: none;color: #0c0ce8;} #menubox5 a:visited {text-decoration: none;color: #081EF6;} #menubox5 a:hover {text-decoration: none;color: #03871c;} #menubox5 a:active {text-decoration: none ;color: #0c0ce8;} #menubox6 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/billing.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox6 a:link {text-decoration: none;color: #0c0ce8;} #menubox6 a:visited {text-decoration: none;color: #081EF6;} #menubox6 a:hover {text-decoration: none;color: #03871c;} #menubox6 a:active {text-decoration: none ;color: #0c0ce8;} #menubox7 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/timesheet.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox7 a:link {text-decoration: none;color: #0c0ce8;} #menubox7 a:visited {text-decoration: none;color: #081EF6;} #menubox7 a:hover {text-decoration: none;color: #03871c;} #menubox7 a:active {text-decoration: none ;color: #0c0ce8;} #menubox8 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/info.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox8 a:link {text-decoration: none;color: #0c0ce8;} #menubox8 a:visited {text-decoration: none;color: #081EF6;} #menubox8 a:hover {text-decoration: none;color: #03871c;} #menubox8 a:active {text-decoration: none ;color: #0c0ce8;} #menubox9 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/expiration.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox9 a:link {text-decoration: none;color: #0c0ce8;} #menubox9 a:visited {text-decoration: none;color: #081EF6;} #menubox9 a:hover {text-decoration: none;color: #03871c;} #menubox9 a:active {text-decoration: none ;color: #0c0ce8;} #menubox10 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/expiration.gif); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox10 a:link {text-decoration: none;color: #0c0ce8;} #menubox10 a:visited {text-decoration: none;color: #081EF6;} #menubox10 a:hover {text-decoration: none;color: #03871c;} #menubox10 a:active {text-decoration: none ;color: #0c0ce8;} #menubox11 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/download.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox11 a:link {text-decoration: none;color: #0c0ce8;} #menubox11 a:visited {text-decoration: none;color: #081EF6;} #menubox11 a:hover {text-decoration: none;color: #03871c;} #menubox11 a:active {text-decoration: none ;color: #0c0ce8;} #menubox12 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/payment.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox12 a:link {text-decoration: none;color: #0c0ce8;} #menubox12 a:visited {text-decoration: none;color: #081EF6;} #menubox12 a:hover {text-decoration: none;color: #03871c;} #menubox12 a:active {text-decoration: none ;color: #0c0ce8;} #menubox13 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/assesment.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox13 a:link {text-decoration: none;color: #0c0ce8;} #menubox13 a:visited {text-decoration: none;color: #081EF6;} #menubox13 a:hover {text-decoration: none;color: #03871c;} #menubox13 a:active {text-decoration: none ;color: #0c0ce8;} #menubox14 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/password.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox14 a:link {text-decoration: none;color: #0c0ce8;} #menubox14 a:visited {text-decoration: none;color: #081EF6;} #menubox14 a:hover {text-decoration: none;color: #03871c;} #menubox14 a:active {text-decoration: none ;color: #0c0ce8;} #menubox15 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/expenses.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox15 a:link {text-decoration: none;color: #0c0ce8;} #menubox15 a:visited {text-decoration: none;color: #081EF6;} #menubox15 a:hover {text-decoration: none;color: #03871c;} #menubox15 a:active {text-decoration: none ;color: #0c0ce8;} #menubox16 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/receipt.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox16 a:link {text-decoration: none;color: #0c0ce8;} #menubox16 a:visited {text-decoration: none;color: #081EF6;} #menubox16 a:hover {text-decoration: none;color: #03871c;} #menubox16 a:active {text-decoration: none ;color: #0c0ce8;} #menubox17 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/weblink.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox17 a:link {text-decoration: none;color: #0c0ce8;} #menubox17 a:visited {text-decoration: none;color: #081EF6;} #menubox17 a:hover {text-decoration: none;color: #03871c;} #menubox17 a:active {text-decoration: none ;color: #0c0ce8;} #menubox18 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/expenses.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox18 a:link {text-decoration: none;color: #0c0ce8;} #menubox18 a:visited {text-decoration: none;color: #081EF6;} #menubox18 a:hover {text-decoration: none;color: #03871c;} #menubox18 a:active {text-decoration: none ;color: #0c0ce8;} #menubox19 { border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/howtodo.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox19 a:link {text-decoration: none;color: #0c0ce8;} #menubox19 a:visited {text-decoration: none;color: #081EF6;} #menubox19 a:hover {text-decoration: none;color: #03871c;} #menubox19 a:active {text-decoration: none ;color: #0c0ce8;} #menubox20{ border-radius: 20px; padding: 0px; width: 150px; height: 90px; background: #dde5eb; background: url(images/setting.png); background-position: center; background-size: 150px 90px; background-repeat: repeat; box-shadow: 10px 10px 10px rgba(0,0,0,0.12); } #menubox20 a:link {text-decoration: none;color: #0c0ce8;} #menubox20 a:visited {text-decoration: none;color: #081EF6;} #menubox20 a:hover {text-decoration: none;color: #03871c;} #menubox20 a:active {text-decoration: none ;color: #0c0ce8;} */ /* REQUIRED FILED IDICATION*/ input:required:invalid, input:focus:invalid { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAeVJREFUeNqkU01oE1EQ/mazSTdRmqSxLVSJVKU9RYoHD8WfHr16kh5EFA8eSy6hXrwUPBSKZ6E9V1CU4tGf0DZWDEQrGkhprRDbCvlpavan3ezu+LLSUnADLZnHwHvzmJlvvpkhZkY7IqFNaTuAfPhhP/8Uo87SGSaDsP27hgYM/lUpy6lHdqsAtM+BPfvqKp3ufYKwcgmWCug6oKmrrG3PoaqngWjdd/922hOBs5C/jJA6x7AiUt8VYVUAVQXXShfIqCYRMZO8/N1N+B8H1sOUwivpSUSVCJ2MAjtVwBAIdv+AQkHQqbOgc+fBvorjyQENDcch16/BtkQdAlC4E6jrYHGgGU18Io3gmhzJuwub6/fQJYNi/YBpCifhbDaAPXFvCBVxXbvfbNGFeN8DkjogWAd8DljV3KRutcEAeHMN/HXZ4p9bhncJHCyhNx52R0Kv/XNuQvYBnM+CP7xddXL5KaJw0TMAF8qjnMvegeK/SLHubhpKDKIrJDlvXoMX3y9xcSMZyBQ+tpyk5hzsa2Ns7LGdfWdbL6fZvHn92d7dgROH/730YBLtiZmEdGPkFnhX4kxmjVe2xgPfCtrRd6GHRtEh9zsL8xVe+pwSzj+OtwvletZZ/wLeKD71L+ZeHHWZ/gowABkp7AwwnEjFAAAAAElFTkSuQmCC); background-position: right top; background-repeat: no-repeat; -moz-box-shadow: none; } input:required:valid { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAepJREFUeNrEk79PFEEUx9/uDDd7v/AAQQnEQokmJCRGwc7/QeM/YGVxsZJQYI/EhCChICYmUJigNBSGzobQaI5SaYRw6imne0d2D/bYmZ3dGd+YQKEHYiyc5GUyb3Y+77vfeWNpreFfhvXfAWAAJtbKi7dff1rWK9vPHx3mThP2Iaipk5EzTg8Qmru38H7izmkFHAF4WH1R52654PR0Oamzj2dKxYt/Bbg1OPZuY3d9aU82VGem/5LtnJscLxWzfzRxaWNqWJP0XUadIbSzu5DuvUJpzq7sfYBKsP1GJeLB+PWpt8cCXm4+2+zLXx4guKiLXWA2Nc5ChOuacMEPv20FkT+dIawyenVi5VcAbcigWzXLeNiDRCdwId0LFm5IUMBIBgrp8wOEsFlfeCGm23/zoBZWn9a4C314A1nCoM1OAVccuGyCkPs/P+pIdVIOkG9pIh6YlyqCrwhRKD3GygK9PUBImIQQxRi4b2O+JcCLg8+e8NZiLVEygwCrWpYF0jQJziYU/ho2TUuCPTn8hHcQNuZy1/94sAMOzQHDeqaij7Cd8Dt8CatGhX3iWxgtFW/m29pnUjR7TSQcRCIAVW1FSr6KAVYdi+5Pj8yunviYHq7f72po3Y9dbi7CxzDO1+duzCXH9cEPAQYAhJELY/AqBtwAAAAASUVORK5CYII=); background-position: right top; background-repeat: no-repeat; } /*INPUT SELECT & TEXT BOX TIME*/ .inType select, textarea { width: 100%; padding: 3px 0px 3px 3px; border-radius: 4px; resize: vertical; font-size:15px; } /*Regular table with border for button to display*/ table.bStyle{ margin: 0; background-color:#e9edf5; border-collapse: collapse; border: 1px solid #064E5B; border-radius: 4px; color: #d8e2ec; font-size: 12px; font-weight:normal; } .bStyle td{ height: 25px; padding: 5px; border: 1px solid #e9edf5; color: #000000; font-size: 12px; font-weight:normal; } .bStyle input{ height: 20px; color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .bStyle input:hover{ color:#000000; background-color:#a2cbd2; } .bStyle input:focus{ background-color:#a2cbd2; } /*Regular table with border*/ table.tblstyle{ margin: 0; height:100%; background-color:#eef0f4; border-collapse: collapse; border: 1px solid #064E5B; border-radius: 4px; color: #d8e2ec; font-size: 12px; font-weight:normal; } .tblstyle th{ height: 25px; color:#000000; font-size: 12px; font-weight:normal; } .tblstyle td{ height: 30px; padding: 1px; border: 1px solid #7aaab3; color: #000000; font-size: 12px; font-weight:normal; } .tblstyle input{ height: 20px; color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .tblstyle input:hover{ color:#000000; background-color:#a2cbd2; } .tblstyle input:focus{ background-color:#a2cbd2; } .tblstyle textarea{ color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .tblstyle textarea:hover{ color:#000000; background-color:#a2cbd2; } .tblstyle textarea:focus{ background-color:#a2cbd2; } .tblstyle select{ color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .tblstyle select:hover{ color:#000000; background-color:#a2cbd2; } .tblstyle select:focus{ background-color:#a2cbd2; } .tblstyle input[type=submit] { color: #fff; font-size:15px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #7d99ca; padding: 5px 15px 5px 15px; display:inline-block; height:inherit; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#12af9e), to(#0e9183)); background: -webkit-linear-gradient(top, #12af9e #0e9183); background: -moz-linear-gradient(top, #12af9e, #0e9183); background: -ms-linear-gradient(top, #12af9e, #0e9183); background: -o-linear-gradient(top, #12af9e, #0e9183); background: linear-gradient(to bottom, #12af9e, #0e9183); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#12af9e, endColorstr=#0e9183); } .tblstyle input[type=submit]:hover { cursor: pointer; font-weight:bold; color: #f9e142; border:1px solid #5d7fbc; background-color: #819bcb; background: -webkit-gradient(linear, left top, left bottom, from(#0b7c70), to(#09665c)); background: -webkit-linear-gradient(top, #0b7c70, #09665c); background: -moz-linear-gradient(top, #0b7c70, #09665c); background: -ms-linear-gradient(top, #0b7c70, #09665c); background: -o-linear-gradient(top, #0b7c70, #09665c); background: linear-gradient(to bottom, #0b7c70, #09665c); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0b7c70, endColorstr=#09665c); } .tblstyle input[type=button] { color: #fff; font-size:15px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #7d99ca; padding: 5px 15px 5px 15px; display:inline-block; height:inherit; -webkit-border-radius:3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#12af9e), to(#0e9183)); background: -webkit-linear-gradient(top, #12af9e #0e9183); background: -moz-linear-gradient(top, #12af9e, #0e9183); background: -ms-linear-gradient(top, #12af9e, #0e9183); background: -o-linear-gradient(top, #12af9e, #0e9183); background: linear-gradient(to bottom, #12af9e, #0e9183); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#12af9e, endColorstr=#0e9183); } .tblstyle input[type=button]:hover { cursor: pointer; font-weight:bold; color: #f9e142; border:1px solid #5d7fbc; background-color: #819bcb; background: -webkit-gradient(linear, left top, left bottom, from(#0b7c70), to(#09665c)); background: -webkit-linear-gradient(top, #0b7c70, #09665c); background: -moz-linear-gradient(top, #0b7c70, #09665c); background: -ms-linear-gradient(top, #0b7c70, #09665c); background: -o-linear-gradient(top, #0b7c70, #09665c); background: linear-gradient(to bottom, #0b7c70, #09665c); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0b7c70, endColorstr=#09665c); } /*Table with no border*/ table.emtytblstyle{ margin: 0; padding: 2px; border: 0px; border-spacing:3px; border-collapse: collapse; color: #000000; font-size: 12px; font-weight:normal; } .emtytblstyle tr{ height: 16px; padding: 0px; border: 2px; color:#FFFFFF; font-size: 12px; font-weight:normal; } .emtytblstyle th{ padding: 0px; border: 2px; color:#FFFFFF; font-size: 12px; font-weight:normal; } .emtytblstyle td{ height: 20px; padding: 1px; border: 0px; color: #000000; font-size: 12px; font-weight:normal; } .emtytblstyle input{ height: 20px; color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .emtytblstyle input:hover{ color:#000000; background-color:#a2cbd2; } .emtytblstyle input:focus{ background-color:#a2cbd2; } .emtytblstyle textarea{ color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .emtytblstyle textarea:hover{ color:#000000; background-color:#a2cbd2; } .emtytblstyle textarea:focus{ background-color:#a2cbd2; } .emtytblstyle select{ height: 18px; color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .emtytblstyle select:hover{ color:#000000; background-color:#a2cbd2; } .emtytblstyle select:focus{ background-color:#a2cbd2; } /*==============================================================================================================*//*Table Grid with border*/ /*TABLE STYLE FOR INPUT FORM*/ table.intblstyle{ margin: 0; padding: 2px; border: 1px; border-color: #666666; border-radius: 10px; border-spacing:3px; border-collapse: collapse; color: #000000; font-size: 12px; font-weight:normal; } .intblstyle tr{ padding: 0px; border: 0px; color:#FFFFFF; font-size: 14px; font-weight:normal; } .intblstyle th{ padding: 0px; border: 2px; color:#FFFFFF; font-size: 12px; font-weight:normal; } .intblstyle td{ padding: 0px; border: 0px; color: #000000; font-size: 14px; font-weight:normal; } .intblstyle input{ width: 95%; color:#000000; border: 1px solid #7aaab3; font-weight:normal; padding: 4px; border-radius: 4px; resize: vertical; font-size:14px; } .intblstyle select{ width: 95%; color:#000000; border: 1px solid #7aaab3; font-weight:normal; padding: 0px; border-radius: 4px; resize: vertical; font-size:14px; } .intblstyle input:hover{ color:#000000; background-color:#a2cbd2; } .intblstyle input:focus{ background-color:#a2cbd2; } .intblstyle textarea{ width: 95.5%; color:#000000; border: 1px solid #7aaab3; font-size: 14px; font-weight:normal; } .intblstyle textarea:hover{ color:#000000; background-color:#a2cbd2; } .intblstyle textarea:focus{ background-color:#a2cbd2; } .intblstyle select{ width: 96%; background:#FFFFFF; border-radius: 4px; -webkit-transition: all 0.30s ease-in-out; -moz-transition: all 0.30s ease-in-out; -ms-transition: all 0.30s ease-in-out; -o-transition: all 0.30s ease-in-out; outline: none; padding: 0px 3px 0px 3px; margin: 0px 0px 0px 0px; border: 1px solid #7aaab3; font-size:14px; cursor: pointer; } .intblstyle select:hover{ color:#000000; background-color:#a2cbd2; border: 1px solid rgba(81, 203, 238, 1); box-shadow: 0 0 5px rgba(81, 203, 238, 1); padding: 0px 3px 0px 3px; margin: 0px 0px 0px 0px; font-size:14px; } .intblstyle select:focus{ background-color:#a2cbd2; } .intblstyle option[value=""][disabled] { display: none; } .intblstyle option { color: black; } .intblstyle option:not(:first-of-type) { color: #9A0303; } .intblstyle label { padding: 10px 5px 10px 10px; display: inline-block; font-size:14px; } /* /*Table with button style*/ /* table.btntblstyle{ margin: 0; padding: 5px; border: 0px; border-spacing:3px; border-collapse: collapse; color: #000000; font-size: 12px; font-weight:normal; } .btntblstyle input{ height: 20px; color:#000000; border: 1px solid #7aaab3; font-size: 12px; font-weight:normal; } .btntblstyle input:hover{ color:#000000; background-color:#a2cbd2; } .btntblstyle input:focus{ background-color:#a2cbd2; } */ /* Table Border will very light*/ table.littblstyle{ margin: 0; border-collapse: collapse; border: 1px solid #B8C8C5; color: #000000; font-size: 12px; font-weight:normal; } .littblstyle th{ height: 20px; padding: 0px; border: 1px solid #097a8e; background-color:#064E5B; color:#ffffff; font-size: 10px; font-weight:normal; } .littblstyle tr{ padding: 0px; border: 0px; color:#FFFFFF; font-size: 14px; font-weight:normal; } .littblstyle td{ padding: 0px; border: 0px; color: #000000; font-size: 14px; font-weight:normal; } /* Table Border will very light for all*/ table.litfultbl{ margin: 0; border-collapse: collapse; border: 1px solid #B8C8C5; color: #000000; font-size: 12px; font-weight:normal; } .litfultbl th{ padding: 0px; border: 1px solid #097a8e; background-color:#c9ced0; color:#000000; font-size: 12px; font-weight:normal; } .litfultbl tr{ padding: 0px; border: 1px solid #097a8e; color:#000000; font-size: 12px; font-weight:normal; } .litfultbl td{ padding: 0px; border: 1px solid #097a8e; color:#000000; font-size: 12px; font-weight:normal; } /* Calender Table Border will very light*/ table.caltblstyle{ border-collapse: collapse; } .caltblstyle th{ border: 0px; color:#4b240f; font-size: 18px; font-weight:normal; } .caltblstyle td{ border: 1px solid #978c6e; } /*Hide any object on the page*/ .hidden { display: none; } /*Any button on the page*/ .emtybtn input{ height: 20px; color:#000000; border: 1px solid #064E5B; font-size: 12px; font-weight:normal; border-radius: 5px; } .emtybtn input:hover{ color:#000000; background-color:#a2cbd2; } .emtybtn input:focus{ background-color:#a2cbd2; } /*Banner State text*/ .stateText { width:225px; height:20px; background-image:url(''); margin:0; text-shadow: 3px 3px 3px #000000; color:#c8bd5d; position:relative; top:0px; left:5px; font-size:1.4em; font-weight:bold; } .shadowtext { color: #FFFFFF; background: #b8b8b8; text-shadow: 4px 3px 0 #7A7A7A; } /*FONT POSITION IN Z-INDEX IMAGE*/ /*Banner main text*/ .bannerText { width:0px; height:0px; background-image:url(''); margin:4px; font-size:.8em; font-weight:normal; text-shadow: 3px 3px 3px #000000; color:#ffffff; top:0px; left:4px; } /*Contar Text on home page*/ .countertxt { width:85px; height:20px; background-image:url(''); margin:0; color:#c8bd5d; position:relative; top:0px; left:10px; font-size:.8em; font-weight:normal; } /*Banner middle text*/ .bannerReviewText { height:30px; background-image:url(''); margin:0; text-shadow: 3px 3px 3px #000000; color:#188682; position:relative; top:0px; left:0px; font-size:2em; font-weight:bold; } /* SHADOW IN TABLE HEADER TEXT */ .BnnrText { width:600px; height:30px; background-image:url(''); margin:0; text-shadow: 1px 1px 1px #000000; color:#356a8d; position:relative; top:0px; left:0px; font-size:30px; font-weight:bold; } /* SHADOW IN TABLE HEADER TEXT */ .blackHdrText { height:17px; background-image:url(''); margin:0; color:#000000; position:relative; top:0px; left:10px; font-size:17px; font-weight:bold; } /* SHADOW IN TABLE HEADER TEXT */ .HdrText { height:20px; background-image:url(''); margin:0; text-shadow: 1px 1px 1px #000000; color:#356a8d; position:relative; top:0px; left:10px; font-size:18px; font-weight:bold; } /*SHADOW YELLOW COLOR TEXT HEADER*/ .yHdrText { height:20px; background-image:url(''); margin:0; text-shadow: 1px 1px 1px #000000; color:#d6ce7b; position:relative; top:0px; left:10px; font-size:18px; font-weight:bold; } /*SHADOW GREEN COLOR TEXT HEADER */ .gHdrText { height:20px; background-image:url(''); margin:0; text-shadow: 1px 1px 1px #000000; color:#07740f; position:relative; top:0px; left:10px; font-size:18px; font-weight:bold; } /* SHADOW BLUE COLOR TEXT HEADER*/ .tHdrText { width:250px; height:20px; background-image:url(''); margin:0; text-shadow: 1px 1px 1px #000000; color:#356a8d; position:relative; top:0px; left:10px; font-size:18px; font-weight:bold; } /* SHADOW BLUE COLOR TEXT HEADER*/ .uHdrText { width:400px; height:20px; background-image:url(''); margin:0; text-shadow: 1px 1px 1px #000000; color:#356a8d; position:relative; top:0px; left:10px; font-size:18px; font-weight:bold; } /* SHADOW IN GUIDE WORD */ .guideText { width:600px; height:25px; background-image:url(''); margin:0; text-shadow: 2px 2px 2px #7f9f80; position:relative; top:5px; left:10px; color:#d7ded7; font-size: 14px; } /* PLAN TEXT WILL BE AT THE LEFT OF THE SCREEN */ .plnText { height:20px; background-image:url(''); margin:0; color:#000000; position:relative; top:0px; left:10px; font-size:14px; font-weight:bold; } /*POPUP DIALOG STYLE*/ .hlpOverlay{ position: fixed; top: 0; right: 0; bottom: 0; left: 0; height: 100%; width: 100%; margin: 0; padding: 0; background: #0D302D; opacity: .30; filter: alpha(opacity=30); -moz-opacity: .30; z-index: 500; display: none; } .hlpDialog{ display: none; position:absolute; background-color: #ffffff; border: 1px solid #bbbcbe; padding: 0px; z-index: 500; font-family: Verdana; font-size: 10pt; } .hlpDialogTitl{ background-color: #e6e8ef; border-bottom: solid 2px #d6d8dc; padding: 2px; color: White; font-weight:bold; } .hlpDialogTh{ border-bottom: solid 2px #578E7E; background-color: #72B9A5; padding: 2px; color: #355A5A; font-weight:bold; } .hlpDialogTd{ border-bottom: solid 2px #578E7E; background-color: #98B2AB; padding: 2px; color: #355A5A; font-weight:bold; } /*ALIGN TO THE RIGHT*/ .aRight{ text-align: right; } /*IMAGE FADE OUT/IN*/ .ihver{ opacity:0.8; -moz-opacity: 0.8; -khtml-opacity: 0.8; filter:alpha(opacity=80); /* For IE8 and earlier */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; } .ihver:hover{ opacity:1.0; -moz-opacity: 1.0; -khtml-opacity: 1.0; filter:alpha(opacity=100); /* For IE8 and earlier */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } /*REMOVE BORDER FROM LINK IMAGE*/ /* a:link img,a:visited img{ border-bottom:0px; border-style:none; } */ /*TOOLTIP IMAGE*/ #screenshot{ position:absolute; border:1px solid #064E5B; background:#064E5B; padding:5px; display:none; color:#fff; } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .crtbtn{ color: #000000; font-size:14px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: 1px 1px 1px #000000; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);*/ text-decoration:none; border:1px solid #9eb2b6; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; background-color: #dfe9eb; background: -webkit-gradient(linear, left top, left bottom, from(#dfe9eb), to(#cfd9db)); background: -webkit-linear-gradient(top, #dfe9eb #cfd9db); background: -moz-linear-gradient(top, #dfe9eb, #cfd9db); background: -ms-linear-gradient(top, #dfe9eb, #cfd9db); background: -o-linear-gradient(top, #dfe9eb, #cfd9db); background: linear-gradient(to bottom, #dfe9eb, #cfd9db); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#dfe9eb, endColorstr=#cfd9db); } .crtbtn:hover{ font-weight:bold; color: #000000; border:1px solid #9eb2b6; background-color: #b1c6ca; background: -webkit-gradient(linear, left top, left bottom, from(#c2d8dd), to(#b1c6ca)); background: -webkit-linear-gradient(top, #c2d8dd, #b1c6ca); background: -moz-linear-gradient(top, #c2d8dd, #b1c6ca); background: -ms-linear-gradient(top, #c2d8dd, #b1c6ca); background: -o-linear-gradient(top, #c2d8dd, #b1c6ca); background: linear-gradient(to bottom, #c2d8dd, #b1c6ca); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#c2d8dd, endColorstr=#b1c6ca); } /* GRAY COLOR BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .grybtn{ color: #000000; font-size:12px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: 1px 1px 1px #000000; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);*/ text-decoration:none; border:1px solid #9eb2b6; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #dfe9eb; background: -webkit-gradient(linear, left top, left bottom, from(#dfe9eb), to(#cfd9db)); background: -webkit-linear-gradient(top, #dfe9eb #cfd9db); background: -moz-linear-gradient(top, #dfe9eb, #cfd9db); background: -ms-linear-gradient(top, #dfe9eb, #cfd9db); background: -o-linear-gradient(top, #dfe9eb, #cfd9db); background: linear-gradient(to bottom, #dfe9eb, #cfd9db); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#dfe9eb, endColorstr=#cfd9db); } .grybtn:hover{ font-weight:bold; color: #000000; border:1px solid #9eb2b6; background-color: #b1c6ca; background: -webkit-gradient(linear, left top, left bottom, from(#c2d8dd), to(#b1c6ca)); background: -webkit-linear-gradient(top, #c2d8dd, #b1c6ca); background: -moz-linear-gradient(top, #c2d8dd, #b1c6ca); background: -ms-linear-gradient(top, #c2d8dd, #b1c6ca); background: -o-linear-gradient(top, #c2d8dd, #b1c6ca); background: linear-gradient(to bottom, #c2d8dd, #b1c6ca); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#c2d8dd, endColorstr=#b1c6ca); } /* SKY COLOR BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .skybtn{ color: #000000; font-size:12px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: 1px 1px 1px #000000; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);*/ text-decoration:none; border:1px solid #9eb2b6; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #0993ac; background: -webkit-gradient(linear, left top, left bottom, from(#0993ac), to(#09abc8)); background: -webkit-linear-gradient(top, #0993ac #09abc8); background: -moz-linear-gradient(top, #0993ac, #09abc8); background: -ms-linear-gradient(top, #0993ac, #09abc8); background: -o-linear-gradient(top, #0993ac, #09abc8); background: linear-gradient(to bottom, #0993ac, #09abc8); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0993ac, endColorstr=#09abc8); } .skybtn:hover{ font-weight:bold; color: #000000; border:1px solid #9eb2b6; background-color: #0791aa; background: -webkit-gradient(linear, left top, left bottom, from(#0791aa), to(#12b7d5)); background: -webkit-linear-gradient(top, #0791aa, #12b7d5); background: -moz-linear-gradient(top, #0791aa, #12b7d5); background: -ms-linear-gradient(top, #0791aa, #12b7d5); background: -o-linear-gradient(top, #0791aa, #12b7d5); background: linear-gradient(to bottom, #0791aa, #12b7d5); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0791aa, endColorstr=#12b7d5); } /* ASH COLOR BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .ashbtn{ color: #000000; font-size:12px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: 1px 1px 1px #000000; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);*/ text-decoration:none; border:1px solid #496172; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #a0b9cd; background: -webkit-gradient(linear, left top, left bottom, from(#a0b9cd), to(#91abbf)); background: -webkit-linear-gradient(top, #a0b9cd #91abbf); background: -moz-linear-gradient(top, #a0b9cd, #91abbf); background: -ms-linear-gradient(top, #a0b9cd, #91abbf); background: -o-linear-gradient(top, #a0b9cd, #91abbf); background: linear-gradient(to bottom, #a0b9cd, #91abbf); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#a0b9cd, endColorstr=#91abbf); } .ashbtn:hover{ font-weight:bold; color: #000000; border:1px solid #496172; background-color: #b1c6ca; background: -webkit-gradient(linear, left top, left bottom, from(#7b97ac), to(#69859a)); background: -webkit-linear-gradient(top, #7b97ac, #69859a); background: -moz-linear-gradient(top, #7b97ac, #69859a); background: -ms-linear-gradient(top, #7b97ac, #69859a); background: -o-linear-gradient(top, #7b97ac, #69859a); background: linear-gradient(to bottom, #7b97ac, #69859a); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#7b97ac, endColorstr=#69859a); } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .justbtn{ color: #000000; font-size:14px; font-family:arial, helvetica, sans-serif; /*font-weight:bold; */ /*text-shadow: 1px 1px 1px #000000;*/ /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);*/ text-decoration:none; border:1px solid #9eb2b6; padding: 8px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; background-color: #dfe9eb; background: -webkit-gradient(linear, left top, left bottom, from(#dfe9eb), to(#cfd9db)); background: -webkit-linear-gradient(top, #dfe9eb #cfd9db); background: -moz-linear-gradient(top, #dfe9eb, #cfd9db); background: -ms-linear-gradient(top, #dfe9eb, #cfd9db); background: -o-linear-gradient(top, #dfe9eb, #cfd9db); background: linear-gradient(to bottom, #dfe9eb, #cfd9db); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#dfe9eb, endColorstr=#cfd9db); } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .blubtn{ color: #000000; font-size:14px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: 1px 1px 1px #000000; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);*/ text-decoration:none; border:1px solid #157bf9; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; background-color: #dfe9eb; background: -webkit-gradient(linear, left top, left bottom, from(#c9ddf7), to(#4897f8)); background: -webkit-linear-gradient(top, #c9ddf7 #4897f8); background: -moz-linear-gradient(top, #c9ddf7, #4897f8); background: -ms-linear-gradient(top, #c9ddf7, #4897f8); background: -o-linear-gradient(top, #c9ddf7, #4897f8); background: linear-gradient(to bottom, #c9ddf7, #4897f8); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#c9ddf7, endColorstr=#4897f8); } .blubtn:hover{ font-weight:bold; color: #000000; border:1px solid #4897f8; background-color: #cee2fb; background: -webkit-gradient(linear, left top, left bottom, from(#cee2fb), to(#c9ddf7)); background: -webkit-linear-gradient(top, #cee2fb, #c9ddf7); background: -moz-linear-gradient(top, #cee2fb, #c9ddf7); background: -ms-linear-gradient(top, #cee2fb, #c9ddf7); background: -o-linear-gradient(top, #cee2fb, #c9ddf7); background: linear-gradient(to bottom, #cee2fb, #c9ddf7); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#cee2fb, endColorstr=#c9ddf7); } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .infobtn{ color: #000000; font-size:14px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: 1px 1px 1px #000000; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #157bf9; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; background-color: #dfe9eb; background: -webkit-gradient(linear, left top, left bottom, from(#c9ddf7), to(#4897f8)); background: -webkit-linear-gradient(top, #c9ddf7 #4897f8); background: -moz-linear-gradient(top, #c9ddf7, #4897f8); background: -ms-linear-gradient(top, #c9ddf7, #4897f8); background: -o-linear-gradient(top, #c9ddf7, #4897f8); background: linear-gradient(to bottom, #c9ddf7, #4897f8); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#c9ddf7, endColorstr=#4897f8); } .infobtn:hover{ /*font-weight:bold;*/ color: #000000; border:1px solid #4897f8; background-color: #cee2fb; background: -webkit-gradient(linear, left top, left bottom, from(#cee2fb), to(#c9ddf7)); background: -webkit-linear-gradient(top, #cee2fb, #c9ddf7); background: -moz-linear-gradient(top, #cee2fb, #c9ddf7); background: -ms-linear-gradient(top, #cee2fb, #c9ddf7); background: -o-linear-gradient(top, #cee2fb, #c9ddf7); background: linear-gradient(to bottom, #cee2fb, #c9ddf7); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#cee2fb, endColorstr=#c9ddf7); } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .showbtn{ color: #fff; font-size:12px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #7d99ca; padding: 6px 10px 6px 10px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#12af9e), to(#0e9183)); background: -webkit-linear-gradient(top, #12af9e #0e9183); background: -moz-linear-gradient(top, #12af9e, #0e9183); background: -ms-linear-gradient(top, #12af9e, #0e9183); background: -o-linear-gradient(top, #12af9e, #0e9183); background: linear-gradient(to bottom, #12af9e, #0e9183); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#12af9e, endColorstr=#0e9183); } .showbtn:hover{ cursor:pointer; font-weight:bold; color: #f9e142; border:1px solid #5d7fbc; background-color: #819bcb; background: -webkit-gradient(linear, left top, left bottom, from(#0b7c70), to(#09665c)); background: -webkit-linear-gradient(top, #0b7c70, #09665c); background: -moz-linear-gradient(top, #0b7c70, #09665c); background: -ms-linear-gradient(top, #0b7c70, #09665c); background: -o-linear-gradient(top, #0b7c70, #09665c); background: linear-gradient(to bottom, #0b7c70, #09665c); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0b7c70, endColorstr=#09665c); } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .showbtnblu{ color: #fff; font-size:12px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #7d99ca; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #8badba; background: -webkit-gradient(linear, left top, left bottom, from(#8badba), to(#6b95a6)); background: -webkit-linear-gradient(top, #8badba #6b95a6); background: -moz-linear-gradient(top, #8badba, #6b95a6); background: -ms-linear-gradient(top, #8badba, #6b95a6); background: -o-linear-gradient(top, #8badba, #6b95a6); background: linear-gradient(to bottom, #8badba, #6b95a6); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#8badba, endColorstr=#6b95a6); } .showbtnblu:hover{ cursor:pointer; font-weight:bold; color: #f9e142; border:1px solid #5d7fbc; background-color: #7493a0; background: -webkit-gradient(linear, left top, left bottom, from(#7493a0), to(#507b8d)); background: -webkit-linear-gradient(top, #7493a0, #507b8d); background: -moz-linear-gradient(top, #7493a0, #507b8d); background: -ms-linear-gradient(top, #7493a0, #507b8d); background: -o-linear-gradient(top, #7493a0, #507b8d); background: linear-gradient(to bottom, #7493a0, #507b8d); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#7493a0, endColorstr=#507b8d); } /* Example: Apply for this Job*/ .showbtngry{ color: #fff; font-size:12px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #6e7271; padding: 4px 6px 4px 6px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #959b9a; background: -webkit-gradient(linear, left top, left bottom, from(#959b9a), to(#bdc3c2)); background: -webkit-linear-gradient(top, #959b9a #bdc3c2); background: -moz-linear-gradient(top, #959b9a, #bdc3c2); background: -ms-linear-gradient(top, #959b9a, #bdc3c2); background: -o-linear-gradient(top, #959b9a, #bdc3c2); background: linear-gradient(to bottom, #959b9a, #bdc3c2); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#959b9a, endColorstr=#bdc3c2); } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .hlpbtn{ border:1px solid #7d99ca; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; font-size:14px; font-family:arial, helvetica, sans-serif; padding: 0px 2px 0px 2px; text-decoration:none; display:inline-block; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); font-weight:bold; color: #FFFFFF; background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#12af9e), to(#0e9183)); background: -webkit-linear-gradient(top, #12af9e #0e9183); background: -moz-linear-gradient(top, #12af9e, #0e9183); background: -ms-linear-gradient(top, #12af9e, #0e9183); background: -o-linear-gradient(top, #12af9e, #0e9183); background: linear-gradient(to bottom, #12af9e, #0e9183); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#12af9e, endColorstr=#0e9183); } .hlpbtn:hover{ font-weight:bold; color: #f9e142; border:1px solid #5d7fbc; background-color: #819bcb; background: -webkit-gradient(linear, left top, left bottom, from(#0b7c70), to(#09665c)); background: -webkit-linear-gradient(top, #0b7c70, #09665c); background: -moz-linear-gradient(top, #0b7c70, #09665c); background: -ms-linear-gradient(top, #0b7c70, #09665c); background: -o-linear-gradient(top, #0b7c70, #09665c); background: linear-gradient(to bottom, #0b7c70, #09665c); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0b7c70, endColorstr=#09665c); } /*LOADER WHEN PAGE LOAD*/ #loader{ background: url(images/loader.gif) no-repeat top center fixed; background-size: 100px auto; background-color: transparent; position: absolute; height:100%; width:100%; z-index:1; } #imagbox{ float: right; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } /*========================= CREATE BLUE COLOR TABLE ===========================*/ table.bTable { border: 1px solid #1C6EA4; background-color: #EEEEEE; width: 99.5%; text-align: left; border-collapse: collapse; } table.bTable td, table.bTable th { border: 1px solid #AAAAAA; padding: 2px 2px; } table.bTable tbody td { font-size: 14px; } table.bTable tr:nth-child(even) { background: #D0E4F5; } table.bTable thead { background: #1C6EA4; background: -moz-linear-gradient(top, #5592bb 0%, #327cad 50%, #1C6EA4 75%); background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 50%, #1C6EA4 75%); background: linear-gradient(to bottom, #5592bb 0%, #327cad 50%, #1C6EA4 75%); border-bottom: 2px solid #444444; } table.bTable thead th { font-size: 15px; font-weight: bold; color: #FFFFFF; border-left: 2px solid #D0E4F5; } table.bTable thead th:first-child { border-left: none; } table.bTable tfoot { font-size: 14px; font-weight: bold; color: #FFFFFF; background: #D0E4F5; background: -moz-linear-gradient(top, #dcebf7 0%, #d4e6f6 50%, #D0E4F5 75%); background: -webkit-linear-gradient(top, #dcebf7 0%, #d4e6f6 50%, #D0E4F5 75%); background: linear-gradient(to bottom, #dcebf7 0%, #d4e6f6 50%, #D0E4F5 75%); border-top: 2px solid #444444; } table.bTable tfoot td { font-size: 14px; } table.bTable tfoot .links { text-align: left; } table.bTable tfoot .links a{ display: inline-block; background: #1C6EA4; color: #FFFFFF; padding: 2px 8px; border-radius: 5px; } /*========================= CREATE GREEN COLOR TABLE ===========================*/ table.gTable { border: 1px solid #155118; background-color: #ecf8ed; width: 99.5%; text-align: left; border-collapse: collapse; } table.gTable td, table.gTable th { border: 1px solid #a8daac; padding: 2px 2px; } table.gTable tbody td { font-size: 14px; } table.gTable tr:nth-child(even) { background: #dffae1; } table.gTable thead { background: #1C6EA4; background: -moz-linear-gradient(top, #09910c 0%, #07800a 50%, #077109 75%); background: -webkit-linear-gradient(top, #09910c 0%, #07800a 50%, #077109 75%); background: linear-gradient(to bottom, #09910c 0%, #07800a 50%, #077109 75%); border-bottom: 2px solid #444444; } table.gTable thead th { font-size: 15px; font-weight: bold; color: #FFFFFF; border-left: 2px solid #D0E4F5; } table.gTable thead th:first-child { border-left: none; } table.gTable tfoot { font-size: 14px; font-weight: bold; color: #FFFFFF; background: #D0E4F5; background: -moz-linear-gradient(top, #aed5b1 0%, #bfe8c3 50%, #aed5b1 75%); background: -webkit-linear-gradient(top, #aed5b1 0%, #bfe8c3 50%, #aed5b1 75%); background: linear-gradient(to bottom, #aed5b1 0%, #bfe8c3 50%, #aed5b1 75%); border-top: 2px solid #444444; } table.gTable tfoot td { font-size: 14px; } table.gTable tfoot .links { text-align: left; } table.gTable tfoot .links a{ display: inline-block; background: #1C6EA4; color: #FFFFFF; padding: 2px 8px; border-radius: 5px; } /*========================= CREATE BROWN COLOR TABLE ===========================*/ table.mTable { border: 1px solid #d4b8a3; background-color: #EEEEEE; width: 99.5%; text-align: left; border-collapse: collapse; } table.mTable td, table.mTable th { border: 1px solid #d4b8a3; padding: 2px 2px; } table.mTable tbody td { font-size: 14px; } table.mTable tr:nth-child(even) { background: #fefaf7; } table.mTable thead { background: #1C6EA4; background: -moz-linear-gradient(top, #b6540d 0%, #a84e0b 50%, #914209 75%); background: -webkit-linear-gradient(top, #b6540d 0%, #a84e0b 50%, #914209 75%); background: linear-gradient(to bottom, #b6540d 0%, #a84e0b 50%, #914209 75%); border-bottom: 2px solid #444444; } table.mTable thead th { font-size: 15px; font-weight: bold; color: #FFFFFF; border-left: 2px solid #D0E4F5; } table.mTable thead th:first-child { border-left: none; } table.mTable tfoot { font-size: 14px; font-weight: bold; color: #FFFFFF; background: #D0E4F5; background: -moz-linear-gradient(top, #eee3da 0%, #e5d7cc 50%, #dccbbf 75%); background: -webkit-linear-gradient(top, #eee3da 0%, #e5d7cc 50%, #dccbbf 75%); background: linear-gradient(to bottom, #eee3da 0%, #e5d7cc 50%, #dccbbf 75%); border-top: 2px solid #444444; } table.mTable tfoot td { font-size: 14px; } table.mTable tfoot .links { text-align: left; } table.mTable tfoot .links a{ display: inline-block; background: #1C6EA4; color: #FFFFFF; padding: 2px 8px; border-radius: 5px; } /*========================= CREATE PEST COLOR TABLE ===========================*/ table.pTable { border: 1px solid #c2dad5; background-color: #e0fef8; width: 99.5%; text-align: left; border-collapse: collapse; } table.pTable td, table.pTable th { border: 1px solid #c2dad5; padding: 2px 2px; } table.pTable tbody td { font-size: 14px; } table.pTable tr:nth-child(even) { background: #f0f9f7; } table.pTable thead { background: #1C6EA4; background: -moz-linear-gradient(top, #07ab8a 0%, #05977a 50%, #04846a 75%); background: -webkit-linear-gradient(top, #07ab8a 0%, #05977a 50%, #04846a 75%); background: linear-gradient(to bottom, #07ab8a 0%, #05977a 50%, #04846a 75%); border-bottom: 2px solid #444444; } table.pTable thead th { font-size: 15px; font-weight: bold; color: #FFFFFF; border-left: 2px solid #D0E4F5; } table.pTable thead th:first-child { border-left: none; } table.pTable tfoot { font-size: 14px; font-weight: bold; color: #FFFFFF; background: #D0E4F5; background: -moz-linear-gradient(top, #9fecdd 0%, #8fe5d4 50%, #86e0ce 75%); background: -webkit-linear-gradient(top, #9fecdd 0%, #8fe5d4 50%, #86e0ce 75%); background: linear-gradient(to bottom, #9fecdd 0%, #8fe5d4 50%, #86e0ce 75%); border-top: 2px solid #444444; } table.pTable tfoot td { font-size: 14px; } table.pTable tfoot .links { text-align: left; } table.pTable tfoot .links a{ display: inline-block; background: #1C6EA4; color: #FFFFFF; padding: 2px 8px; border-radius: 5px; } /* DROPDOWN BUTTON */ .dropdown { position: relative; display: inline-block; } .dropdown-content { display: none; background-color: #dbebfb; position: absolute; min-width: 96px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; } .dropdown-content a { color: black; font-size: 12px; text-align: left; font-weight:normal; padding: 5px 5px; text-decoration: none; display: block; } .dropdown-content a:hover {background-color: #f1f1f1} .dropdown:hover .dropdown-content { display: block; } .mainselection { overflow:hidden; width:350px; margin-left:35px; background: url("images/dropdown_arrow.png") no-repeat #fff 319px 2px; /* dropdown_arrow.png is a 31x28 image */ } select { border:0; background:transparent; height:32px; border:1px solid #d8d8d8; width:350px; -webkit-appearance: none; } /*========================================= BUTTON STYLE ===========================================*/ input[type=submit] { color: #fff; font-size:15px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #7d99ca; padding: 5px 15px 5px 15px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#12af9e), to(#0e9183)); background: -webkit-linear-gradient(top, #12af9e #0e9183); background: -moz-linear-gradient(top, #12af9e, #0e9183); background: -ms-linear-gradient(top, #12af9e, #0e9183); background: -o-linear-gradient(top, #12af9e, #0e9183); background: linear-gradient(to bottom, #12af9e, #0e9183); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#12af9e, endColorstr=#0e9183); } input[type=submit]:hover { cursor: pointer; font-weight:bold; color: #f9e142; border:1px solid #5d7fbc; background-color: #819bcb; background: -webkit-gradient(linear, left top, left bottom, from(#0b7c70), to(#09665c)); background: -webkit-linear-gradient(top, #0b7c70, #09665c); background: -moz-linear-gradient(top, #0b7c70, #09665c); background: -ms-linear-gradient(top, #0b7c70, #09665c); background: -o-linear-gradient(top, #0b7c70, #09665c); background: linear-gradient(to bottom, #0b7c70, #09665c); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0b7c70, endColorstr=#09665c); } /*===================== //JUST BUTTON STYLE ========================*/ input[type=button] { color: #fff; font-size:15px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); text-decoration:none; border:1px solid #7d99ca; padding: 5px 15px 5px 15px; display:inline-block; -webkit-border-radius:3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#12af9e), to(#0e9183)); background: -webkit-linear-gradient(top, #12af9e #0e9183); background: -moz-linear-gradient(top, #12af9e, #0e9183); background: -ms-linear-gradient(top, #12af9e, #0e9183); background: -o-linear-gradient(top, #12af9e, #0e9183); background: linear-gradient(to bottom, #12af9e, #0e9183); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#12af9e, endColorstr=#0e9183); } input[type=button]:hover { cursor: pointer; font-weight:bold; color: #f9e142; border:1px solid #5d7fbc; background-color: #819bcb; background: -webkit-gradient(linear, left top, left bottom, from(#0b7c70), to(#09665c)); background: -webkit-linear-gradient(top, #0b7c70, #09665c); background: -moz-linear-gradient(top, #0b7c70, #09665c); background: -ms-linear-gradient(top, #0b7c70, #09665c); background: -o-linear-gradient(top, #0b7c70, #09665c); background: linear-gradient(to bottom, #0b7c70, #09665c); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0b7c70, endColorstr=#09665c); } /*===========================================*/ .divspace { display:inline-block; padding:1px; margin:1px; } .divspacetooltip { margin:0px; padding:0px 0px 0px 10px; } #icondiv{ float: center; width: 10px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; background: lightblue; } #stringdiv { float: left; width: calc(90% - 10px); } /*Blue and Brown color*/ #stringdiv a:link {text-decoration: none;color: #081EF6;} #stringdiv a:visited {text-decoration: none;color: #081EF6;} #stringdiv a:hover {text-decoration: none;color: #7b3003;} #stringdiv a:active {text-decoration: none;} /* ================================== CHECK BOX ================================== */ .cekBox { display: block; position: relative; padding-left: 35px; margin-bottom: 12px; cursor: pointer; font-size: 22px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* Hide the browser's default checkbox */ .cekBox input { position: absolute; opacity: 0; cursor: pointer; } /* Create a custom checkbox */ .checkmark { position: absolute; top: 0; left: 0; height: 25px; width: 25px; background-color: #eee; border: 2px solid #CDC5C5; } /* On mouse-over, add a grey background color */ .cekBox:hover input ~ .checkmark { background-color: #ccc; } /* When the checkbox is checked, add a blue background */ .cekBox input:checked ~ .checkmark { background-color: #ffffff; } /* Create the checkmark/indicator (hidden when not checked) */ .checkmark:after { content: ""; position: absolute; display: none; } /* Show the checkmark when checked */ .cekBox input:checked ~ .checkmark:after { display: block; } /* Style the checkmark/indicator */ .cekBox .checkmark:after { left: 9px; top: 5px; width: 5px; height: 10px; border: solid black; border-width: 0px 5px 3px 0px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } /* Plase holder will display in all input text field gray*/ ::-webkit-input-placeholder { font-size: 12px; color: #ECE9E9; text-align: left; } ::placeholder { opacity: 1; /* Firefox */ font-size: 12px; color: #ECE9E9; text-align: left; } ::-moz-placeholder { /* Code for Firefox */ font-size: 12px; color: #ECE9E9; text-align: left; } ::-ms-input-placeholder { /* Microsoft Edge & Internet Explorer 10-11 */ font-size: 12px; color: #ECE9E9; text-align: left; } /* Plase holder will display in all select field gray*/ input:required:invalid { color: #ECE9E9; } /* Plase holder will display in all select field gray*/ select:required:invalid { color: #ECE9E9; } /*================================================= ===================================================*/ /* - Chrome =56, - Safari 5-10.0 - iOS Safari 4.2-10.2 - Opera 15-43 - Opera Mobile 12-12.1 - Android Browser 2.1-4.4.4 - Samsung Internet =6.2 - QQ Browser */ ::-webkit-input-placeholder { color: #ccc; font-weight: 400; } ::-webkit-select-placeholder { color: #ccc; font-weight: 400; } /* Firefox 4-18 */ :-moz-placeholder { color: #ccc; font-weight: 400; } /* Firefox 19-50 */ ::-moz-placeholder { color: #ccc; font-weight: 400; } /* - Internet Explorer 10–11 - Internet Explorer Mobile 10-11 */ :-ms-input-placeholder { color: #ccc !important; font-weight: 400 !important; } /* - Internet Explorer 10–11 - Internet Explorer Mobile 10-11 */ :-ms-select-placeholder { color: #ccc !important; font-weight: 400 !important; } /* Edge (also supports ::-webkit-input-placeholder) */ ::-ms-input-placeholder { color: #ccc; font-weight: 400; } /* Edge (also supports ::-webkit-input-placeholder) */ ::-ms-select-placeholder { color: #ccc; font-weight: 400; } /* CSS Pseudo-Elements Level 4 Editor's Draft - Browsers not mentioned in vendor prefixes - Browser of newer versions than mentioned in vendor prefixes */ ::placeholder { color: #ccc; font-weight: 400; } /*==================================================*/ /*TOOLTIP TEXT /*==================================================*/ .tooltip { position: relative; display: inline-block; cursor: pointer; } .tooltip .tooltiptext { visibility: hidden; width: 200px; background-color: #e1e4e8; color: #0b0d0e; text-align: left; border-radius: 6px; padding: 5px 0; padding-left: 1em; top: 1.5em; left: 2.4em; font-size: 10px; /* Position the tooltip */ position: absolute; z-index: 1; box-shadow: 0 5px 6px rgba(0, 0, 0, 0.5); border-top: 1px solid #a9aaab; } .tooltip:hover .tooltiptext { visibility: visible; cursor: pointer; } /*=================================================================== SELECT BOX STYLE ===================================================================*/ #selectBox { cursor:pointer; margin: 0px; width: 178px; padding: 4px 6px 4px 6px; border-radius: 3px; font-size: 14px; border: 1px solid #ccc; height: 30px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url("images/selectarrow.png") 97% / 15% no-repeat #eee; background-size: 20px 20px; } /* CAUTION: IE hackery ahead */ #selectBox::-ms-expand { display: none; /* remove default arrow on ie10 and ie11 */ } /* target Internet Explorer 9 to undo the custom arrow */ @media screen and (min-width:0\0) { #selectBox { background:none\9; padding: 5px\9; } } /*=================================================================== //TOOL TIP BOX STYLE ===================================================================*/ .hlptip { border-bottom: 1px dotted #000000; outline: none; position: relative; cursor: pointer; font-size:14px; font-family:arial, helvetica, sans-serif; padding: 0px 2px 0px 2px; text-decoration:none; display:inline-block; text-shadow: -1px -1px 0 rgba(0,0.3,0,0); font-weight:bold; color: #FFFFFF; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px; background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#12af9e), to(#0e9183)); background: -webkit-linear-gradient(top, #12af9e #0e9183); background: -moz-linear-gradient(top, #12af9e, #0e9183); background: -ms-linear-gradient(top, #12af9e, #0e9183); background: -o-linear-gradient(top, #12af9e, #0e9183); background: linear-gradient(to bottom, #12af9e, #0e9183); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#12af9e, endColorstr=#0e9183); } .hlptip span { margin-left: -999em; position: absolute; } .hlptip:hover span { font-family: Calibri, Tahoma, Geneva, sans-serif; font-weight:bold; color: #f8ea8a; position: absolute; left: 1em; top: 2em; z-index: 99; margin-left: 0; width: 275px; transition: 0.3s; border-radius: 5px 5px; border:1px solid #5d7fbc; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -moz-border-radius: 5px; -webkit-border-radius: 5px; -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); background-color: #12af9e; background: -webkit-gradient(linear, left top, left bottom, from(#0b7c70), to(#09665c)); background: -webkit-linear-gradient(top, #0b7c70, #09665c); background: -moz-linear-gradient(top, #0b7c70, #09665c); background: -ms-linear-gradient(top, #0b7c70, #09665c); background: -o-linear-gradient(top, #0b7c70, #09665c); background: linear-gradient(to bottom, #0b7c70, #09665c); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#0b7c70, endColorstr=#09665c); } .hlptip:hover img { border: 0; margin: -10px 0 0 -55px; float: left; position: absolute; } .hlptip:hover em { font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1em; font-weight: bold; display: block; padding: 0.2em 0 0.6em 0; color: #f9e142; font-size:16px; } .custom { padding: 0.5em 0.8em 0.8em 2em; } * html a:hover { background: transparent; } .info { background: #DBC48C; border: 1px solid #9E8956; } /*======================================================= IT WILL HELP TO CREATE DOCUMENT STYLE TO PRINT =======================================================*/ @media screen { div.divFooter { display: inherit; } } @media print,screen{ table.t1 { margin: 1em auto; border-collapse: collapse; font-family: Arial, Helvetica, sans-serif; } .t1 th, .t1 td { padding: 4px 8px; } .t1 thead th { background: #4f81bd; text-transform: lowercase; text-align: left; font-size: 15px; color: #fff; } .t1 tr { border-right: 1px solid #95b3d7; } .t1 tbody tr { border-bottom: 1px solid #95b3d7; } .t1 tbody tr:nth-child(odd) { background: #dbe5f0; } .t1 tbody th, .t1 tbody tr:nth-child(even) td { border-right: 1px solid #95b3d7; } .t1 tfoot th { background: #4f81bd; text-align: left; font-weight: normal; font-size: 10px; color: #fff; } .t1 tr *:nth-child(3), .t1 tr *:nth-child(4) { text-align: right; } } @page { size: A4; margin: 11mm 17mm 17mm 17mm; @bottom-center { content: element(divFooter)} counter-increment: page; @bottom-right { padding-right:20px; content: "Page " counter(page); } } #pageNumber { content: counter(page) } .n { list-style: none; margin-left: -.5em; } .a { list-style-type: circle; margin-left: -.5em; } .b { list-style-type: square; margin-left: -.5em; } .c { list-style-type: upper-roman; margin-left: -.5em; } .d { list-style-type: lower-alpha; margin-left: -.5em; } .e { list-style-image: url('sqpurple.gif'); margin-left: -.5em; } /*CREATE A LINE*/ hr { display: block; height: 0px; border: 0; border-top: 2px solid #ccc; margin: 0em 0; padding: 0; } /*TEXT WITH OVER LINE*/ .txtOverLin { text-decoration: overline; border-top: 1px solid #ccc; line-height: 0.8; } /*================================== LOGIN BOX STYLE ====================================*/ .login { background: #eceeee; border: 1px solid #42464b; border-radius: 6px; top: 100px; height: 257px; margin: 20px auto 0; width: 298px; } .login input[type="password"], .login input[type="text"] { background: url('') center left no-repeat, linear-gradient(top, #d6d7d7, #dee0e0); border: 1px solid #a1a3a3; border-radius: 4px; box-shadow: 0 3px #d6d3d3; box-sizing: border-box; color: #696969; height: 39px; margin: 31px 0 0 29px; padding-left: 37px; transition: box-shadow 0.3s; width: 240px; } .login input[type="password"]:focus, .login input[type="text"]:focus { box-shadow: 0 0 4px 1px rgba(55, 166, 155, 0.3); outline: 0; } .show-password { display: block; height: 16px; margin: 26px 0 0 28px; width: 87px; } .forgot { color: #7f7f7f; display: inline-block; float: right; font: 12px/1 sans-serif; left: -19px; position: relative; text-decoration: none; top: 20px; transition: color .4s; } .forgot:hover { color: #035403 } .login input[type="submit"] { width:240px; height:35px; display:block; font-family:Arial, "Helvetica", sans-serif; font-size:16px; font-weight:bold; color:#fff; text-decoration:none; text-transform:uppercase; text-align:center; text-shadow:1px 1px 0px #37a69b; padding-top:6px; margin: 29px 0 0 29px; position:relative; cursor:pointer; border: none; background-color: #37a69b; background-image: linear-gradient(top,#3db0a6,#3111); border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius:5px; box-shadow: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #497a78, 0px 10px 5px #999; } .login input[type=submit]:hover { font-family:Arial, "Helvetica", sans-serif; font-size:16px; font-weight:bold; color:#edfa62; text-decoration:none; text-transform:uppercase; text-align:center; text-shadow:1px 1px 0px #37a69b; } .login input[type="submit"]:active { top:3px; box-shadow: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #31524d, 0px 5px 3px #999; } .shadow { background: #000; border-radius: 12px 12px 4px 4px; box-shadow: 0 0 20px 10px #000; height: 12px; margin: 30px auto; opacity: 0.2; width: 270px; } /*================================== FORGAT OASSWORD BOX STYLE ====================================*/ .resetpass { background: #eceeee; border: 1px solid #42464b; border-radius: 6px; top: 100px; height: 257px; margin: 20px auto 0; width: 475px; } .resetpass input[type="text"] { background: url('') center left no-repeat, linear-gradient(top, #d6d7d7, #dee0e0); border: 1px solid #a1a3a3; border-radius: 4px; box-shadow: 0 3px #d6d3d3; box-sizing: border-box; color: #696969; height: 39px; margin: 31px 0 0 29px; padding-left: 37px; transition: box-shadow 0.3s; width: 240px; } .resetpass input[type="text"]:focus { box-shadow: 0 0 4px 1px rgba(55, 166, 155, 0.3); outline: 0; } .resetpass input[type="submit"] { width:240px; height:35px; display:block; font-family:Arial, "Helvetica", sans-serif; font-size:16px; font-weight:bold; color:#fff; text-decoration:none; text-align:center; text-shadow:1px 1px 0px #37a69b; padding-top:6px; margin: 29px 0 0 29px; position:relative; cursor:pointer; border: none; background-color: #37a69b; background-image: linear-gradient(top,#3db0a6,#3111); border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius:5px; box-shadow: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #497a78, 0px 10px 5px #999; } .resetpass input[type=submit]:hover { font-family:Arial, "Helvetica", sans-serif; font-size:16px; font-weight:bold; color:#edfa62; text-decoration:none; text-align:center; text-shadow:1px 1px 0px #37a69b; } .resetpass input[type="submit"]:active { top:3px; box-shadow: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #31524d, 0px 5px 3px #999; } .resetpass-shadow { background: #000; border-radius: 12px 12px 4px 4px; box-shadow: 0 0 20px 10px #000; height: 12px; margin: 30px auto; opacity: 0.2; width: 450px; } /*AUTOMATE SEARCH FIELD*/ .searchfield{ width: 50%; /*if it is change to width: 130px; it willbe automated*/ box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px 0px 0px 4px; font-size: 16px; background-color: white; background-image: url('images/searchicon.png'); background-position: 10px 10px; background-repeat: no-repeat; padding: 5px 5px 6px 5px; -webkit-transition: width 0.4s ease-in-out; transition: width 0.4s ease-in-out; } .searchfield:focus { width: 50%; } /* BUTTON WILL BE CREATED*/ /* Example: Apply for this Job*/ .searchbtn{ color: #000000; font-size:12px; font-family:arial, helvetica, sans-serif; font-weight:bold; text-shadow: 1px 1px 1px #000000; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);*/ text-decoration:none; border:1px solid #9eb2b6; padding: 8px 15px 6px 4px; display:inline-block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 0px 4px 4px 0px; background-color: #dfe9eb; background: -webkit-gradient(linear, left top, left bottom, from(#dfe9eb), to(#cfd9db)); background: -webkit-linear-gradient(top, #dfe9eb #cfd9db); background: -moz-linear-gradient(top, #dfe9eb, #cfd9db); background: -ms-linear-gradient(top, #dfe9eb, #cfd9db); background: -o-linear-gradient(top, #dfe9eb, #cfd9db); background: linear-gradient(to bottom, #dfe9eb, #cfd9db); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#dfe9eb, endColorstr=#cfd9db); } .searchbtn:hover{ font-weight:bold; color: #000000; border:1px solid #9eb2b6; background-color: #b1c6ca; background: -webkit-gradient(linear, left top, left bottom, from(#c2d8dd), to(#b1c6ca)); background: -webkit-linear-gradient(top, #c2d8dd, #b1c6ca); background: -moz-linear-gradient(top, #c2d8dd, #b1c6ca); background: -ms-linear-gradient(top, #c2d8dd, #b1c6ca); background: -o-linear-gradient(top, #c2d8dd, #b1c6ca); background: linear-gradient(to bottom, #c2d8dd, #b1c6ca); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#c2d8dd, endColorstr=#b1c6ca); } .overlays { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.7); transition: opacity 500ms; visibility: hidden; opacity: 0; } .overlays:target { visibility: visible; opacity: 1; } .popups { margin-top: 150px; padding: 20px; background: #fff; border-radius: 5px; width: 40%; /* Position the tooltip */ position:relative; z-index: 1; transition: all 5s ease-in-out; } .popups h3 { margin-top: 0px; left:10px; color: #333; font-family: Tahoma, Arial, sans-serif; } .popups .closes { position: absolute; top: 15px; right: 25px; transition: all 200ms; font-size: 30px; font-weight: bold; text-decoration: none; color: #333; } .popups .closes:hover { color: #b41108; } .popups .contents { max-height: 30%; overflow: auto; } @media screen and (max-width: 700px){ .popups{ width: 70%; } }