ul.items
{
    padding: 0;
    list-style: none;
}
ul.items::after
{
    display: block;
    content: "";
    clear: both;
}
    ul.items li
    {
        float: left;
        width: 31%;
        min-width: 300px;
        max-width: 400px;
        margin-right: 2%;
        margin-bottom: 2%;
    }
    ul.items.taskLog li
    {
        float: none;
        width: auto;
        min-width: auto;
        max-width: initial;
        margin-right: 0;
        margin-bottom: 30px;
		color: rgba(0,0,0, 0.66);
    }
	.taskLog header.container > *
	{
		float: left;
	}
	.taskLog header.container > span
	{
		float: right;
	}
		.taskLog .response
		{
			border-top: 1px solid #ddd;
			padding-top: 10px;
		}
			.taskLog .response h5
			{
				margin: 0;
				margin-bottom: 5px;
			}
			.taskLog .response p
			{
				font-size: 95%;
				font-style: italic;
				margin: 0;
			}
			.taskLog .response p span
			{
				font-style: normal;
				display: block;
				opacity: 0.5;
				font-size: 85%;
			}
	ul.items.taskLog h4
	{
		font-size: 95%;
	}
        ul.items footer::after
        {
            display: block;
            content: "";
            clear: both;
        }
            ul.items strong
            {
                color: #666;
                font-size: 100%;
                padding-top: 5px;
                float: left;
            }
            ul.items .button
            {
                font-size: 90%;
                padding: 6px 20px;
                float: right;
                text-transform: none;
            }
            ul.items span.minfo
            {
                padding: 6px 20px;
                float: right;
				background: #eee;
				border-radius: 50px;
				color: rgba(0,0,0, 0.5);
            }
            ul.items span.minfo.late
            {
				background: #e0a091;
            }
            ul.items span.minfo.accepted
            {
				background: #baf9ab;
            }
            ul.items span.minfo.warn
            {
				background: #f9dfab;
            }
				ul.items span.minfo i
				{
					margin-right: 10px;
				}

li.panel
{
	position: relative;
}
li.panel .itemActions
{
	position: absolute;
	bottom: -10px;
	left: 0;
	width: 100%;
	height: 30px;
	text-align: center;
	display: none;
}
li.panel:hover .itemActions
{
	display: block;
}
	li.panel .itemActions a
	{
		display: inline-block;
		width: 30px;
		height: 30px;
		border-radius: 50%;
		padding-top: 4px;
		margin: 0 5px;
		color: #666;
		background: #ddd;
		transition: background 0.3s, color 0.3s;
	}
	li.panel .itemActions a.remove
	{
		background: #ce5151;
		color: #fff;
	}
	li.panel .itemActions a.accept
	{
		background: #6baf51;
		color: #fff;
	}
	li.panel .itemActions a:hover
	{
		background: #000;
		color: #fff;
	}

.placeList
{
	padding: 0;
	list-style: none;
}
	.placeList > li
	{
		padding: 0;
		overflow-x: hidden;
		max-width: 1300px;
		margin-bottom: 10px;
	}
	.placeList ul
	{
		padding: 0;
		list-style: none;
	}
	.placeList .place
	{
		float: left;
		width: 50%;
		border-top-right-radius: 100px;
		border-bottom-right-radius: 100px;
		background: rgba(170,188,149, 0.5);
		color: rgba(0,0,0, 0.5);
	}
		.placeList .place .info
		{
			float: left;
			padding:  15px 25px;
			width: 50%;
		}
			.placeList .place .info h3
			{
				margin-bottom: 10px;
			}
			.placeList .place .info ul
			{
				padding: 0;
				padding-left: 10px;
			}
				.placeList .place .info ul li
				{
					margin-bottom: 5px;
				}
		.placeList .interaction
		{
			float: right;
			width: 50%;
			padding: 25px;
			text-align: right;
			padding-top: 30px;
			padding-right: 50px;
		}
			.placeList .interaction a
			{
				display: inline-block;
				padding: 7px 20px;
				margin-bottom: 10px;
				border-radius: 50px;
				background: #aabc95;
				color: #fff;
				-webkit-transition: background 0.3s;
				-o-transition: background 0.3s;
				transition: background 0.3s;
			}
			.placeList .interaction a:hover
			{
				text-decoration: none;
				background: #849373;
			}
				.placeList .interaction i
				{
					margin-right: 5px;
				}
	.placeList .taskNext
	{
		float: left;
		width: 50%;
		padding: 15px 25px;
		padding-left: 35px;
		padding-bottom: 0;
	}
		.placeList .taskNext li:nth-child(1)
		{
			border-bottom: 1px solid #e8e8e8;
			margin-bottom: 10px;
		}
			.placeList .taskNext li:nth-child(1) p
			{
				margin-bottom: 5px;
			}
			.placeList .taskNext .icon
			{
				float: right;
				width: 40px;
				height: 40px;
				border-radius: 50%;	
				text-align: center;
				padding-top: 8px;
				font-size: 120%;
				color: rgba(0,0,0, 0.33);
			}
			.placeList .taskNext h4
			{
				color: #777;
				margin-bottom: 3px;
			}
			.placeList .taskNext p
			{
				color: #aaa;
			}
			.placeList .taskNext a
			{
				float: right;
				margin-right: 20px;
				display: inline-block;
				padding: 5px 15px;
				margin-top: 5px;
				border-radius: 50px;
				background: #eee;
				color: #999;
				font-size: 95%;
				-webkit-transition: background 0.3s, color 0.3s;
				-o-transition: background 0.3s, color 0.3s;
				transition: background 0.3s, color 0.3s;
			}
			.placeList .taskNext a:hover
			{
				text-decoration: none;
				background: #ddd;
				color: #777;
			}
				.placeList .taskNext a i
				{
					margin-left: 5px;
				}
p span i
{
	margin-left: 5px;
}
 
.panel .icon
{
	background: #bcd1a4;
}
.panel .icon.water,
.browser .water,
.planList .water
{
    background: #abe6f9;
}
.panel .icon.input,
.browser .input,
.planList .input
{
    background: #f9dfab;
}
.panel .icon.plant,
.planList .plant,
.panel .icon.success,
.browser li
{
    background: #baf9ab;
}
.panel .icon.support,
.browser .support,
.planList .support
{
    background: #e5d1fa;
}
.panel .icon.warning
{
    background: #f5cc79;
}
.panel .icon.error
{
    background: #f88f7d;
}
.panel .icon.sand,
.browser .sand,
.planList .sand
{
    background: #f9f0ab;
}
.panel .icon.message
{
    background: #aaefc7;
}
.panel .icon.system
{
    background: #e7cfff;
}

span.warning i,
i.warning
{
	color: #e8d09f;
}
span.error i,
i.error
{
	color: #e0a091;
}
i.warning,
i.error
{
	margin-left: 3px;
}
.container .planList a
{
	float: none;
}

ul.messages
{
	margin: 0;
	padding: 0;
	list-style: none;
	margin-bottom: 20px;
}
ul.messages li
{
	background: rgb(203, 253, 200);
	color: rgba(0,0,0, 0.66);
	border-radius: 10px;
	margin-bottom: 15px;
	width: 90%;
	max-width: 850px;
	padding: 20px;
	float: left;
	min-width: 55%;
}
ul.messages li.me
{
	background: rgb(204, 246, 255);
	float: right;
}
ul.messages  header
{
	color: rgba(0,0,0, 0.5);
	font-size: 90%;
	border-bottom: 1px solid rgba(0,0,0, 0.2);
}
ul.messages  header .from
{
	font-weight: bold;
	float: left;
}
ul.messages  header .time
{
	float: right;
	font-size: 90%;
}