﻿
.internalNotificationContainer {
	float: right;
	position: relative;
	/*width: 200px;*/
	width: 40px;
	z-index: 7777;
	height: 20px;
}

#divUnreadInternalNotificationContainer
{
	position:absolute;
	right: 0;
	top: 0px;
	height: 16px;
	text-align: center;
	background-color: #ff0000;
	color: #fff;
	font-size: 10px;
	font-weight: bold;
	line-height: 16px;
	padding: 0 5px;
}

#divInternalNotificationTextContainer
{
	 line-height: 52px;
	 text-align: center;
	 font-size: 18px;
	 color:#fff;
	 cursor:pointer;
}

#divInternalNotificationTextContainer:hover, #divInternalNotificationTextContainer.expanded
{
	color: #0098C0;
}

#divInternalNotifications {
	position: absolute;
	top: 41px;
	/*left: -135px;*/
	height: 400px;
	width: 302px;
	padding-top: 18px;
	/*background-image: url('../images/dropDownHeader.png');*/
	background-repeat: no-repeat;
	background-position: center top;
	filter: drop-shadow(2px 2px 3px var(--background-color-light-65, rgba(68, 68, 68 , 0.65)));
}

#divInternalNotifications .arrow {
    position: absolute;
    left: 30%;
    top: 0;
    height: 0;
    width: 0;
    margin-left: 0;
}
	#divInternalNotifications .arrow.first {
		border-width: 0 0 21px 21px;
		border-color: transparent transparent var(--main-blue, #0098c0);
		border-style: solid;
		top: -2px;
		left: calc(30% - 1px);
	}

	#divInternalNotifications .arrow.second {
		border-color: transparent transparent var(--main-blue, #0098c0);
		border-bottom: 19px solid var(--background-color-widget, #171717);
		border-right: 0 solid transparent;
		border-left: 19px solid transparent;
		border-style: solid;
	}

#divInternalNotficationContainer {
	background-color: var(--background-color-widget, #171717);
	border: 1px solid var(--main-blue, #0098c0);
	border-bottom: 0 none;
	border-radius: var(--border-radius-main, 4px) var(--border-radius-main, 4px) 0 0;
}

	#divInternalNotficationContainer .title {
		text-transform: uppercase;
		font-size: 9pt;
		border-bottom: 1px solid var(--border-color-main, #444);
		margin: 0 10px;
		padding: 5px 0;
		color: var(--main-blue, #0098c0);

		justify-content: space-between;
	}

	#divInternalNotficationItems {
		height: 342px;
		color: var(--text-color, #ccc);
		overflow-x: hidden;
		overflow-y: auto;
	}

	#divInternalNotficationItems .item {
		background-color: var(--background-color-light, #666);
		min-height: 50px;
		border-bottom: none;
		cursor: pointer;
		font-size: 8pt;
		color: var(--text-color, #ccc);
	}
		#divInternalNotficationItems .item table tr:first-child {
			color: var(--main-blue, #0098C0);
		}

		#divInternalNotficationItems .item > div:first-child {
			padding: 5px;
		}

		#divInternalNotficationItems .item > div:last-child {
			border-bottom: solid 1px var(--border-color-main, #444);
			margin: 0 10px 0 10px;
			padding-bottom: 10px;
		}


#divInternalNotficationItems .item:hover
{
	background-color:var(--background-color-hover, #2b2b2b);
}
#divInternalNotficationItems table.loading {
	background-color: inherit;
}

#divInternalNotficationItems div table
{
	width: 100%;
	table-layout: fixed;
}

#divInternalNotficationItems div table tr td
{
	vertical-align: top;
	/*overflow: hidden;*/
	/*white-space:nowrap;*/
}
#divInternalNotficationItems .msg-box {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
}

#divInternalNotficationItems div table tr td.status
{
	text-align:right;
	width: 50px;
}

#divInternalNotficationItems div table tr:first-child
{
	width: 60px;
	font-weight: bold;
}

	#divInternalNotficationItems .unread {
		background-color: var(--backgroundColor, #171717);
	}

#divInternalNotficationItems .highimportance
{
	background-color:red;
}


.internalNotificationsFooter {
	background-color: var(--background-color-widget, #171717);
	border-color: var(--main-blue, #0098c0);
	border-style: solid;
	border-width: 0 1px 1px 1px;
	font-size: 8pt;
	color: #eee;
	cursor: pointer;
	gap: 5px;
	padding: 0 5px 5px 5px;
	border-radius: 0 0 var(--border-radius-main, 4px) var(--border-radius-main, 4px);
}

.internalNotificationsFooter div
{
	line-height: 28px;
	text-align:center;
	border: 0;
	cursor: pointer;
	padding-left: 0;
	padding-right: 0;
}
/*
.internalNotificationsFooter div:hover
{
	background-color:#888;
	color: #fff;
}*/

#divShowAllInternalNotifications
{
	width: 118px;
}

#divCreateNewInternalNotification
{
	width: 80px;
}

#divRefreshInternalNotifications
{
	width: 100px;
}


	



