@font-face {
    font-family: "emilab-font";
    src: url(../../fonts/LindenHill-Regular.ttf) format("truetype");
}
body {
	background-color:#fff;
}
.logo {
	font-family:"emilab-font", Georgia, Arial;
	color:#686868;
}
.logo:hover {
	color:#008080;
}

.ui-form textarea, .ui-form input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]) {
	padding: 5px;
	width:280px;
}

.ui-form textarea.error, .ui-form input.error:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]) {
	padding: 5px;
	width:280px;
}

.theme-default #slider {
    width:650px; /* Make sure your images are the same size */
    height:300px; /* Make sure your images are the same size */
}

.box {
	width:150px;
	height:150px;
	text-align:center;
	float:left;
}

.drop-shadow {
	position:relative;
	padding:1em; 
	margin:2em 10px;
	background:#fff;
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	   -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	     -o-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	    -ms-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
			box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.drop-shadow:before,
.drop-shadow:after {
	content:"";
	position:absolute; 
	z-index:-2;
}
.lifted:before,
.lifted:after { 
	bottom:15px;
	left:10px;
	width:50%;
	height:10%;
	-webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
	   -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
			box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
	-webkit-transform:rotate(-3deg);
	   -moz-transform:rotate(-3deg);
		-ms-transform:rotate(-3deg);
		 -o-transform:rotate(-3deg);
			transform:rotate(-3deg);
}

.lifted:after {
	right:10px; 
	left:auto;
	-webkit-transform:rotate(3deg);   
	   -moz-transform:rotate(3deg);  
		-ms-transform:rotate(3deg);  
		 -o-transform:rotate(3deg);
			transform:rotate(3deg);
}
.raised {
	-webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	   -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
			box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.key{
	cursor:pointer;
	display: block;
	color: #aaa;
	font: bold 40pt arial;
	text-decoration: none;
	text-align: center;
	width: 100px;
	height: 100px;
	margin: 5px auto;
	background: #eff0f2;
	-moz-border-radius: 4px;
	border-radius: 4px;
	border-top: 1px solid #f5f5f5;
	-webkit-box-shadow: 
		inset 0 0 25px #e8e8e8,
		0 1px 0 #c3c3c3,
		0 2px 0 #c9c9c9,
		0 2px 3px #333;
	-moz-box-shadow: 
		inset 0 0 25px #e8e8e8,
		0 1px 0 #c3c3c3,
		0 2px 0 #c9c9c9,
		0 2px 3px #333;
	box-shadow: 
		inset 0 0 25px #e8e8e8,
		0 1px 0 #c3c3c3,
		0 2px 0 #c9c9c9,
		0 2px 3px #333;
	text-shadow: 0px 1px 0px #f5f5f5;
}
.key:active, .keydown {
	color: #888;
	background: #ebeced;
	margin-top: 7px;
	-webkit-box-shadow:
		inset 0 0 25px #ddd,
		0 0 3px #333;
	-moz-box-shadow: 
		inset 0 0 25px #ddd,
		0 0 3px #333;
	box-shadow: 
		inset 0 0 25px #ddd,
		0 0 3px #333;
	border-top: 1px solid #eee;
}