#sharingPanel {
	position: fixed;
	top: 160px;
	right: -200px;
	font-family: 'robotoCondensed';
	width: 176px;
	z-index: 1000;
	box-shadow: -5px 0 28px 4px rgba(109, 109, 109, 0.567),
	0 5px 28px 4px rgba(86, 86, 86, 0.567),
	0 -5px 28px 4px rgba(86, 86, 86, 0.567);
	border-left: 1px solid #979797;
}

.sharingHd {
	font-weight: 800;
	height: var(--d48);
	background-color: var(--panelHdBck);
}

.sharingItems {
	font-size: 1.1em;
	height: var(--d48);
	background-color: var(--panelBackground);
	color: var(--textDarkGray);
	border-bottom: 1px dotted var(--containerBorder);
}

#sharingTitle {
	float: left;
	margin-left: 16px;
	font-size: 1.2em;
	font-weight: 800;
	color: white;
	line-height: var(--d48);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	width: 106px;

}

#closeSharing {
	float: left;
	width: var(--d48);
	height: var(--d48);
}

#closeSharing img {
	width: inherit;
	height: inherit;
	background-color: var(--closeImgBck);
}


.sharingItems a {
	box-sizing: border-box;
	float: left;
	width: var(--d48);
	height: var(--d48);
}

.sharingItems img {
	width: var(--d48);
	height: var(--d48);
	float: left;
	background-color: white;
}

.sharingItems p {
	font-family: 'robotoCondensed';
	float: left;
	line-height: var(--d48);
	margin-left: 25px;
	width: 100px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;

}

/* //////////////////////// Email /////////////////////////// */

#emailWindow {
	position: absolute;
	background-color: rgba(53, 53, 53, 0.7);
	height: 100%;
	width: 100%;
	display: none;
	opacity: 0;
	z-index: 5500;
}

#closeEmailForm {
	position: absolute;
	font-family: "robotoMono";
	display: block;
	width: 1.5em;
	height: 1.5em;
	top: -1em;
	right: -1em;
	padding-bottom: 3px;
	padding-left: 2px;
	background-color: var(--darkGray);
	border-radius: 1.5em;
	text-align: center;
	color: white;
	font-weight: 800;
	border: 3px solid white;
	line-height: 1.6em;
}

#emailForm {
	position: absolute;
	top: calc(50vh - 249px);
	left: calc(50vw - 370px);
	width: 740px;
	height: 498px;
	background: url("../sharing/background.jpg");
	border: 1px solid gray;
}

#emailForm label {
	font: 1.05em "PT_Sans_Narrow";
	display: inline-block;
	width: 10em;
	text-align: right;
}

#emailTo, #emailTopic, #emailFrom {
	position: absolute;
 left: 270px;
}

#emailFrom {
 top : 180px;

}
#emailTo {
 top: 234px;
}

#emailTopic {
 top: 286px;
}

#message {
	padding-left: 20px;
	padding-top: 15px;
}

#emailMessage {
 position: absolute;
 left : 20px;
 top : 40px;
}

#message label {
	text-align: left;
	width: auto;
}

#emailFrom input, #emailTo input, #emailTopic input {
	background-color: var(--lightGray1);
	border-radius: 3px;
	height: 2.5em;
	width: 240px;
}

#emailForm input, #emailForm textarea {
 font: 0.9em "handwriting", sans-serif;
 border: none;
 padding: 0 10px;
 margin: 0;
 background: none;
}


#emailForm input:focus, #emailForm textarea:focus {
 background: rgba(0,0,0,.1);
 border-radius: 5px;
 outline: none;
}


#emailForm input[type=reset] {
	visibility: hidden;
}

#emailForm textarea {
 display : block;
 padding : 10px;
 margin : 10px 0 0 0;
 width  : 320px;
 height : 350px;
 resize : none;
 overflow: auto;
 border-radius: 4px;
 background-color: var(--lightGray0);
}


#emailForm button {
 position   : absolute;
 left     : 530px;
 top     : 380px;
 width: 120px;
 height: 30px;
 padding   : 5px;
 font     : 0.65em sans-serif;
 border    : 2px solid var(--darkGray);
 border-radius: 5px;
 background  : none;
 cursor    : pointer;
 transform: rotate(-1.5deg);
}

#emailForm button:hover,
#emailForm button:focus {
 outline  : none;
 font-weight: bold;
 font-size: 0.7em;
 /* background-color: #a9a9a9;
 color: white;
 border: 2px solid #c7c7c7; */

}


/* ////////////// Twitter /////////////////// */


#twitterPanel {
	position: absolute;
	top: 100vh;
	width: 30em;
	height: 20em;
	margin: 0 auto;
	background-color: aqua;
}