html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;

	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
}

img
{
	-webkit-touch-callout: none;

	-webkit-user-select: none;
	user-select: none;
	-moz-user-select: none;
}

textarea
{
	user-select: text;
	-webkit-user-select: text;
	-moz-user-select: text;
}

input[type="button"],input[type="submit"]
{
	font-size: 125%;
}

.table
{
	line-height:175%;
}

.menubar
{
	z-index:1;
	background-color:#B5D3E5;
	position:absolute;
	top:-51px;
	left:0;
	font-size: 150%;
	width:100%;
	text-align:center;

	display:none;

	-webkit-transition: top 0.3s ease-out;
}

.touchmenu
{
	z-index:1;
	background-color:#e0e9db;

	position:absolute;
	top:40px;
	left:20px;
	font-size: 150%;

	display:none;

	aaa-webkit-transition: all 0.3s ease-out;
}

.touchmenu tr
{
	background-color:#B5D3E5;
}

.touchalert
{
	z-index:2;
	background-color:#B5D3E5;

	position:absolute;
	top:0px;
	left:0px;
	afont-size: 125%;

	display:none;

	-webkit-transition: all 0.3s ease-out;
}

.touchalert tr
{
	abackground-color:#e0e9db;
	background-color:#f0f9eb;
}

a.touchalert input[type="button"]
{
	font-size: 100%;
}

.debug
{
	background-color:white;
	position:absolute;
	top:0;
	left:-20px;
}


.menucontainer
{
	display:none;
}

@media only screen
and (min-width: 769px)
{
	.menucontainer
	{
		width:256px;
		awidth:240px;
		display:block;
	}

	.touchmenu
	{
		display:block;
	}
}

.thumb
{
	awidth: 96px;
	aheight: 72px;

	width: 128px;
	height: 96px;

	background-position: center;
	background-size: cover;
	amargin: -8px 0 0 -0px;

	acolor:white;
	adisplay: inline-block;

}

.thumbcon
{
	display: inline-block;
	margin:  0 5px 10px 0;

	border:1px solid #a8b1a3;

	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}

.thumbcon a
{
	color:#000000;
	text-decoration:none;
}

/* and (min-device-width : 768px)

override image size for devices with with <768
 */
@media only screen
and (max-device-width : 767px)
{
	.thumb
	{
		awidth: 96px;
		width: 72px;
		height: 72px;

		awidth: 128px;
		aheight: 96px;

		apadding:  0 0 0 0;
		amargin:  0 0 0 0;
	}

	.thumbcon
	{
		amargin: 0 0 5px 0;

		float:left;
		margin:0 1px 5px 1px;
		aborder:1px solid black;
	}
}

.profilepictures
{
	display: inline-block;
	margin: 0 5px 15px 0;
	padding: 2px;
	border:1px solid #a8b1a3;

	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}

.profiledetail
{
	text-alignment:top;
	height:1px;
}

.showimage
{
	z-index:1;
	position:absolute;
	top:-1;
	left:-1;
	display:none;

	-webkit-transition: all 0.6s ease-out;
	-moz-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}

.canvas
{
	z-index:1;
	position:absolute;
	top:0px;
	left:0px;
	width:1px;
	height:1px;
	background-color:black;
	display:none;

	-webkit-transition: opacity 0.3s ease-out;
	-moz-transition: opacity 0.3s ease-out;
	transition: opacity 0.3s ease-out;
}

.triangle-border {
	afont-size: 85%;

	position:relative;
	padding:5px;
	amargin:1em 0 3em;
	border:3px solid #5a8f00;
	color:#333;
	background:#fff;

	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;

	adisplay:inline-block;
}


.triangle-border.left {
	margin-left:10px;
	float:left;
	border:3px solid #005a8f;
}

.triangle-border.right {
	margin-right:10px;
	float:right;
}

.triangle-border:before {
	content:"";
	position:absolute;
	bottom:-17px;
	left:203px;
    border-width:17px 17px 0;
	border-style:solid;
    border-color:#5a8f00 transparent;

    display:block; 
    width:0;
}


.triangle-border:after {
	content:"";
	position:absolute;
	bottom:-13px;
	left:207px;
	border-width:13px 13px 0;
	border-style:solid;
	border-color:#fff transparent;

    display:block; 
    width:0;
}


.triangle-border.left:before {
	top:5px;
	bottom:auto;
	left:-20px;
	border-width:10px 20px 10px 0;
	aborder-color:transparent #5a8f00;
	border-color:transparent #005a8f;
}


.triangle-border.left:after {
	top:8px;
	bottom:auto;
	left:-14px;
	border-width:7px 14px 7px 0;
	border-color:transparent #fff;
}


.triangle-border.right:before {
	top:5px;
	bottom:auto;
    left:auto;
	right:-20px;
	border-width:10px 0 10px 20px;
	border-color:transparent #5a8f00;
}


.triangle-border.right:after {
	top:8px;
	bottom:auto;
    left:auto;
	right:-14px;
	border-width:7px 0 7px 17px;
	border-color:transparent #fff;
}


.conversation-image
{
	width:120px;
	margin:0 0 0 5px;
}

.inbox
{
	position:relative;
	top:-2px;
	width: 100%;
	height: 86px;

	display: inline-block;
	margin:  0 0 10px 0;
	amargin:  0 5px 10px 0;
	amargin:  0px;
	padding: 5px 0 5px 5px;

	border:1px solid #a8b1a3;

	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;

	color:#000000;
	text-decoration:none;

}

@media only screen
and (max-device-width : 767px)
{
	.inbox
	{
		top:0px;
		height: 62px;
		amargin:0 1px 5px 1px;
		margin:0 1px 5px 1px;
	}
}