@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');

a.ticket { padding: 1px 3px; border-top-left-radius: 4px; background-color: #42949e; color: #fff; text-decoration: none; display: block; text-align:center; width:180px; position:relative; top:-8px; left:-8px; }

html, body {
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 100%;
}

body, textarea {
	background-color: #F2F1EF;
	font-family: 'Source Sans Pro', sans-serif;
    font-size: 12pt;
	line-height: 1.3;
	color: #222;
}

textarea {
	border: 0px;
	width: 100%;
	height: 80px;
	background-color: transparent;
	resize: none;
}

input[type=checkbox] {
	display:none;
}
 
input[type=checkbox] + label:before {
	font-family: FontAwesome;
	display: inline-block;
	color: #666;
}

input[type=checkbox] + label:before { content: "\f06e"; } /* eye icon */
input[type=checkbox]:checked + label:before { content: "\f070"; } /* eye slash icon */

input[type=checkbox]:hover + label:before { color: #000; cursor: pointer; }
input[type=checkbox]:checked:hover + label:before { color: #000; cursor: pointer; }

h1 {
	border-bottom: 1px #000 solid;
}

p {
	line-height: 1.8;
}

	.bad {
		color: #cc0000;
	}

	.good {
		color: #00cc00;
	}
	
	.info {
		color: #42949e;
	}

div.clearleft {
	clear: left;
}

div.clearboth {
	clear: both;
}

#container {
	width: 100%;
	margin: 0 auto;
}

#content {
	padding: 5% 10%;
	margin: 0 auto;
}

div.cell-small {
	width: 12.5%;
    min-height: 130px;
	float: left;
}

div.cell-medium {
	width: 24.5%;
    min-height: 130px;
	float: left;
}

div.row {
	border-bottom: 1px #bbb solid;
	padding: 0px 0px 8px 0px;
}

	div.row:last-child {
		border-bottom: 0px;
	}

div.card {
	padding: 8px;
	margin: 8px 0px 0px 8px;
	width: 170px;
	height: 100px;
	float: left;
	position: relative;
	border-radius: 4px;
}

div.card:hover {
    cursor: move;
}

	div.card:hover div.move {
		display: block;
        cursor: pointer;
	}

	div.move {
		position: absolute;
		width: 170px;
		height: 21px;
		bottom: 5px;
		display: none;
		color: #000;
	}
	
		div.move a:link, p a:link, div.move a:visited, p a:visited {
			text-decoration: none;
			color: #666;
		}
		
		div.move a:hover, p a:hover, div.move a:active, p a:active {
			text-decoration: none;
			color: #000;
		}
	
		div.move-left {
			position: absolute;
			left: 0px;
			bottom: 0px;
		}

		div.move-right {
			position: absolute;
			right: 0px;
			bottom: 0px;
		}

.meta {
	text-align: center;
	font-weight: bold;
	padding: 20px 0px;
	text-transform: uppercase;
}

.header {
	background-color: #fff;
	font-weight: bold;
	padding: 30px !important;
	font-size: 16pt !important;
}

	.header a:link, .header a:visited {
		text-decoration: none;
		color: #42949e;
	}
	
	.header a:hover, .header a:active {
		text-decoration: underline;
		color: #000;
	}

.left {
	float: left;
}

.rotate {
	transform: rotate(-90deg);
	transform-origin: left top 0;
	padding: 10px;
	position: absolute;
	background-color: #fff;
	z-index: 9;
	opacity: 0.35;
	margin-top: 96px;
}

.right {
	float: right;
	text-align: right;
}

.br {
	border-right: 1px #bbb solid;
}

.notify {
	background-color: #dd0000;
	color: #fff;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	display: inline-block;
	position: relative;
	left: -10px;
	top: -10px;
	font-size: 14px;
	line-height: 20px;
	text-align: center;
	font-family: arial, sans-serif;
}

.critical {
	background-color: #fbdebd !important; /* fabe58, f99b98 */
}

.yellow {
	background-color: #F5D76E !important;
}

.red {
	background-color: #EC644B !important;
}

.green {
	background-color: #87D37C !important;
}

.blue {
	background-color: #81CFE0 !important;
}

.purple {
	background-color: #AEA8D3 !important;
}

.left input[type=text], .left input[type=password], .left input[type=color], .left select {
	width: 200px;
	height: 35px;
	margin: 0px;
	margin-bottom: 15px;
	padding: 0px 10px;
	line-height: 35px;
	border: 0px;
	font-family: 'Slabo 27px', serif;
	font-size: 12pt;
	line-height: 1.3;
	color: #222;
}
	
	.left input[type=submit] {
		width: 200px;
		height: 50px;
		margin: 0px;
		padding: 0px;
		line-height: 50px;
		border: 0px;
		background-color: #42949e;
		/*text-shadow: 1px 1px 2px #000;*/
		cursor: pointer;
		-webkit-appearance: none;
		font-family: 'Slabo 27px', serif;
		font-size: 14pt;
		line-height: 1.3;
		color: #fff;
	}
	
	.left input[type=submit]:hover {
		background-color: #52a4ae;
	}

.ml30 { margin-left: 30px; }
.ml50 { margin-left: 50px; }
.ml70 { margin-left: 70px; }
.ml100 { margin-left: 146px; }

.mb50 { margin-bottom: 50px; }

.w404 { width: 410px; }

/* Login-Stuff *************************************************************************************/

#golden_px {
	position: absolute;
	width: 1px;
	height: 1px;
	left: 50%;
	top: 50%;
	margin-left: -100px;
	margin-top: -108px;
	overflow: visible;
}

#nice_login {
	width: 200px;
	height: 216px;
	text-align: center;
}

	#nice_login input[type=text], #nice_login input[type=password], #nice_login input[type=email] {
		width: 200px;
		height: 35px;
		margin: 0px;
		margin-bottom: 15px;
		padding: 0px 10px;
		line-height: 35px;
		border: 0px;
		font-family: 'Slabo 27px', serif;
		font-size: 12pt;
		line-height: 1.3;
		color: #222;
	}
	
	#nice_login input[type=submit] {
		width: 200px;
		height: 50px;
		margin: 0px;
		padding: 0px;
		line-height: 50px;
		border: 0px;
		background-color: #42949e;
		/*text-shadow: 1px 1px 2px #000;*/
		cursor: pointer;
		-webkit-appearance: none;
		font-family: 'Slabo 27px', serif;
		font-size: 14pt;
		line-height: 1.3;
		color: #fff;
	}
	
	#nice_login input[type=submit]:hover {
		background-color: #52a4ae;
	}
	
/* Message-Stuff *************************************************************************************/

.black {
  color: #0d0d0e; }

.inverted {
  color: #fff; }

.error {
  color: #f03c69; }

.success {
  color: #35beb1; }

.warning {
  color: #f7ba45; }

.focus {
  color: #1c86f2; }

.close:before,
.kube-close:before {
  content: "\f00d"; }

.fixed {
  position: fixed !important;
  bottom: 0;
  left: 0;
  z-index: 100;
}

.close {
  display: inline-block;
  min-height: 16px;
  min-width: 16px;
  line-height: 16px;
  vertical-align: middle;
  text-align: center;
  font-size: 12px;
  opacity: .6; }
  .close:hover {
    opacity: 1; }
  .close.small {
    font-size: 8px; }
  .close.big {
    font-size: 18px; }
  .close.white {
    color: #fff; }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes fadeOut {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

.fadeIn {
  animation: fadeIn 250ms; }

.fadeOut {
  animation: fadeOut 250ms; }

.message {
  background: #e0e1e1;
  color: #313439;
  padding: 2%;
  width: 96%;
  position: relative;
}

.message a {
    color: inherit;
}

.message.error {
  background: #EC644B;
  color: #fff; }

.message.success {
  background: #87D37C;
  color: #fff; }

.message.warning {
  background: #f7ba45; }

.message.focus {
  background: #1c86f2;
  color: #fff; }

.message.black {
  background: #0d0d0e;
  color: #fff; }

.message.inverted {
  background: #fff; }