@charset "ISO-8859-1";
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.75em;
	line-height: normal;
}

form {
	background: #fafafa;
	padding: 20px;
	/* width: 50%; */
	min-width:250px;
	margin: 0 auto;
	border: 1px solid #cccccc;
}

form div {
	/* Float containment */
	overflow: hidden;
}


form label, form input {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

form label {
	font-weight: bold;
	background: linear-gradient(#f1f1f1, #e2e2e2);
	padding: 6px 10px;
	color: #444;

	border: 1px solid #d4d4d4;
	/* lets remove the right border */
	border-right: 0;
	border-bottom-left-radius: 5px;
	border-top-left-radius: 5px;

	line-height: 1.5em;
	width: 30%;

	/* takes the width properly now and also the
	spacing between the label and input field got removed. */
	float: left;
	margin-bottom: -2px;
	text-align: center;
	cursor: pointer;
}


form input {
	width: 100%;
	padding: 5px;
	border: 1px solid #d4d4d4;
	border-bottom-right-radius: 5px;
	border-top-right-radius: 4px;
	line-height: 1.6em;


	/* some box shadow sauce :D */
	box-shadow: inset 0px 2px 2px #ececec;
	margin-bottom: 15px;
}
form input:focus {
	/* No outline on focus */
	outline: 0;
	/* a darker border ? */
	border: 1px solid #bbb;
}

form input.form_field {
	padding-right:70px;
	 -moz-transition: padding .25s;
    -webkit-transition: padding .25s;
    -o-transition: padding .25s;
    transition: padding .25s;

}

:-moz-placeholder {
    color: grey;
}

::-webkit-input-placeholder {
    color: grey;
}

.frontBox {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-content: stretch;
	align-items: center;
	position: absolute;
	top: 0px;
	left:0px;
	width: 100%;
	height: 100%;
	background: url(portfolio/img/intro-bg.jpg) no-repeat bottom center scroll;
	background-color: #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover;
}

.frontBoxOverlay {
	position: absolute;
    width: 100%;
    height: 100%;
    background-color: #000;
    top: 0px;
    left: 0px;
    opacity: 0.65;
}

.loginBox {
	width: 350px;
	background-color: #fff;
	border-radius: 5px;
	z-index:3;
	-webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.55);
	-moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.55);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.55);
	z-index:3;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 21px;
}

.twitterFeed {
	background-color: #fafafa;
  border-radius: 2px;
  z-index: 3;
  -webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.55);
  -moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.55);
  box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.55);
  margin-bottom: 25px;
  margin-top: 25px;
}

.twitterTitle {
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size: 21px;
  padding: 15px;
}

.loginError {
color: red;
font-size: 12px;
display: block;
text-align: center;
padding: 10px 0px;
}