/* ICONS */

td.icon {
	width:16px;
	height: 16px;
	position: relative;
	}

span.icon {
	position: relative;
	top:0.2em;
	}
	
div.viewheader span.icon{
	top: 0.1em;
}

td span.icon {
	top: auto;
}

.icon > a, .icon > input {
	display:block;
	width:16px;
	height:16px;
	background-color: transparent;
	background-image: url(../images/connected/iconsprite.png?ver=2019-01-14) !IMPORTANT;
	background-repeat: no-repeat;
	background-position: 1px 1px;
	border: none;
	color: transparent !IMPORTANT;
	cursor: pointer;
	margin: 0;
	padding:0;
	}

.icon span {
	display: inline-block;
}

.icon > a:hover, .icon > input:hover {
	background-color: transparent !IMPORTANT;
	background-image: url(../images/connected/iconsprite.png?ver=2019-01-14) !IMPORTANT;
	}

td.icon a {
	margin: auto;
}

span.icon > a {
	display: inline-block;
}

.icon > input:focus {
	outline:none;
}

.icon .edit {background-position: -1px -1px; }
.icon .edit:hover {background-position: -1px -18px; }
.icon .edit-off {background-position: -1px -35px; }

.icon .view {background-position: -18px -1px; }
.icon .view:hover {background-position: -18px -18px; }
.icon .view-off {background-position: -18px -35px; }

.icon .delete {background-position: -35px -1px; }
.icon .delete:hover {background-position: -35px -18px; }
.icon .delete-off {background-position: -35px -35px; }

.icon .tick {background-position: -52px -1px; }
.icon .tick:hover {background-position: -52px -18px; }
.icon .tick-off {background-position: -52px -35px; }

.icon .contact {background-position: -69px -1px; }
.icon .contact:hover {background-position: -69px -18px; }
.icon .contact-off {background-position: -69px -35px; }

.icon .send {background-position: -86px -1px; }
.icon .send:hover {background-position: -86px -18px; }
.icon .send-off {background-position: -86px -35px; }

.icon .calendar {background-position: -103px -1px; }
.icon .calendar:hover {background-position: -103px -18px; }
.icon .calendar-off {background-position: -103px -35px; }

.icon .add {background-position: -120px -1px; }
.icon .add:hover {background-position: -120px -18px; }
.icon .add-off {background-position: -120px -35px; }

.icon .download {background-position: -137px -1px; }
.icon .download:hover {background-position: -137px -18px; }
.icon .download-off {background-position: -137px -35px; }

.icon .weblink {background-position: -154px -1px; }
.icon .weblink:hover {background-position: -154px -18px; }
.icon .weblink-off {background-position: -154px -35px; }

.icon .history {background-position: -171px -1px; }
.icon .history:hover {background-position: -171px -18px; }
.icon .history-off {background-position: -171px -35px; }

.icon .save {background-position: -188px -1px; }
.icon .save:hover {background-position: -188px -18px; }
.icon .save-off {background-position: -188px -35px; }

.icon .order {background-position: -205px -1px; }
.icon .order:hover {background-position: -205px -18px; }
.icon .order-off {background-position: -205px -35px; }

.icon .play {background-position: -222px -1px; }
.icon .play:hover {background-position: -222px -18px; }
.icon .play-off {background-position: -222px -35px; }

.icon .journal {background-position: -239px -1px; }
.icon .journal:hover {background-position: -239px -18px; }
.icon .journal-off {background-position: -239px -35px; }

.icon .certificate {background-position: -256px -1px; }
.icon .certificate:hover {background-position: -256px -18px; }
.icon .certificate-off {background-position: -256px -35px; }

.icon .lastpage, .icon .restore {background-position: -273px -1px; }
.icon .lastpage:hover, .icon .restore:hover  {background-position: -273px -18px; }
.icon .lastpage-off, .icon .restore-off  {background-position: -273px -35px; }

.icon .error {background-position: -290px -1px; }
.icon .error:hover {background-position: -290px -18px; }
.icon .error-off {background-position: -290px -35px; }

.icon .alert {background-position: -307px -1px; }
.icon .alert:hover {background-position: -307px -18px; }
.icon .alert-off {background-position: -307px -35px; }

.icon .null {background-position: -324px -1px; }
.icon .null:hover {background-position: -324px -18px; }
.icon .null-off {background-position: -324px -35px; }

.icon .login {background-position: -341px -1px; }
.icon .login:hover {background-position: -341px -18px; }
.icon .login-off {background-position: -341px -35px;}

.icon .up {background-position: -358px -1px; }
.icon .up:hover {background-position: -358px -18px; }
.icon .up-off {background-position: -358px -35px;}

.icon .down {background-position: -375px -1px; }
.icon .down:hover {background-position: -375px -18px; }
.icon .down-off {background-position: -375px -35px;}

.icon .user {background-position: -392px -1px; }
.icon .user:hover {background-position: -392px -18px; }
.icon .user-off {background-position: -392px -35px;}

.icon .info {background-position: -409px -1px; }
.icon .info:hover {background-position: -409px -18px; }
.icon .info-off {background-position: -409px -35px;}

.icon .star {background-position: -426px -1px; }
.icon .star:hover {background-position: -426px -18px; }
.icon .star-off {background-position: -426px -35px;}

.icon .flag {background-position: -443px -1px; }
.icon .flag:hover {background-position: -443px -18px; }
.icon .flag-off {background-position: -443px -35px;}

.icon .bluetick {background-position: -460px -1px; }
.icon .bluetick:hover {background-position: -460px -18px; }
.icon .bluetick-off {background-position: -460px -35px;}

.icon .refresh {background-position: -477px -1px; }
.icon .refresh:hover {background-position: -477px -18px; }
.icon .refresh-off {background-position: -477px -35px;}

.icon .tickbox {background-position: -494px -1px; }
.icon .tickbox:hover {background-position: -494px -18px; }
.icon .tickbox-off {background-position: -494px -35px;}


span.mini-icons {
	display: inline-block;
	padding:0;
	margin: -3px 0 0 6px;
	list-style:none;
	position:relative;
	top:1px;
	white-space: nowrap
	}

span.mini-icons a, span.mini-icons > input {
	position: static;
	display: inline-block;
	width:12px;
	height:12px;
	background-color: transparent !IMPORTANT;
	background-image: url(../images/connected/mini-icons.png) !IMPORTANT;
	background-repeat: no-repeat;
	background-position: 0 0;
	opacity:0.5;
    filter: alpha(opacity = 50);
    border:  0px transparent;
    color:transparent !IMPORTANT;
	padding: 0;
	}

span.mini-icons a:hover, span.mini-icons input:hover {
	opacity:1.0;
    filter: alpha(opacity = 100);
    cursor: pointer;
    }

span.mini-icons a.off, span.mini-icons input.off {
	opacity:0.2;
    filter: alpha(opacity = 20);	
    }

span.mini-icons input:focus {
	outline: none;
    }

span.mini-icons a.edit, span.mini-icons li input.edit {background-position: 0 0px; }
span.mini-icons a.delete, span.mini-icons input.delete {background-position: -24px 0px; }
span.mini-icons a.tick, span.mini-icons input.tick {background-position: -12px 0px; }
span.mini-icons a.up, span.mini-icons input.up {background-position: -36px 0px; }
span.mini-icons a.down, span.mini-icons input.down {background-position: -48px 0px; }
span.mini-icons a.left, span.mini-icons input.left {background-position: -60px 0px; }
span.mini-icons a.right, span.mini-icons input.right {background-position: -72px 0px; }
span.mini-icons a.add, span.mini-icons input.add {background-position: -84px 0px; }
span.mini-icons a.view, span.mini-icons input.view {background-position: -96px 0px; }

/* USER NOTIFICATIONS */

#notification-display {
	display:block;
	background: #eee url(../images/info-icon.png?ver=2016-10-24) no-repeat;
	border: solid 3px #ddd;
	background-size: 60px;
	background-position: 10px 15px;
	margin: 15px;
	padding: 15px 25px 35px 90px ;
	position: relative;
}

#notification-display h4 {
	color: blue;
	font-size: 1.1em;
	margin: 0;
}

a#close-notification {
	display: lock;
	cursor: pointer;
	font-weight: bold;
	color: #c3801a;
	background-color: #ddd;
	padding: 5px 10px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

a#close-notification:hover {
	color: #888;
	background-color: #d6d6d6;
}

/* DUMP DIV */
div.dump {
	clear: both;
	background-color:#cec;
	width:780px;
	padding: 20px 20px 10px;
	margin-left:auto;
	margin-right:auto
	}