:root {

	--taille-sprite: 32px;
}

body {

	margin:  0;
	padding:  0;
}


#aside {
	width:  33vw;
}

#mapview {

	width:  66vw;
}


#mapview #geoPoint {

	padding: 1rem;
	position: fixed;
	top: 0;
	left: 0;
	display: inline-block;
}



main {

	overflow: auto;
}


#map {

	margin:  auto;

	margin-top: 2vh;
	height: 94vh;
	width: 94vh;

	border-width: 0.125rem;
	border-radius:  33vw;

	position:  relative;

	overflow: hidden;
}

#map-deco {

	position:  absolute;
	left:  0%;
	top: 0%;
	width: 100%;
	height: 100%;
	border-radius:  33vw;
}


#mapview {

	position: relative;
}

#mapview #zoom {

	position: absolute;
	bottom: 0;
	right: 0;

	padding:  0.5rem 1rem;
}

#map .place, 
#map .player {

	position:  absolute;
}



#map .place header {

	z-index: 50;
}


#map .place a:active + article,
#map .place a:focus + article {

	z-index: 100;

	display:  block;
	
	position:  fixed;
	top:  0;
	right:  0;

	width:  33vw;
	overflow: hidden;
	/*box-shadow:  0.125rem 0.125rem 1em black;*/
}









#place-details {

	position:  fixed;
	top:  0;
	right: 0;
	width:  33vw;
	height:  100vh;

	padding:  0rem;
	
}

#place-details > * {

	margin-left: 1rem;
	margin-right: 1rem;
}

#place-details > .place-name {

	margin:  0;
	padding:  1rem;

	text-align:  center;
}

#place-details > address {

	text-align: center;

	margin-top: 0.5rem;
}

#place-details > h4 {

	margin-left: 0;
	margin-right: 0;
	padding: 0.5rem 1rem;
	background: var(--panel-place-name-bg-color);
}



#messenger-page main {

  display: flex;
}

#messenger-page #conversations-list {

  width: 33.333vw;
}

#messenger-page #conversation {

  width: 66.666vw;
}

#messenger-page #msgList {

	overflow: hidden;
}

#messenger-page ul#msgList {

	list-style: none;
	margin: 0;
	padding: 0;
}

#messenger-page ul#msgList li {

	margin: 0;
	padding: 0;
	margin-bottom: 2rem;
	width:  50%;
}

#messenger-page .penpal {

	padding: 1rem 1rem;
	margin-top: 0;
}

#messenger-page #msgList .message.in {

	float: left;
	margin-left: 2%;
}

#messenger-page #msgList .message.out {

	float: right;
	margin-right: 2%;
}

#messenger-page #msgList .message > * {

	margin-left: 1rem;
	margin-right: 1rem;
}

#messenger-page #msgList .message .date {

	text-align: right;
}


#messenger-page ul#conversations-list {

	list-style: none;
	margin: 0;
	padding: 0;
}

#messenger-page ul#conversations-list li {

	margin: 0;
	padding: 0.5rem 1rem;
}

#messenger-page #conversations-list .conversation {

	position: relative;
}

#messenger-page #conversations-list .conversation .conv-link, 
#messenger-page #conversations-list .conversation .conv-link a {

	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#messenger-page #conversations-list .conversation .avatar {

	float:  left;
}

#messenger-page #conversations-list .conversation .conv-link a span {

	display: none;
}


#messenger-page #conversations-list .conversation blockquote {

	margin:  0;
}


#messenger-page #conversations-list .conversation blockquote time {

	position:  absolute;
	top: 0;
	right: 0;
}