html,
body,
div{
	margin: 0;
	padding: 0;
}

html,
body{
	width: 100%;
	height: 100%;
}

.royalSlider{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	height: auto;
	width: auto;
	float: left;
	margin: 10px auto;
}

.royalSlider{
	font-size: 100px;
}

.rsImg{
	margin-top: 0;
}

.kapiolani{
	width: 50vw;
	height: 80vh;
	margin-top: 15vh;
}

.rsGCaption,
figure.rsCaption{
	position: absolute;
	left: 20px;
	font-size: 20px;
	top: 20px;
	color: black;
}

@media only screen and (min-width: 769px) and (max-width: 1024px){
	.kapiolani{
		width: 769px;
		height: 500px;
	}
}

@media only screen and (min-width: 560px) and (max-width: 768px){
	.kapiolani{
		width: 560px;
		height: 364px;
	}
}

@media only screen and (max-width: 559px){
	.kapiolani{
		width: 276px;
		height: 208px;
	}
}
