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



/* Headings and links */

#timeline-title {
	background-color: #f8f8f8;
	padding: 10px 20px;	
	position: relative;
}

#timeline-title h1 .subtitle {
	font-size: 16px;
	font-weight: normal;
	display: block;	
}

#timeline h2 {
	position: absolute;
	top: 0px;
	padding-left: 20px;	
	color: #3d6384;
	font-size: 20px;
	font-weight: 600;
	margin-top: 20px;
}

#timeline h2 .subtitle {
	font-size: 14px;
	font-weight: normal;
	display: block;
	color: #54799A;
	margin-top: 5px;
}

#timeline h3 {
	color: #3d6384;
	font-size: 20px;	
	margin: 20px 0;
	clear: both;
}

#timeline h4 {
	color: #3d6384;
	background-color: #e4ebed;
	width: 100%;
	margin-left: -20px;
	margin-right: -20px;
	padding: 10px 10px 10px 20px;	
	margin-bottom: 15px;
	margin-top: 20px;
	font-size: 14px;
	clear: both;
}



/* Layout  */

#timeline {
	width: 100%;
	background-image: url(../images/timeline-bg.jpg);
	background-repeat: repeat-y;
	background-position: left;
	padding-top: 0px;
	border-top: 7px solid #c7e4eb;
	padding-bottom: 0px;

}

.timeline-section, .section-heading, .collapse-controls {
	width: 680px;
	padding: 15px 20px;	
	float: right;
	margin-right: 30px;
}

.timeline-section {
	margin-right: 0px;
}


.day-details {
	width: 822px;
	float: right;
	margin-right: 30px;
}


/* Intro and exit blurbs (outside the main timeline) */

.blurb {
	background-color: #c7e4ec;
	color: #282828;
	padding: 20px;	
}

.blurb a {
	color: #3d6384;	
}

.blurb a:hover, .blurb a:focus {
	color: #515353;	
}

#intro-blurb {
	margin-bottom: 40px;
}

#exit-blurb {
	margin-top: 40px;
}

#disclaimer {
	background-color: #eeeeee;
}

#disclaimer h2 {
	position: relative !important;
	margin-top: 10px;
	padding-left: 0px;
	color: #282828;	
	display: block !important;
	float: none !important;
}

/* Timeline - Day */

.timeline-day {
	position: relative;
	background-image: url(../images/blue-arrow-left.png);
	background-repeat: no-repeat;
	background-position: left 199px top 20px;
	background-position-x: 199px;
	background-position-y: 20px;
	margin-top: 20px;
}

.timeline-day:first-child {
	margin-top: 0px;	
}


/* Timeline - Heading */

.section-heading {
	background-color: #3d6384;
	color: #fff;
	border: 1px solid #3d6384;	
	border-radius: 10px;
	position: relative;
}


.section-heading p {
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	display: block;
	margin-right: 130px;
}

/* Scroll to top button */

.scroll-to-top {
	position: fixed;
	font-size: 18px;
	color: #525252;
	bottom: 10px;
	right: 0;
	text-align: center;
	opacity: 0.8;
	z-index: 10;
	padding: 20px 30px 20px 20px;
	border-radius: 10px 0 0 10px;
	/* Firefox */
    -moz-transition: all 0.5s ease-in-out;
    /* WebKit */
    -webkit-transition: all 0.5s ease-in-out;
    /* Opera */
    -o-transition: all 0.5s ease-in-out;
    /* Standard */
    transition: all 0.5s ease-in-out;
}

.scroll-to-top.hidden {
	opacity: 0;	
}

.scroll-to-top:hover {
	cursor: pointer;
	opacity: 0.9;	
}

.scroll-to-top img {
	display: block;	
	margin: 0 auto;
	margin-bottom: 10px;
}


/* Expand all and collapse all controls */

#expand-controls {
	position: relative;
	height: 1px;
}

.collapse-all, .expand-all {
	display: inline-block;
	float: right;	
	position: absolute;
	right: 40px;
	color: #000;
	opacity: 0.7;
	background-repeat: no-repeat;
	background-position: right;
	padding-right: 20px;
	top: -20px;
}

.collapse-all:hover, .expand-all:hover {
	opacity: 1;
	cursor: pointer;
}

.collapse-all {
	background-image: url(../images/black-arrow-up-all.png);
}

.expand-all {
	right: 150px;
	background-image: url(../images/black-arrow-down-all.png);
}

/* Show/hide controls */

.show-controls {
	position: absolute;
	top: 25px;
	right: 15px;
	background-image: url(../images/white-arrow-down.png);
	background-repeat: no-repeat;
	background-position: top 6px right;	
	background-position-y: 6px;
	background-position-x: right;
	padding-right: 24px;
}

.collapse-controls {
	display: none;	
}

.collapse-controls .show-controls-label {
	float: right;
	margin-right: -6px;
	background-image: url(../images/white-arrow-down.png);
	background-repeat: no-repeat;
	background-position: top 6px right;	
	background-position-y: 6px;
	background-position-x: right;
	padding-right: 24px;
}


.show-controls-label:before {
	content: "Show details";	
}

.expanded .show-controls, .expanded .collapse-controls .show-controls-label {
	background-image: url(../images/white-arrow-up.png);	
}

.expanded .show-controls-label:before {
	content: "Hide details";	
}

.section-heading {
	border-radius: 10px;
}

.expanded .section-heading {
	border-radius: 10px 10px 0 0;
}

.collapsing .section-heading {
	border-radius: 10px 10px 0 0 !important;
}


/* Timeline - Collapse controls */

.collapse-controls {
	background-color: #54799a;
	color: #fff;	
	border: 1px solid #54799a;
	border-radius: 0 0 10px 10px;
}

/* Timeline - Details */

.day-details {
	visibility: hidden;
	/*display: none;*/
	overflow: visible;
}

/* Timeline - Section */

.timeline-section {
	background-color: #edf2f3;	
	border: 1px solid #869fb1;
	border-top: none;
	padding-top: 0px;
	color: #515353;
	position: relative;
}

.timeline-section ul {
	margin-left: 0px;	
}

.timeline-section ul li, .timeline-section p {
	color: #515353;	
	margin-left: 0px;
}

.timeline-section a {
	color: #3d6384;	
}


/* Specific section stylings */

.videos-section img {
	float: left;
	margin: 0 30px 10px 0;	
}

.videos-section iframe {
	margin-top: 20px;	
}

.videos-section ul {
	overflow: hidden;
	padding-left: 20px;	
}

.photos-section img {
	padding: 0 5px 10px 0;
	width: 161px;
	height: 107px;
}

.charts-section img {
	float: left;
	padding: 0 30px 10px 0;	
	clear: both;
}

.search-chart {
	display: block;	
	clear: both;
}

.twitter-tweet {
	width: 680px !important;
}

/*
.tweet-actions {
	top: 8px !important;
	float: right !important;
	position: absolute !important;
	bottom: auto !important;
}

.tweet-actions li {
	width: 27px !important;	
}


.twitter-tweet .var-narrow.standalone-tweet .tweet-actions li {
	width: 30px;
	float: right;	
}
*/

.fb-post {
	margin-bottom: 20px;	
}


/* Section icons */

.timeline-icon {
	position: absolute;
	left: -77px;
	margin-top: 12px;
}

.timeline-icon {
	height: 37px !important;
	width: 37px !important;
}


/* Hover effects */

.hover .collapse-controls {
	background-color: #547ca0;	
}

.hover .section-heading {
	background-color: #3d678b;
}

.hover {
	cursor: pointer;	
}



/* Loading */

#timeline {
	visibility: hidden;
	/*display: none;*/
}

#loading {
	text-align: center;
	padding: 40px;
	font-size: 16px;
	color: #797979;
	position: relative;
}

.contentcontainer {

}

#loading img {
	padding-bottom: 20px;
	display: block;
	margin: 0 auto;
}


/* Miscellaneous */

.clearfix {
	clear: both;	
}


/* Fixes for IE 7 and 8 */

.old-ie .timeline-day {
	background-image: none;
}

.old-ie .show-controls, .old-ie .collapse-controls .show-controls-label {
	background-position: right;	
}

.ie7 #timeline h2 {
	top: 0;
	left: 0;
	position: relative !important;
	float: left;
}

.ie7 .show-controls {
	width: 20px;
	height: 20px;	
}

.ie7 .scroll-to-top {
	display: none;	
}

.ie7 .timeline-section ul li {
	margin-left: 20px;	
}

/* Responsive */

@media (max-width: 1200px) {
	.scroll-to-top {
		background-color: #dbdbdb;
	}
}