/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 8-Feb-2014, 5:41:03 PM
    Author     : canada
*/
body {
	background: #fff;
	margin: 0;
	padding: 0;
	font-family: Helvetica, Arial, Sans-serif;
}

#header, #subheader, #helpbox {
	background: rgba(255,255,255,0.8);
	border-bottom: 1px solid #bdd4ea;
	width: 100%;
	color: #97b1ca;
}

#header h1 {
	margin: 0;
	padding: 20px 0px;
	font-size: 30px;
	font-weight: 100;
	text-transform: uppercase;
}

#subheader {
	padding: 10px 0px;
	font-size: 16px;
}

#subheader a {
	color: #97b1ca;
	margin: 0px 20px;
}

#helpbox {
	overflow: hidden;
	font-size: 16px;
	line-height: 32px;
	width: 90%;
	padding: 10px 5%;
}

.hidehelp {
	opacity: 0;
	height: 0;
}

.showhelp {
	opacity: 1;
	height: auto;
}

#container {
	width: 512px;
	height: 640px;
	display: block;
	margin: 50px auto;
}

#container img {
	width: 100px;
	height: 100px;
	margin: 10px;
	cursor: pointer;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

#container .hidden {
	background: #e0e6ec;
	border: 4px solid #e0e6ec;
	padding-left: 100px;
	width: 0px;
}

#container .hidden:hover {
	border: 4px solid #bdd4ea;
}

#container .show {
	padding-left: 0px;
	width: 100px;
	border: 4px solid #bfeabd;
}