@charset "utf-8";
/* CSS Document */

/* TIMELINE */

.main-timeline {
	margin:0;
	padding:0;
}

/*
div#timeline {
	overflow-y:hidden;
	overflow-x:hidden;
	width:100%;
	height:100%;
}

.holder {
	margin:0 0 0 0;
	padding:0;
}
*/

/* --- Background images at the top of the timeline --- */

ul.bg-images {
	position:absolute;
	z-index:100900;
}

ul.bg-images li p {
	/*
	font-size:6px;
	*/
	line-height:1.2em;
	letter-spacing:1px;
	text-align:left;
}

ul.bg-images li img {
	-moz-box-shadow: 0 0 4px #888;
	-webkit-box-shadow: 0 0 4px #888;
	box-shadow: 0 0 4px #888;

	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.fourth-effect .mask {
   width: 145px;
   height: 85px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: -1em;
}

.no-touch .fourth-effect:hover p {
    position:relative;

	font-size:12px;
	width:120px;
	line-height:1.2em;
	letter-spacing:1px;

	background-color:#fff;

	padding:8px 5px 8px 10px;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px #888;
	box-shadow: 0 0 5px #888;

   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

.fourth-effect .mask {
   opacity: 0;
   overflow:visible;
   border:0px solid rgba(0,0,0,0.2);

   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
   box-sizing:border-box;

    -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;

   -webkit-transition: all 0.2s ease;
   -moz-transition: all 0.2s ease;
   -o-transition: all 0.2s ease;
   -ms-transition: all 0.2s ease;
   transition: all 0.2s ease;

   left:0;
   z-index:209004;
}

.fourth-effect img {
   display: block;
   position: relative;

  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;

  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;

  -moz-box-shadow: 0 0 4px #888;
  -webkit-box-shadow: 0 0 4px#888;
   box-shadow: 0 0 4px #888;

   opacity: 1;

   width:145px;
   height:85px;

   vertical-align:middle;
   left:0;
}

.no-touch .fourth-effect:hover img {
	opacity: 1;
   	-webkit-box-shadow: 0px 0px 20px rgba(132,131,131,0.8);
  	-moz-box-shadow: 0px 0px 20px rgba(132,131,131,0.8);
  	-o-box-shadow: 0px 0px 20px rgba(132,131,131,0.8);
  	box-shadow: 0px 0px 20px rgba(132,131,131,0.8);

  	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;

	-moz-box-shadow: 0 0 8px #888;
	-webkit-box-shadow: 0 0 8px #888;
	box-shadow: 0 0 8px #888;

	width:160px;
    height:94px;
	left:-.55em;
	top:-.8em;
	z-index:209003;
}

/* --- End Background images at the top of the timeline --- */

/* --- Cary Catle --- */

li.cary-castle {
	position:absolute;
	top:18em;
	margin:0 0 0 26em;
}

li.cary-castle.fourth-effect p {
	width:140px;
	margin:5px 0 0 0;
}

li.cary-castle.fourth-effect:hover p {
	width:145px;
	text-align:center;
	margin:0 0 0 -8px;
}


/* --- End Cary Catle --- */

/* --- Guard House --- */

li.guard-house {
	position:absolute;
	top:11.3em;
	margin:0 0 0 72.4em;
}

li.guard-house.fourth-effect p {
	width:140px;
	margin:-25px 0 0 15.3em;
	width:120px;
}

li.guard-house.fourth-effect:hover p {
	width:140px;
	margin:-58px 0 0 12.5em;
	width:120px;
}

/* --- End Guard House --- */

/* --- Cornwall Family --- */

li.cornwall-family {
	position:absolute;
	top:19.5em;
	margin:0 0 0 82.9em;
}

li.cornwall-family.fourth-effect p {
	width:140px;
	margin:5px 0 0 0;
}

li.cornwall-family.fourth-effect:hover p {
	width:140px;
	margin:0 0 0 -5px;
	text-align:center;
}

/* --- End Cornwall Family  --- */

li.castle-ruins {
	position:absolute;
	top:27.5em;
	margin:0 0 0 98.5em;
}

li.castle-ruins.fourth-effect p {
	width:120px;
	margin:5px 0 0 0;
}

li.castle-ruins.fourth-effect:hover p {
	width:120px;
	margin:0 0 0 -8px;
}

/* -- Maclure -- */

li.maclure {
	position:absolute;
	top:13em;
	margin:0 0 0 132em;
}

li.maclure.fourth-effect p {
	width:120px;
	margin:-35px 0 0 16em;
}

li.maclure.fourth-effect:hover p {
	width:150px;
	text-align:center;
	margin:-60px 0 0 12.5em;
}

/* -- End Maclure -- */

/* -- Royal Visit -- */

li.royal-visit {
	position:absolute;
	top:12.5em;
	margin:0 0 0 170em;
}

li.royal-visit.fourth-effect p {
	width:140px;
	margin:-21em 0 0 16em;
}

li.royal-visit.fourth-effect:hover p {
	width:180px;
	margin:-19.8em 0 0 13em;
	z-index:1;
}

/* -- End Royal Visit -- */

/* -- Rottenbury House -- */

li.rottenbury-house {
	position:absolute;
	top:17em;
	margin:0 0 0 182.5em;
}

li.rottenbury-house.fourth-effect p {
	width:145px;
	margin:5px 0 0 0;
}

li.rottenbury-house.fourth-effect:hover p {
	width:135px;
	margin:0 0 0 -8px;
	text-align:center;
}

/* -- End Rottenbury House -- */

/* -- Rottenbury House Burn -- */

li.rottenbury-house-burning {
	position:absolute;
	top:13.2em;
	margin:0 0 0 193.8em;
}

li.rottenbury-house-burning.fourth-effect p {
	width:120px;
	margin:5px 0 0 0;
}

li.rottenbury-house-burning.fourth-effect:hover p {
	width:130px;
	text-align:center;
	margin:0 0 0 -5px;
}

/* -- End Rottenbury House Burn -- */

/* -- Rebuilt House -- */

li.gov-house-rebuilt {
	position:absolute;
	top:13em;
	margin:0 0 0 220em;
}

li.gov-house-rebuilt.fourth-effect p {
	width:240px;
	margin:5px 0 0 0;
}

li.gov-house-rebuilt.fourth-effect:hover p {
	width:240px;
	text-align:center;
	margin:5px 0 0 -8px;
}

/* -- End Rebuilt House -- */

/* -- Volunteers -- */

li.volunteers {
	position:absolute;
	top:13em;
	margin:0 0 0 240em;
}

li.volunteers.fourth-effect p {
	width:180px;
	margin:5px 0 0 0;
}

.no-touch li.volunteers.fourth-effect:hover p {
	width:180px;
	margin:0 0 0 -8px;
	text-align:center;
}

/* -- End Volunteers -- */

.upper-content {
	position:absolute;
	z-index:100900;
	top:-2.7em;
	margin:0;
	padding:0;
	width:0;
	height:100%;
}

/* Captions */

.upper-content li p {
	position:absolute;
	font-size:10px;
	line-height:1.2em;
	letter-spacing:1px;
	text-align:center;
}
.upper-content li p a {
	font-weight:normal;

}

li.third-effect p b {
	font-weight:bold;
}

li.third-effect.blue p a {
	color:#415e82;
}
li.third-effect.gold p a{
	/* gold */
	color:#675d21;
}
li.third-effect.red p a {
	/* red */
	color:#ad1f23;
}

li.third-effect p {

	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	width:180px;
	left:0;
	height:0;
	text-align:center;

	-moz-box-shadow: 0 0 4px #888;
	-webkit-box-shadow: 0 0 4px #888;
	box-shadow: 0 0 4px #888;

	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;

	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;

	-webkit-transform:scale(1); /*Webkit: Scale down image to 0.8x 		 original size*/
	-moz-transform:scale(1); /*Mozilla scale version*/
	-o-transform:scale(1); /*Opera scale version*/
	-webkit-transition-duration: 0.2s; /*Webkit: Animation duration*/
	-moz-transition-duration: 0.2s; /*Mozilla duration version*/
	-o-transition-duration: 0.2s; /*Opera duration version*/
}

li.third-effect p a {
	color:#415e82;
	font-size:10px;
	text-decoration:none;

	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;

	text-align:center;
}

.no-touch li.third-effect p:hover a {
	position:relative;
	top:3px;
	font-size:12px;
	line-height:1.2em;
}

.no-touch li.third-effect p:hover b {
	font-size:13px;
}

.no-touch li.third-effect:hover p {
	position:relative;
	z-index:209007;
	left:-2.7em;
	padding:6px 6px 12px 6px;
	width:205px;
	height:auto;

	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-o-transform:scale(1);

	background-color:#F9F9F2;

	margin-top:-.7em;
	-moz-box-shadow: 0 0 8px #888;
	-webkit-box-shadow: 0 0 8px #888;
	box-shadow: 0 0 8px #888;

	text-align:center;
	cursor:pointer;

	vertical-align:bottom;

	opacity:1;

}

/* -- Captions at the top of the timeline -- */

li.caption-1 p {
	top:36.2em;
	left:0;
	margin:0 0 0 6.7em;
	width:180px;
	color:#415e82;
}

li.caption-2 p {
	top:29em;
	left:0;
	margin:0 0 0 19.4em;
	width:140px;
	color:#415e82;
}

li.caption-2:hover p {
	top:30em;
	left:-2.4em;
	width:180px;
}

li.caption-3 p {
	top:36.8em;
	left:0;
	margin:0 0 0 31.2em;
	width:160px;
	color:#415e82;
}

li.caption-4 p {
	top:17.9em;
	left:0;
	margin:0 0 0 49.3em;
	width:160px;
	color:#675d21;
}

li.caption-5 p {
	top:24.5em;
	left:0;
	margin:0 0 0 49.3em;
	width:160px;
	color:#415e82;
}

li.caption-6 p {
	top:38.8em;
	left:0;
	margin:0 0 0 49.3em;
	width:160px;
	color:#415e82;
}

li.caption-7 p {
	top:32.5em;
	left:0;
	margin:0 0 0 60em;
	width:120px;
	color:#415e82;
}

li.caption-7:hover p {
	top:33em;
	left:-3.5em;
	width:180px;
}

li.caption-8 p {
	top:10.35em;
	left:0;
	margin:0 0 0 54.3em;
	width:180px;
	color:#415e82;
}

li.caption-9 p {
	top:10.35em;
	margin:0 0 0 74.5em;
	width:180px;
	color:#415e82;
}

li.caption-10 p {
	top:16em;
	margin:0 0 0 77em;
	width:180px;
	color:#415e82;
}

li.caption-11 p {
	top:24.4em;
	margin:0 0 0 79.9em;
	width:160px;
	color:#415e82;
}

li.caption-11:hover p {
	top:25em;
	left:-6em;
	width:270px;
}

li.caption-12 p {
	top:33.8em;
	margin:0 0 0 88.7em;
	width:100px;
	color:#ad1f23;
}

li.caption-12:hover p {
	top:33.8em;
	left:-2.6em;
	width:150px;
}

li.caption-13 p {
	top:33.4em;
	margin:0 0 0 79.5em;
	width:70px;
	color:#ad1f23;
}

li.caption-13:hover p {
	left:-3em;
	width:120px;
}

li.caption-14 p {
	top:41.4em;
	margin:0 0 0 86em;
	width:200px;
	color:#415e82;
}

li.caption-14:hover p {
	width:290px;
	left:-4em;
}

li.caption-15 p {
	top:24.5em;
	margin:0 0 0 98.9em;
	width:80px;
	color:#675d21;
}

li.caption-15:hover p {
	top:25.5em;
	width:180px;
	left:-5.5em;
}

li.caption-16 p {
	top:38.5em;
	margin:0 0 0 109em;
	width:90px;
	color:#415e82;
}

li.caption-16:hover p {
	width:180px;
	left:-5em;
}

li.caption-17 p {
	top:36em;
	margin:0 0 0 119.7em;
	width:70px;
	color:#ad1f23;
}

li.caption-17:hover p {
	top:37em;
	width:150px;
	left:-4.5em;
}

li.caption-18 p {
	top:30em;
	margin:0 0 0 123em;
	width:90px;
	color:#ad1f23;
}
li.caption-18:hover p {
	width:150px;
	left:-3.5em;
}

li.caption-19 p {
	top:29em;
	margin:0 0 0 135em;
	width:120px;
	color:#415e82;
}

li.caption-19:hover p {
	width:180px;
	left:-3em;
}

li.caption-20 p {
	top:23.6em;
	margin:0 0 0 129em;
	width:160px;
	color:#415e82;
}

li.caption-21 p {
	top:16.5em;
	margin:0 0 0 128.8em;
	width:180px;
	color:#415e82;
}

li.caption-22 p {
	top:37.2em;
	margin:0 0 0 140.3em;
	width:100px;
	color:#ad1f23;
}

li.caption-22:hover p {
	width:140px;
}

li.caption-23 p {
	top:16.35em;
	margin:0 0 0 150.7em;
	width:180px;
	color:#675d21;
}

li.caption-23:hover p {
	width:240px;
	left:-3.3em;
}

li.caption-24 p {
	top:24.7em;
	margin:0 0 0 154.4em;
	width:160px;
	color:#415e82;
}

li.caption-25 p {
	top:34.5em;
	margin:0 0 0 151.8em;
	width:60px;
	color:#415e82;
}

li.caption-25:hover p {
	width:120px;
	left:-3.5em;
}

li.caption-26 p {
	top:32.6em;
	margin:0 0 0 158.7em;
	width:120px;
	color:#675d21;
}

li.caption-26:hover p {
	width:190px;
	left:-3.6em;
}

li.caption-27 p {
	top:40.5em;
	margin:0 0 0 158.4em;
	width:120px;
	/* blue */
	color:#415e82;
}

li.caption-27:hover p {
	width:190px;
	left:-3.6em;
}

li.caption-28 p {
	top:31.5em;
	margin:0 0 0 174em;
	width:90px;
	/* gold */
	color:#675d21;
}

li.caption-28:hover p {
	width:200px;
	left:-6em;
}

li.caption-29 p {
	top:43em;
	margin:0 0 0 172.1em;
	width:120px;
	/* red */
	color:#ad1f23;
}

li.caption-29:hover p {
	width:200px;
	left:-4.5em;
}

li.caption-30 p {
	top:28.8em;
	margin:4em 0 0 183.7em;
	width:120px;
	/* blue */
	color:#415e82;
}

li.caption-30:hover p {
	top:35em;
	width:250px;
	left:-7em;
}

li.caption-31 p {
	top:40.5em;
	margin:0 0 0 196.9em;
	width:90px;
	/* gold */
	color:#675d21;
}

li.caption-31:hover p {
	width:160px;
	left:-4em;
}

li.caption-32 p {
	top:34.8em;
	margin:0 0 0 202.9em;
	width:90px;
	/* gold */
	color:#675d21;
}

li.caption-32:hover p {
	width:140px;
	left:-3em;
}

li.caption-33 p {
	top:27.8em;
	margin:0 0 0 203.6em;
	width:160px;
	/* blue */
	color:#415e82;
}

li.caption-34 p {
	top:38.5em;
	margin:0 0 0 220.5em;
	width:160px;
	/* blue */
	color:#415e82;
}

li.caption-35 p {
	top:38.4em;
	margin:0 0 0 245.5em;
	width:120px;
	/* blue */
	color:#415e82;
}

li.caption-35:hover p {
	width:180px;
	left:-3.2em;
}

li.caption-36 p {
	top:32.9em;
	margin:0 0 0 252em;
	width:120px;
	/* red */
	color:#ad1f23;
}

li.caption-36:hover p {
	width:180px;
	left:-3.2em;
}

li.caption-37 p {
	top:24.2em;
	margin:0 0 0 218.8em;
	width:120px;
	/* red */
	color:#ad1f23;
}

li.caption-38 p {
	top:16.6em;
	margin:0 0 0 270.2em;
	width:120px;
	/* red */
	color:#ad1f23;
}

li.caption-38:hover p {
	width:180px;
	left:-3.2em;
}

li.caption-39 p {
	top:21em;
	margin:0 0 0 269.2em;
	width:140px;
	/* blue */
	color:#415e82;
}

li.caption-39:hover p {
	width:190px;
	left:-2.8em;
}

li.caption-40 p {
	top:27.8em;
	margin:0 0 0 268.2em;
	width:160px;
	/* gold */
	color:#675d21;
}

li.caption-40:hover p {
	width:205px;
	left:-3em;
}

li.caption-41 p {
	top:34.7em;
	margin:0 0 0 270em;
	width:160px;
	/* blue */
	color:#415e82;
}

li.caption-41:hover p {
	width:220px;
	left:-3.2em;
}

li.caption-42 p {
	top:42.2em;
	margin:0 0 0 276.5em;
	width:160px;
	/* gold */
	color:#675d21;
}

li.caption-43 p {
	top:41.2em;
	margin:0 0 0 300.3em;
	width:160px;
	/* gold */
	color:#675d21;
}

li.caption-44b p {
	top:33em;
	margin:0 0 0 316em;
	width:130px;
	/* gold */
	color:#675d21;
}

li.caption-44b:hover p {
	width:180px;
	left:-3em;
}


li.caption-44 p {
	top:39.3em;
	margin:0 0 0 325.3em;
	width:130px;
	/* gold */
	color:#675d21;
}

li.caption-44:hover p {
	width:180px;
	left:-3em;
}

li.caption-45 p {
	top:26.3em;
	margin:0 0 0 334em;
	width:120px;
	/* blue */
	color:#415e82;
}

li.caption-45:hover p {
	width:180px;
	left:-3.2em;
}

li.caption-46 p {
	top:39.2em;
	margin:0 0 0 345.6em;
	width:130px;
	/* gold */
	color:#675d21;
}

li.caption-46:hover p {
	width:180px;
	left:-3.2em;
}

li.caption-47 p {
	top:30.5em;
	margin:0 0 0 348em;
	width:130px;
	/* blue */
	color: #415e82;
}

li.caption-47:hover p {
	width:200px;
	left:-4em;
}

/*
li.caption-48 p {
	top:25em;
	margin:0 0 0 360em;
	width:130px;
	color:#675d21;
}
*/

li.caption-48 p {
	top:37.5em;
	margin:0 0 0 364.5em;
	width:90px;
	/* gold */
	color:#675d21;
}

li.caption-48:hover p {
	width:180px;
	left:-4.7em;
}

li.caption-49 p {
	top:42em;
	margin:0 0 0 372em;
	width:120px;
	/* gold */
	color:#675d21;
}

li.caption-49:hover p {
	width:180px;
	left:-3.7em;
}

li.caption-50 p {
	top:44.5em;
	margin:0 0 0 383.5em;
	width:120px;
	/* gold */
	color:#675d21;
}

li.caption-50:hover p {
	width:180px;
	left:-3.7em;
}

/* -- End Captions at the top of the timeline -- */

/* --- Lgs --- */

.lower-content {
	position:absolute;
	z-index:100900;
	top:-2.5em;
	padding:0;
	margin:0;
	width:0;
	height:100%;
}

.lower-content li p {
	/* blue */
	color:#415e82;
}
/* -- Transition -- */
.lower-content li img, .bg-images li img {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;

	-moz-box-shadow: 0 0 4px #888;
	-webkit-box-shadow: 0 0 4px#888;
	box-shadow: 0 0 4px #888;
	/*
  	transition: all 0.2s ease-in;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	*/
}


/* --- Test Effect --- */

.mask {
   width: 70px;
   height: 95px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: -1em;
}

.second-effect p, .fourth-effect p {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:10px;
	padding:0;
	line-height:1.1em;
	letter-spacing:1px;
}

.no-touch .second-effect:hover p {

	position:relative;
    z-index:209000;

	font-size:12px;
	width:120px;
	line-height:1.2em;
	letter-spacing:1px;

	background-color:#fff;

	padding:8px 5px 8px 10px;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px #888;
	box-shadow: 0 0 5px #888;

   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}

.second-effect .mask {
   opacity: 0;
   overflow:visible;
   border:0px solid rgba(0,0,0,0.2);

   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
   box-sizing:border-box;

    -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;

   -webkit-transition: all 0.2s ease;
   -moz-transition: all 0.2s ease;
   -o-transition: all 0.2s ease;
   -ms-transition: all 0.2s ease;
   transition: all 0.2s ease;

   left:0;

   z-index:209004;
}

.second-effect:hover .mask {
   opacity: 1;
   border:43px solid rgba(0,0,0,0.2);

   -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;

	width:85px !important;
    height:115px !important;

	left:-.55em;
	top:-.8em;
	z-index:209004;
}


/* --- Resize upper images --- */
.castle-ruins .mask {
   width: 120px;
   height: 79px;
}

.no-touch .castle-ruins:hover .mask {
	width:135px !important;
	height:89px !important;
	border:45px solid rgba(0,0,0,0.2) !important;
}

.castle-ruins img {
	width:120px !important;
	height:79px !important;
}

.no-touch .castle-ruins:hover img {
	width:135px !important;
	height:89px !important;
}

.no-touch .castle-ruins.fourth-effect:hover a.info {
	top:-10px !important;
	left:10px !important;
}

.maclure .mask {
	width:150px !important;
	height:95px !important;
}

.no-touch .maclure:hover .mask {
	width:165px !important;
	height:105px !important;
	border:53px solid rgba(0,0,0,0.2) !important;
}

.maclure img {
	width:150px !important;
	height:95px !important;
}

.no-touch .maclure:hover img {
	width:165px !important;
	height:105px !important;
}

.royal-visit .mask {
	width:150px !important;
	height:212px !important;
}

.no-touch .royal-visit:hover .mask {
	width:165px !important;
	height:233px !important;
	border:6.4em solid rgba(0,0,0,0.2) !important;
}

.royal-visit img {
	width:150px !important;
	height:212px !important;
}

.royal-visit:hover img {
	width:165px !important;
	height:233px !important;
}

.no-touch .royal-visit.fourth-effect:hover a.info {
	top:25px !important;
	left:-10px !important;
}

.rottenbury-house .mask {
	width:135px !important;
	height:107px !important;
}
.rottenbury-house:hover .mask {
	width:150px !important;
	height:119px !important;
	border:60px solid rgba(0,0,0,0.2) !important;
}

.rottenbury-house img {
	width:135px !important;
	height:107px !important;
}

.rottenbury-house:hover img {
	width:150px !important;
	height:119px !important;
}

.rottenbury-house-burning .mask {
	width:135px !important;
	height:109px !important;
}

.rottenbury-house.fourth-effect:hover a.info {
	top:-8px !important;
	left:8px !important;
}

.rottenbury-house-burning:hover .mask {
	width:150px !important;
	height:121px !important;
	border:60.5px solid rgba(0,0,0,0.2) !important;
}

.rottenbury-house-burning img {
	width:135px !important;
	height:109px !important;
}

.rottenbury-house-burning:hover img {
	width:150px !important;
	height:121px !important;
}

.rottenbury-house-burning.fourth-effect:hover a.info {
	top:-10px !important;
	left:8px !important;
}

.gov-house-rebuilt .mask {
	width:240px !important;
	height:148px !important;
}

.gov-house-rebuilt:hover .mask {
	width:255px !important;
	height:157px !important;
	border:80px solid rgba(0,0,0,0.2) !important;
}

.gov-house-rebuilt img {
	width:240px !important;
	height:148px !important;
}

.gov-house-rebuilt:hover img {
	width:255px !important;
	height:157px !important;
}

.gov-house-rebuilt.fourth-effect:hover a.info {
	top:-10px !important;
	left:34px !important;
}

.volunteers .mask {
	width:180px !important;
	height:120px !important;
}

.volunteers:hover .mask {
	width:195px !important;
	height:130px !important;
	border:60px solid rgba(0,0,0,0.2) !important;
}

.volunteers img {
	width:180px !important;
	height:120px !important;
}

.volunteers:hover img {
	width:195px !important;
	height:130px !important;
}

.volunteers.fourth-effect:hover a.info {
	top:-5px !important;
	left:30px !important;
}

/* --- End Resize upper images --- */

.fourth-effect:hover .mask {
   opacity: 1;
   border:48px solid rgba(0,0,0,0.2);

   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
	border-radius: 5px;

	width:160px;
    height:95px;

	left:-.55em;
	top:-.8em;
	z-index:209004;
}

.no-touch .second-effect a.info, .fourth-effect a.info {
   position:absolute;
   background:url(/wp-content/themes/left-tenant/interactive-timeline/images/link.png) center no-repeat;
   display: inline-block;

   text-decoration: none;
   padding:0;
   text-indent:-9999px;

   width:20px;
   height:20px;

   top:0;
   left:-10px;

   opacity:0;

   -moz-transform:scale(0,0);
   -webkit-transform:scale(0,0);
   -o-transform:scale(0,0);
   -ms-transform:scale(0,0);
   transform:scale(0,0);

   -webkit-transition: -webkit-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
   -moz-transition: -moz-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
   -o-transition: -o-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
   -ms-transition: -ms-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
   transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
}

.second-effect:hover a.info, .fourth-effect:hover a.info {
	top:0;
    left:-10px;

	-moz-transition-delay:0.3s;
	-webkit-transition-delay:0.3s;
	-o-transition-delay:0.3s;
	-ms-transition-delay:0.3s;
	transition-delay:0.3s;

	-moz-transform:scale(1,1);
	-webkit-transform:scale(1,1);
	-o-transform:scale(1,1);
	-ms-transform:scale(1,1);
	transform:scale(1,1);

	opacity:1;

}

.fourth-effect:hover a.info {
	top:-10px !important;
    left:21px !important;
}

.second-effect img {
   display: block;
   position: relative;

  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;

  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;

  -moz-box-shadow: 0 0 4px #888;
  -webkit-box-shadow: 0 0 4px#888;
   box-shadow: 0 0 4px #888;

   opacity: 1;

   height:95px;
   vertical-align:middle;
   left:0;
}

.no-touch .second-effect:hover img {
	opacity: 1;
   	-webkit-box-shadow: 0px 0px 20px rgba(132,131,131,0.8);
  	-moz-box-shadow: 0px 0px 20px rgba(132,131,131,0.8);
  	-o-box-shadow: 0px 0px 20px rgba(132,131,131,0.8);
  	box-shadow: 0px 0px 20px rgba(132,131,131,0.8);

  	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;

	-moz-box-shadow: 0 0 8px #888;
	-webkit-box-shadow: 0 0 8px #888;
	box-shadow: 0 0 8px #888;

	width:85px;
    height:115px;
	left:-.55em;
	top:-.8em;

	z-index:209003;
}

/* --- Test Effect --- */

.richard-blanchard {
	position:absolute;
	top:46.8em;
	margin:0 0 0 27.7em;
    cursor: default;
}

.richard-blanchard.second-effect p {
	width:110px;
	margin:-9em 0 0 -11em;
}

.no-touch .richard-blanchard.second-effect:hover p {
	margin:-9.5em 0 0 -12.6em;
	width:140px;
}

.sir-douglas {
	position:absolute;
	top:56.6em;
	margin:0 0 0 39.3em;
	cursor: default;
}

.sir-douglas.second-effect p {
	width:120px;
	text-align:center;
	margin:5px 0 0 -24px;
}

.no-touch .sir-douglas.second-effect:hover p {
	margin:0 0 0 -42px;
	width:140px;
}

.kennedy {
	position:absolute;
	top:46.8em;
	margin:0 0 0 51.7em;
}

.kennedy.second-effect p {
	margin:-9em 0 0 -10.2em;
	width:100px;
}

.no-touch .kennedy.second-effect:hover p {
	margin:-9.5em 0 0 -15.8em;
	width:170px;
}

.seymour {
	position:absolute;
	top:57.8em;
	margin:0 0 0 56.2em;
}

.seymour.second-effect p {
	margin:-9.6em 0 0 -7.8em;
	width:80px;
}

.seymour.second-effect:hover p {
	margin:-9.5em 0 0 -14.5em;
	width:160px;
}

.musgrave {
	position:absolute;
	top:46.8em;
	margin:0 0 0 60.1em;
}

.musgrave.second-effect p {
	width:50px;
	margin:-9em 0 0 8em;
}

.musgrave.second-effect:hover p {
	margin:-9.5em 0 0 6.4em;
	width:160px;
}

.trutch {
	position:absolute;
	top:56.6em;
	margin:0 0 0 66.5em;
}

.trutch.second-effect p {
	width:140px;
	text-align:center;
	margin:5px 0 0 -32px;
}

.trutch.second-effect:hover p {
	width:160px;
	margin:0 0 0 -52px;
}

.richards {
	position:absolute;
	top:46.8em;
	margin:0 0 0 74em;
}

.richards.second-effect p {
	width:85px;
	margin:-9em 0 0 7.8em;
}

.richards.second-effect:hover p {
	width:160px;
	margin:-9.5em 0 0 6.4em;
}

.cornwall {
	position:absolute;
	top:56.6em;
	margin:0 0 0 82.1em;
}

.cornwall.second-effect p {
	width:160px;
	margin:5px 0 0 -40px;
	text-align:center;
}

.cornwall.second-effect:hover p {
	width:180px;
	margin:0 0 0 -60px;
}

.nelson {
	position:absolute;
	top:46.8em;
	margin:0 0 0 91.6em;
}

.nelson.second-effect p {
	width:80px;
	margin:-9em 0 0 7.8em;
}

.nelson.second-effect:hover p {
	width:120px;
	margin:-9.5em 0 0 6.5em;
}

.dewdney {
	position:absolute;
	top:56.6em;
	margin:0 0 0 99.5em;
}

.dewdney.second-effect p {
	width:140px;
	margin:5px 0 0 -35px;
	text-align:center;
}

.dewdney.second-effect:hover p {
	width:160px;
	margin:0 0 0 -55px;
}

.mcinnes {
	position:absolute;
	top:46.8em;
	margin:0 0 0 107em;
}

.mcinnes.second-effect p {
	width:60px;
	margin:-9em 0 0 7.9em;
}

.mcinnes.second-effect:hover p {
	width:160px;
	margin:-9.5em 0 0 6.3em;
}

.lothbinier {
	position:absolute;
	top:56.6em;
	margin:0 0 0 113em;
}

.lothbinier.second-effect p {
	width:140px;
	margin:5px 0 0 -25px;
	text-align:center;
}

.lothbinier.second-effect:hover p {
	width:170px;
	margin:0 0 0 -55px;
	text-align:center;
}

.dunsmuir {
	position:absolute;
	top:46.8em;
	margin:0 0 0 120.6em;
}

.dunsmuir.second-effect p {
	width:60px;
	margin:-9em 0 0 7.8em;
}

.dunsmuir.second-effect:hover p {
	width:110px;
	margin:-9.5em 0 0 6.4em;
}

.paterson {
	position:absolute;
	top:56.5em;
	margin:0 0 0 127.5em;
}

.paterson.second-effect p {
	width:140px;
	margin:5px 0 0 -32px;
	text-align:center;
}

.paterson.second-effect:hover p {
	width:160px;
	margin:0 0 0 -47px;
	text-align:center;
}

.bernard {
	position:absolute;
	top:46.8em;
	margin:0 0 0 135.7em;
}

.bernard.second-effect p {
	width:50px;
	margin:-9em 0 0 7.8em;
}

.bernard.second-effect:hover p {
	width:165px;
	margin:-9.5em 0 0 6.5em;
	line-height:1.2em;
}

.prior {
	position:absolute;
	top:56.6em;
	margin:0 0 0 141.5em;
}

.prior.second-effect p {
	width:130px;
	margin:5px 0 0 -28.5px;
	text-align:center;
}

.prior.second-effect:hover p {
	width:150px;
	margin:0 0 0 -45px;
	text-align:center;
}

.nichol {
	position:absolute;
	top:46.8em;
	margin:0 0 0 148.4em;
}

.nichol p {
	width:60px;
	margin:-9em 0 0 7.8em;
}

.nichol.second-effect p {
	width:60px;
	margin:-9em 0 0 7.8em;
}

.nichol.second-effect:hover p {
	width:155px;
	margin:-9.5em 0 0 6.4em;
}

.bruce {
	position:absolute;
	top:56.6em;
	margin:0 0 0 155.5em;
}

.bruce.second-effect p {
	width:140px;
	margin:5px 0 0 -35px;
	text-align:center;
}

.bruce.second-effect:hover p {
	width:160px;
	margin:0 0 0 -55px;
	text-align:center;
}

.johnson {
	position:absolute;
	top:46.8em;
	margin:0 0 0 162.8em;
}

.johnson.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.johnson.second-effect:hover p {
	width:170px;
	margin:-9.5em 0 0 6.4em;
}

.hamber {
	position:absolute;
	top:56.6em;
	margin:0 0 0 170.7em;
}

.hamber.second-effect p {
	width:140px;
	margin:5px 0 0 -32px;
	text-align:center;
}

.hamber.second-effect:hover p {
	width:150px;
	margin:0 0 0 -46px;
	text-align:center;
}

.woodward {
	position:absolute;
	top:46.8em;
	margin:0 0 0 179em;
}

.woodward.second-effect p {
	width:70px;
	margin:-9em 0 0 7.8em;
}

.woodward.second-effect:hover p {
	width:170px;
	margin:-9.5em 0 0 6.4em;
}

.banks {
	position:absolute;
	top:56.6em;
	margin:0 0 0 186em;
}

.banks.second-effect p {
	width:140px;
	margin:5px 0 0 -30px;
	text-align:center;
}

.banks.second-effect:hover p {
	width:150px;
	margin:0 0 0 -45px;
}

.wallace {
	position:absolute;
	top:46.8em;
	margin:0 0 0 193.6em;
}

.wallace.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.wallace.second-effect:hover p {
	width:150px;
	margin:-9.5em 0 0 6.4em;
}

.ross {
	position:absolute;
	top:56.6em;
	margin:0 0 0 201.5em;
}

.ross.second-effect p {
	width:150px;
	margin:5px 0 0 -39px;
	text-align:center;
}

.ross.second-effect:hover p {
	width:160px;
	margin:0 0 0 -55px;
}

.pearkes {
	position:absolute;
	top:46.8em;
	margin:0 0 0 212.3em;
}

.pearkes.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.pearkes.second-effect:hover p {
	width:160px;
	margin:-9.5em 0 0 6.4em;
}

.nicholson {
	position:absolute;
	top:56.6em;
	margin:0 0 0 222em;
}

.nicholson.second-effect p {
	width:150px;
	margin:5px 0 0 -36px;
	text-align:center;
}

.nicholson.second-effect:hover p {
	width:160px;
	margin:0 0 0 -53px;
}

.owen {
	position:absolute;
	top:46.8em;
	margin:0 0 0 230.8em;
}

.owen.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.owen.second-effect:hover p {
	width:150px;
	margin:-9.5em 0 0 6.4em;
}

.irving {
	position:absolute;
	top:56.6em;
	margin:0 0 0 238.5em;
}

.irving.second-effect p {
	width:150px;
	margin:5px 0 0 -40px;
	text-align:center;
}

.irving.second-effect:hover p {
	width:170px;
	margin:0 0 0 -55px;
	text-align:center;
}

.rogers {
	position:absolute;
	top:46.8em;
	margin:0 0 0 247em;
}

.rogers.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.rogers.second-effect:hover p {
	width:150px;
	margin:-9.5em 0 0 6.4em;
}

.lam {
	position:absolute;
	top:56.6em;
	margin:0 0 0 256.7em;
}

.lam.second-effect p {
	width:140px;
	margin:5px 0 0 -35px;
	text-align:center;
}

.lam.second-effect:hover p {
	width:155px;
	margin:0 0 0 -50px;
	text-align:center;
}

.gardom {
	position:absolute;
	top:46.8em;
	margin:0 0 0 267.3em;
}

.gardom.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.gardom.second-effect:hover p {
	width:150px;
	margin:-9.5em 0 0 6.4em;
}

.campagnolo {
	position:absolute;
	top:56.6em;
	margin:0 0 0 276.4em;
}

.campagnolo.second-effect p {
	width:140px;
	margin:5px 0 0 -35px;
	text-align:center;
}

.campagnolo.second-effect:hover p {
	width:150px;
	margin:0 0 0 -53px;
}

.point {
	position:absolute;
	top:46.8em;
	margin:0 0 0 284.8em;
}

.point.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.point.second-effect:hover p {
	width:150px;
	margin:-9.5em 0 0 6.4em;
}

.judith {
	position:absolute;
	top:56.4em;
	margin:0 0 0 291.8em;
}

.judith.second-effect p {
	width:140px;
	margin:5px 0 0 -35px;
	text-align:center;
}

.judith.second-effect:hover p {
	width:150px;
	margin:0 0 0 -53px;
}

.janet {
	position:absolute;
	top:46.8em;
	margin:0 0 0 300.5em;
}

.janet.second-effect p {
	width:90px;
	margin:-9em 0 0 7.8em;
}

.janet.second-effect:hover p {
	width:150px;
	margin:-9.5em 0 0 6.4em;
}


/* Scroll CSS */

/* You can alter this CSS in order to give Smooth Div Scroll your own look'n'feel */

/* Invisible left hotspot */
div.scrollingHotSpotLeft
{
	/* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
	min-width: 75px;
	width: 10%;
	height: 100%;
	/* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
	background-image: url(/wp-content/themes/left-tenant/interactive-timeline/images/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index:100901;
	left: 0;
	/*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
	cursor: url(/wp-content/themes/left-tenant/interactive-timeline/images/cursors/cursor_arrow_lefts.png), url(/wp-content/themes/left-tenant/interactive-timeline/images/cursors/cursor_arrow_lefts.cur),w-resize;
	margin:0;
	padding:0;

}

/* Visible left hotspot */
div.scrollingHotSpotLeftVisible
{
	background-image: url(/wp-content/themes/left-tenant/interactive-timeline/images/arrow_left.png);
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.55; /* Standard CSS3 opacity setting */
	-moz-opacity: 0.55; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */
	filter: alpha(opacity = 55); /* Opacity for Internet Explorer. */
	zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */

}

/* Invisible right hotspot */
div.scrollingHotSpotRight
{
	min-width: 75px;
	width: 10%;
	height: 100%;
	background-image: url(/wp-content/themes/left-tenant/interactive-timeline/images/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index:100901;
	right: 0;
	cursor: url(/wp-content/themes/left-tenant/interactive-timeline/images/cursors/cursor_arrow_rights.png), url(/wp-content/themes/left-tenant/interactive-timeline/images/cursors/cursor_arrow_rights.cur),e-resize;
	margin:0;
	padding:0;
}

/* Visible right hotspot */
div.scrollingHotSpotRightVisible
{
	background-image: url(/wp-content/themes/left-tenant/interactive-timeline/images/arrow_right.png);
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.55;
	filter: alpha(opacity = 55);
	-moz-opacity: 0.55;

}

div.main-timeline div.scrollWrapper
{
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
}

div.main-timeline div.scrollableArea
{
	position: relative;
	width: auto;
	height: 100%;
}