#contact-dataTableContainer {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	scrollbar-color: rgba(255, 255, 255, 0.25) #222629;
	scrollbar-width: thin;
}	

#media-dataTableContainer::-webkit-scrollbar {
	width: 10px;
}

#media-dataTableContainer::-webkit-scrollbar-track {
	background: #222629;
}

#media-dataTableContainer::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.25);
	border-radius: 8px;
}

#contact-dataTable {
	width: 100%;
	height: 100%;
	text-align: left;
	color: #FFFFFF;
	margin: 0 0 0 0;
	border-collapse: separate;
	border-spacing: 0.4vw 0.4vh;
}

#contact-dataTable td {
  	border: 0.1vh solid #222222;
	border-radius: 4px;
	padding: clamp(0.5em, 1.6vw, 1em);
}

.contact-fieldName {
	font-family: "Courier New", Courier, monospace;
	font-size: max(1.7vmin, 14px);
	color: #7F8EC0;
	font-weight: bold;
	text-shadow: none;
	line-height: 1;
	display: block;
	margin-bottom: 0;
	text-wrap: nowrap
}

.contact-fieldValue {
	font-family: "Courier New", Courier, monospace;
	font-size: max(1.7vmin, 14px);
	width: 100%;
	color: #FFFFFF;
	/*background-color: rgba(34, 34, 34, 0.75);*/
	background-color: #000000;
	border: 0.1vmin solid #666666;
	resize: none
}

.contact-fieldValue:disabled {
	color: #DEDEDE;
	background: #666666; /* browser che non supportano rgba */
	background: rgba(102, 102, 102, 0.75)
}

#contact-message {
	height: 94%;
	margin-top: 0.8dvh;
}

#contact-action {
	font-family: "Courier New", Courier, monospace;
	font-size: max(1.7vmin, 14px);
	font-weight: 900;
	text-align: center;
	padding: 0;
	background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
	transition: background 120ms ease;
}

.contact-actionEnabled {
	cursor: default
}

.contact-actionEnabled:hover {
	background-color: rgba(255, 255, 255, 0.25) !important;
	cursor: pointer;	
}

.contact-actionDisabled {
	opacity: 0.45;
	cursor: default
}

@media (orientation: portrait) {
	#contact-status {
		letter-spacing: -1px;
	}
}

#contact-linksContainer {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 0;
}

#contact-logo-image,
#contact-logo-glow {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: suto;
}

#contact-logo-glow {	
    opacity: 0;
	animation: glowFade 5s infinite linear;
}

@keyframes glowFade {
	0%   { opacity: 0 }
	5%  { opacity: 1 }
	10% { opacity: 0 }
	100% { opacity: 0 }
}

.contact-socialIconsContainer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between; /* colonne agli estremi */
	gap: 2dvh 0px; /* verticale / orizzontale */
	position: absolute;
	bottom: 0;
	left: 2vw;
	width: 100%;
	height: auto;
	padding: 0; 
	margin: 0;
}

.contact-socialIconsItem {
	display: flex;
	align-items: center;
	flex: 1 1 50%;
	gap: 1vw;
	font-size: max(1.7vmin, 14px);
	color: #FFFFFF;
	text-wrap: nowrap;
	transition: color 0.3s;
	text-shadow:
		-0.1rem -0.1rem 0 black,
		0.1rem -0.1rem 0 black,
		-0.1rem  0.1rem 0 black,
		0.1rem  0.1rem 0 black;
}

.contact-socialIconsItem:hover {
	filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.8));
	cursor: pointer
}

.contact-socialIconsItem img {
	height: auto;
	width: 3vmin;
	min-height: 15px;
	display: block
}

.contact-socialIconsItem span {
	display: inline-block; 
	line-height: 1;
}