@charset "UTF-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
.cmscontent ol, .cmscontent ul {
	margin: 20px 0 20px 30px;
	list-style: disc;
}
.cmscontent li {
	margin-bottom: 15px;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
input[type=hidden]{
	visibility:hidden;
	}
/* slightly enhanced, universal clearfix hack */
.clearfix:after{
	visibility:hidden;
	display:block;
	font-size:0;
	content:" ";
	clear:both;
	height:0;
	}
.clearfix{
	display:inline-block;
	}
/* start commented backslash hack \*/
* html .clearfix{
	height:1%;
	}
.clearfix{
	display:block;
	}
/* stop commented backslash hack */	


html{
	background-color:#fff;
	background-image:url('/image/1018/1200/tsar-gala-v4.jpg');
	background-position:50% 0;	
	background-repeat:no-repeat;
	background-size:cover;
	color:#000;
	height:100vh;
	margin:0;
}

strong{
	font-weight:bold;
	}
em{
	font-style:italic;
	}

/* Body
*********************************************************/
body{
	font-size:100%;
	font-family:'Montserrat', sans-serif;
	margin:0;
	height:100vh;
	overflow:hidden;
	}
	body:after{
		display:block;
		content:'';
		position:absolute;
		right:0;
		top:0;
		bottom:0;
		width:10vw;
		background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 100%);
		background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 100%);
		background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#aaffff',GradientType=1 );
		z-index:40;
		pointer-events:none;
		}	
	
input, textarea, button{
	font-size:100%;
	font-family:'Montserrat', sans-serif;
	}	
	
header{
	position:absolute;
	top:0;
	width:100%;
	height:10vh;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;   
	z-index:42;
	}
	header nav{
		position:absolute;
		top:0;
		}
		header nav ul{
			}
			header nav ul li{
				display:inline-block;
				vertical-align:middle;
				font-size:1.5em;
				background-color:rgba(0,0,0,0.6);
				color:#dcdddd;
				}
			header nav ul li:hover{
				}
				header nav ul li a{
					padding:14px;
					display:block;
					color:#dcdddd;
					text-align:center;
					min-width:1em;
					}
				header nav ul li a:hover{
					color:#ffffff;
					background-color:rgba(0,0,0,0.3);
					}
			header nav ul li.collections{
				padding:10px 14px;
				font-size:0.8125em;
				line-height:1.25em;
				text-transform:uppercase;
				display: none;
				}
	header nav.social{
		right:0;
		}
		header nav.social ul li{
			margin-right:1px;
			}
	header nav.main{
		left:0;
		}
		header nav.main ul li{
			margin-left:1px;
			}

div.content{
	position:relative;
	margin-top:53px;
	height:calc(100vh - 53px);
	}
	
div.timeline{
	padding-top:52px;
	position:relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;   	
	}
	
div.timeline > ul{
	position:absolute;
	white-space:nowrap;
	margin-left:104px;
	background:rgba(255,255,255,0.1);
	transition:all 1s linear;
	left:0;
	}
	div.timeline > ul > li{
		position:relative;
		display:inline-block;
		vertical-align:top;
		min-width:30vw;
		box-sizing:border-box;
		}
		div.timeline > ul > li > a{
			display:inline-block;
			background:rgba(255,255,255,0.25);
			font-size:1.5em;
			box-sizing:border-box;
			padding:0.5em;
			}
	div.timeline ul li.chapter-title{
		position:static;
		min-width:auto;
		margin-left:8em;
		font-size:2em;
		}
		div.timeline ul li.chapter-title h2{
			position:absolute;
			text-align:left;
			bottom:0;
			padding:2em 0.5em 3em 0.5em;
			width:26vw;
			line-height:1.25em;
			white-space:normal;
			-webkit-transform: rotate(-90deg);
			-moz-transform: rotate(-90deg);
			-ms-transform: rotate(-90deg);
			transform: rotate(-90deg);
		    -webkit-transform-origin: left bottom 0;
		    -moz-transform-origin: left bottom 0;
			-ms-transform-origin: left bottom 0;
		    transform-origin: left bottom 0;
			}
	div.timeline > ul > li > ul{
		white-space:nowrap;
		}
	div.timeline > ul > li > ul > li{
		min-width:30vw;
		display:inline-block;
		vertical-align:top;
		border-top:1px dotted rgba(0,0,0,0.25);
		box-sizing:border-box;
		padding:0 0.5em;
		cursor:pointer;
		text-align:center;
		}
		div.timeline > ul > li > ul > li > h3{
			display:inline-block;
			text-align:center;
			padding:10px;
			background:rgba(255,255,255,0.25);
			font-size:1.5em;
			margin:0 auto;
			white-space:normal;
			}
			div.timeline > ul > li > ul > li > h3 > i{
				display:block;
				text-align:center;
				font-size:0.75em;
				line-height:1em;
				}
		div.timeline > ul > li > ul > li > div{
			padding:1em 1em 1em 1em;
			background:rgba(255,255,255,0.25);
			text-align:left;
			}
			div.timeline > ul > li > ul > li > div > div{
				position:relative;
				height:0;
				padding-bottom:75%;
				box-sizing:border-box;
				background-position:50%;
				background-size:cover;
				}
				div.timeline > ul > li > ul > li > div > div.loaded{
					}
				div.timeline > ul > li > ul > li > div > div > h4{
					background:rgba(0,0,0,0.5);
					display:block;
					position:absolute;
					top:0;
					left:0;
					width:20vw;
					padding:0.5em;
					font-size:1.5em;
					font-weight:normal;
					color:#ffffff;
					white-space:normal;
					}
					div.timeline > ul > li > ul > li > div > div > h4 > small{
						display:block;
						margin-top:0.5em;
						font-size:0.75em;
						line-height:1.25em;
						}
				div.timeline > ul > li > ul > li > div > div > div.caption{
					display:none;
					position:absolute;
					background:rgba(0,0,0,0.5);
					padding:0.5em;
					bottom:0;
					left:0;
					right:0;
					white-space:normal;
					color:#ffffff;
					line-height:1.25em;
					}
		div.timeline > ul > li > ul > li:hover > h3,
		div.timeline > ul > li > ul > li:hover > div{
			background:rgba(255,255,255,0.75);
			}
		div.timeline > ul > li > ul > li:hover > div > div > div.caption{
			display:block;
			}
		
div.items > div{
	display:none;
	background:rgba(255,255,255,0.75);
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
	z-index:50;
	box-sizing:border-box;
	padding:2em;
	overflow:auto;
	}
	div.items > div nav{
		position:absolute;
		top:0;
		right:0;
		}
		div.items > div nav ul{
			}
			div.items > div nav ul li{
				display:inline-block;
				vertical-align:middle;
				background-color:rgba(0,0,0,0.6);
				color:#dcdddd;
				margin-right:1px;
				}
			div.items > div nav ul li:hover{
				}
				div.items > div nav ul li a{
					padding:14px;
					display:block;
					color:#dcdddd;
					text-align:center;
					min-width:1em;
					text-decoration:none;
					}
				div.items > div nav ul li a:hover{
					color:#ffffff;
					background-color:rgba(0,0,0,0.3);
					}
				div.items > div nav ul li.active a{
					color:#ffffff;
					background-color:rgba(255,255,255,0.3);
					}
	div.items > div h2{
		font-size:3em;
		margin-bottom:0.25em;
		font-weight:normal;
		}
	div.items > div h3{
		font-size:1.5em;
		margin-bottom:0.5em;
		font-weight:normal;
		}
	div.items > div div.tab{
		display:none;
		margin-top:2em;
		}
	div.items > div div.tab p{
		line-height:1.5em;
		margin-bottom:1em;
		}
	div.items > div div.tab.introduction{
		display:block;
		}
	div.items > div div.tab.introduction,
	div.items > div div.tab.biography{
		max-width:1100px;
		}
		div.items > div div.tab.introduction div.primaryimage,
		div.items > div div.tab.biography div.biographyimage{
			float:left;
			display:table;
			margin-right:1em;
			margin-bottom:1em;
			}
			div.items > div div.tab.introduction div.primaryimage img,
			div.items > div div.tab.biography div.biographyimage img{
				display:block;
				margin-bottom:0.5em;
				max-width:100%;
				}
			div.items > div div.tab.introduction div.primaryimage div.caption,
			div.items > div div.tab.biography div.biographyimage div.caption{
				display:table-caption;
				caption-side:bottom;
				font-size:0.8125em;
				}
	div.items > div div.tab.gallery ul.gallery > li{
		position:relative;
		display:inline-block;
		vertical-align:top;
		margin-right:1em;
		margin-bottom:1em;
		}
		div.items > div div.tab.gallery ul.gallery > li > div.image{
			display:table;
			}
			div.items > div div.tab.gallery ul.gallery > li > div.image img{
				display:block;
				height:300px;
				}
            div.items > div #item-180-gallery ul.gallery > li > div.image img{
				height:auto;
				}
			div.items > div div.tab.gallery ul.gallery > li > div.image div.caption{
				display:table-caption;
				caption-side:bottom;
				padding:0.5em;
				bottom:0;
				left:0;
				right:0;
				white-space:normal;
				font-size:0.8125em;
				line-height:1.25em;
				}
	div.items > div div.tab.video{
		max-width:800px;
		}
		div.items > div div.tab.video div.fluidvideo{
			position: relative;
			padding-bottom: 56.25%; /* 16:9 */
			height: 0;
			}
			div.items > div div.tab.video div.fluidvideo iframe{
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				}	
				
a.togglebutton{
	padding:10px 14px;
	display:inline-block;
	color:#dcdddd;
	min-width:8em;
	text-align:center;
	text-decoration:none;
	background-color:rgba(0,0,0,0.6);
	}
a.togglebutton:hover{
	color:#ffffff;
	background-color:rgba(0,0,0,0.9);
	}				
				
form{
	margin:20vh auto 0 auto;
	width:30vw;
	padding:3em;
	background:rgba(255,255,255,0.5);
	}
	form label{
		display:inline-block;
		width:10vw;
		}
	form p{
		margin-bottom:1em;
		}
		
.item form{
	background:none;
	}

.columns.twocolumn{
	}
	.columns.twocolumn > div{
		width:50%;
		float:left;
		box-sizing:border-box;
		padding-right:2em;
		}

.cmscontent h1,
.cmscontent h2,
.cmscontent h3,
.cmscontent h4,
.cmscontent h5,
.cmscontent h6,
.cmscontent p{
	margin-bottom:0.75em;
	line-height:1.25em;
	max-width:1000px;
	}
.cmscontent h1{
	font-size:1.25em;
	}
.cmscontent h2{
	font-size:1.125em;
	}

.cmscontent h1,
.cmscontent h2,
.cmscontent h3,
.cmscontent h4,
.cmscontent h5,
.cmscontent h6{
	font-weight:bold;
	}
	
form.search,
form.contact{
	padding:0;
	margin:2em 0;
	width:100%;
	}
	form.search input,
	form.search button,
	form.contact input,
	form.contact button,
	form.contact textarea{
		padding:0.5em;
		font-size:1.125em;
		}
	form.contact label{
		width:100%;
		box-sizing:border-box;
		}
	form.contact input,
	form.contact textarea{
		display:block;
		box-sizing:border-box;
		max-width:600px;
		width:100%;
		}
	form.contact textarea{
		height:25vh;
		}

.result-chapter,
.result{
	margin-bottom:1em;
	}

footer{
	position:absolute;;
	width:100%;
	bottom:0;
	height:20vh;
	z-index:43;
	}
	footer nav.timeline{
		position:relative;
		width:60vw;
		height:10vh;
		margin:5vh auto;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		}
		footer nav.timeline a.previous,
		footer nav.timeline a.next{
			position:absolute;
			display:block;
			top:2vh;
			width:5%;
			height:6vh;
			background:rgba(0,0,0,0.6);
			line-height:6vh;
			text-align:center;
			font-size:1.5em;
			color:#fff;
			}
			footer nav.timeline a.previous:hover,
			footer nav.timeline a.next:hover{
				background:rgba(0,0,0,0.8);
				cursor:pointer;
				}
		footer nav.timeline a.previous{
			left:0;
			}
		footer nav.timeline a.next{
			right:0;
			}
		footer nav.timeline div.firstyear,
		footer nav.timeline div.lastyear{
			position:absolute;
			top:2vh;
			width:10%;
			height:6vh;
			background:rgba(255,255,255,0.25);
			line-height:6vh;
			text-align:center;
			font-size:1.25em;
			}
		footer nav.timeline div.firstyear{
			left:5%;
			}
		footer nav.timeline div.lastyear{
			right:5%;
			}
		footer nav.timeline div.mini{
			background:rgba(255,255,255,0.25);
			height:10vh;
			width:70%;
			margin:0 auto;
			cursor:pointer;
			box-sizing:border-box;
			border:1px solid rgba(0,0,0,0.5);
			}
			footer nav.timeline div.mini div.position{
				position:relative;
				height:100%;
				width:3px;
				background:red;
				pointer-events:none;
				transition:all 0.5s linear;
				left:0;
				}
	footer > div{
		position:absolute;
		bottom:0;
		padding:20px;
		font-size:1.5em;
		background-color:rgba(0,0,0,0.6);
		color:#dcdddd;
		z-index:44;
		}
	footer > div.collections{
		left:0;
		padding:20px;
		font-size:0.8125em;
		line-height:1.25em;
		text-transform:uppercase;
		}
	footer > div.white-lodge{
		right:0;
		padding:8px 20px;
		}
		footer > div.white-lodge img{
			height:52px;
			}
							
/* Responsive layout for Smartphone (Small Desktop) */
@media screen and (max-width: 1024px) {
	
		div.items > div div.tab p {
			clear:both;
			}
	
	}
							
/* Responsive layout for Smartphone (Single Column) */
@media screen and (max-width: 800px) {
	
	.hide-tablet{
		display:none;
		}

	div.items > div h2{
		font-size:2em;
		}

	div.timeline > ul > li > ul > li{
		min-width:45vw;
		}	
		
	div.timeline > ul > li.chapter-title h2{
		width:30vh;
		font-size:1.25em;
		}
		
	div.timeline > ul > li > ul > li > div > div > h4 {
		font-size:1em;
		}
		div.timeline > ul > li > ul > li > div > div > h4 > small,
		div.timeline > ul > li > ul > li > div > div > div.caption{
			font-size:0.8125em;
			}
		
	footer nav.timeline div.firstyear, footer nav.timeline div.lastyear{
		font-size:0.8125em;
		}

	}							
							
/* Responsive layout for Smartphone (Single Column) */
@media screen and (max-width: 560px) {
	
	.hide-phone{
		display:none;
		}

	div.timeline > ul > li > ul > li{
		min-width:70vw;
		}

	}