html, body{
/*	height:100%;*/
	/*background: url("../images/eggs_background.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;*/
}

.letter, .modal-header, .shift {
  background: #87CAE0;
}

/*

#header h2 {
  text-shadow: 1px 1px #fff;
  color: #444;
	font-size: 32pt;
}

#header h3 {
  text-shadow: 1px 1px #fff;
  color: #444;
	font-size: 21pt;
}

#header .btn{
	background:#aaa;
}

#header .btn:hover{
	color: black;
	background: #aaa;
}*/

#header h1 {
    margin-top: 0.2em;
    /* Épelle accent is touching the top of the page*/
}

#description2 {
  margin: 40px 0 20px 0;
  font-size: 24px;
  font-style: italic;
}

#alphabet {
  margin: 20px 0;
}

#alphabet ul {
  list-style:none;
  padding:0
}

#alphabet ul li{
  padding:0;
}

.letter {
  text-align: center; 
  display: inline-block; 
  float: left; 
  color: #fff; 
  min-width: 40px; 
  line-height: 40px; 
  height: 40px; 
  margin: 2px;
  padding: 0 6px;
  cursor: pointer;
  font-size: 16px;
}

.shift {
  text-align: center; 
  display: inline-block; 
  float: left; 
  color: #fff; 
  min-width: 40px; 
  line-height: 40px; 
  height: 40px; 
  margin: 2px;
  padding: 0 6px;
  cursor: pointer;
  font-size: 16px;
}

#guess {
  font-size: 22px;
  margin: 0 0 20px;
}

#guess span {
  padding: 0px 2px
}

.correct {
  background-color: #3a4
}

.incorrect {
  background-color: #d43
}

#next {
  display: none
}

/*#image img {
  height: 400px
}*/

.life span {
  color: #d42
}

/*.btn {
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  background: #429BC5;
  padding: 10px 20px 10px 20px;
  margin-bottom: 10px;
  text-decoration: none;
  cursor:pointer;
}*/

/*.btn-info {
	border:0px;
	position:relative;
	float:right;
  margin-top: 20px;
	clear: right;	
}*/

/* unit 3 hover colour */
/*.btn:hover {
  background: #00BFFF;
  text-decoration: none;
}*/

.modal-header {
  border-radius: 5px;
}

.modal-header .close {
  margin-top: -10px;
}

/*#checkBtn {
  border-radius: 28px;
  font-family: Arial;
  color: #fff;
  font-size: 20px;
  background: #DEAD22;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
  margin-bottom: 10px;
  cursor: pointer;
  margin-top: 10px
}

#checkBtn:hover {
  background: #119ef5;
  text-decoration: none;
}*/

/*a {
  color: #fff;
  text-decoration: none;
}

p {
  margin: 0 0 10px;
  font-size: 18px;
}

.intro {
  background: rgba(222, 173, 34, 0.4);
  padding: 2rem .5em 1em .5em;
	color: #000;
	font-size: 20px!important;
	margin: 1em 4em 2em 4em;
}

p.videoHeading {
  margin: 1em 0em 1em 0em;
  background:rgba(222, 173, 34, 0.4);
  padding: 2rem 0em 1em 0em;
	color:#000;
	font-size: 20px!important;
	margin: 1em 4em 2em 4em;
}*/

/*h1, .h1 {
  font-size: 36px;
  background-color: #DEAD22;
  color: #fff;
  padding: 10px;
}*/

/*.list ul {
  margin-top: 7rem;
  list-style: none;
  font-weight: 800;
  z-index: 100;
  position: absolute;
  top: 20rem;
  right: 5.5rem;
	color: #DEAD22;
}

ul.list-inline li img {
  width: 120px;
}

th {
  text-align: center;
  background-color: #DEAD22;
  color: #fff;
}*/

/*#penToolOptions button {
  font-size: 14px;
  padding: 5px 10px 5px 10px;
}*/

/*#penToolOptions, #penToolOptions.active {
  top: 2px;
}*/

#score img {
  display: block;
  margin: auto auto auto auto;
  padding-top: 25%;
}

.ui-dialog .ui-dialog-titlebar-close {
	background-image:url("http://resource.download.wjec.co.uk.s3.amazonaws.com/vtc/2015-16/15-16_09/eng/eggs/images/close.png");
}

/* sticker footer */
html {
    position: relative;
    min-height: 100%;
}

body {
  padding-bottom: 50px;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  color: #fff;
  text-align: center;
  background: #87CAE0;
  height: 30px;
}

.footer p {
  line-height: 30px;
  margin-bottom: 0;
}