@charset "utf-8";

main {
    display: block;
    position: relative;
	text-align: center;
}


#dtlayout {
	display: block;
	width: 100%;
	height: 100vh;
}
#dtcontent {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 79rem;
	padding: 57.5rem 0rem 2rem 20.5rem;
	font-size: 1.25rem;
}
#dtcontent h1 {
	color: transparent;
}

#dtimages {
	display: block;
}

#dtimages > figure {
	display: block;
	animation-name: imageAnimation;
	animation-duration: 36s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	background-size: contain;
	background-repeat: no-repeat;
	color: transparent;
	opacity: 0;
	position: absolute;
	margin: 0;
	width: 100%;
	height: 125rem;
	z-index: 0;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
}

#dtimages > figure:nth-child(1) { background-image: url("background-image-dt-01.jpg"); }
#dtimages > figure:nth-child(2) { animation-delay: 6s; background-image: url("background-image-dt-02.jpg"); }
#dtimages > figure:nth-child(3) { animation-delay: 12s; background-image: url("background-image-dt-07-aurora.jpg"); }
#dtimages > figure:nth-child(4) { animation-delay: 18s; background-image: url("background-image-dt-04.jpg"); }
#dtimages > figure:nth-child(5) { animation-delay: 24s; background-image: url("background-image-dt-06.jpg"); }
#dtimages > figure:nth-child(6) { animation-delay: 30s; background-image: url("background-image-dt-05.jpg"); }

@keyframes 
imageAnimation {
0% { animation-timing-function: ease-out; opacity: 0; }
8% { animation-timing-function: ease-out; opacity: 1; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}

#dtone {
	display: block;
	margin-bottom: 1.25rem;
}
#dtone p {
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0;
    margin-inline-end: 0;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
}
#dtintro {
	display: inline-block;
	padding-bottom: 11rem;
	text-align: center;
}
#dtintrotitle {
	display: block;
	padding-bottom: 1rem;
}
#dtintrotitle img {
	height: 5.5rem;
}
#dtintrobulletone {
	display: inline-block;
	margin: 0rem 2.5rem 0rem 6rem;
	text-align: center;
	vertical-align: bottom;
}
#dtintrobullettwo {
	display: inline-block;
	text-align: center;
	vertical-align: bottom;
	padding-right: 1rem;
}
.dtintrobulletpoints {
	display: block;
	margin: 1.75rem 0rem 1.75rem 0rem;
}
.dtintrobulletpoints img {
	height: 2.5rem;
	margin-bottom: 0.5rem;
}
#dttwo {
	display: block;
	text-align: center;
	margin: -2.5rem 0rem 2.5rem 0rem;
}
#dttwo h2 {
	color: #000000;
	margin-bottom: 0.5rem;
}
#dttwocola {
	display: inline-block;
	vertical-align: top;
	margin-right: 7rem
}
#dttwocolb {
	display: inline-block;
	vertical-align: bottom;
	padding-top: 16.25rem;
}
.dttease {
	display: block;
	width: 30rem;
	margin-top: 7.5rem;
	background-color: #e5e5e5;
	border-radius: 1rem;
	box-shadow: 0rem 0rem 1rem 1rem #e5e5e5;
}
.dtteaseimg {
	display: block;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}
.dtteaseimg img {
	width: 100%;
	border-radius: 1rem;
}
.dtteasewording {
	display: block;
	padding: 0.25rem 0rem 0.25rem 0rem;
}



#tablayout {
	display: block;
	width: 100%;
	text-align: center;
}
#tabcontent {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	padding-top: 47.5rem;
	font-size: 1.25rem;
}
#tabcontent h1 {
	color: transparent;
}

#tabimages {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
}

#tabimages > figure {
	display: block;
	animation-name: imageAnimation;
	animation-duration: 36s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	background-size: contain;
	background-repeat: no-repeat;
	color: transparent;
	opacity: 0;
	position: absolute;
	margin: 0;
	width: 100%;
	height: 125rem;
	z-index: 0;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
}
#tabimages > figure:nth-child(1) { background-image: url("background-image-tab-01.jpg"); }
#tabimages > figure:nth-child(2) { animation-delay: 6s; background-image: url("background-image-tab-02.jpg"); }
#tabimages > figure:nth-child(3) { animation-delay: 12s; background-image: url("background-image-tab-07-aurora.jpg"); }
#tabimages > figure:nth-child(4) { animation-delay: 18s; background-image: url("background-image-tab-04.jpg"); }
#tabimages > figure:nth-child(5) { animation-delay: 24s; background-image: url("background-image-tab-06.jpg"); }
#tabimages > figure:nth-child(6) { animation-delay: 30s; background-image: url("background-image-tab-05.jpg"); }

@keyframes 
imageAnimation {
0% { animation-timing-function: ease-out; opacity: 0; }
8% { animation-timing-function: ease-out; opacity: 1; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}

#tabone {
	display: block;
	width: fit-content;
	margin: 0rem auto 1.5rem auto;
}
#tabone p {
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0;
    margin-inline-end: 0;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
}
#tabintro {
	display: block;
	text-align: center;
	margin-bottom: -3rem;
}
#tabintrotitle {
	display: block;
	padding-bottom: 2.5rem;
}
#tabintrotitle img {
	height: 5.5rem;
}
#tabintrotext {
	display: inline-block;
	width: 30rem;
	margin-left: 1rem;
	vertical-align: middle;
}
#tabintrobullets {
	display: inline-block;
	width: 27.5rem;
	text-align: center;
	vertical-align: middle;
}
#tabintrobulletsone {
	display: inline-block;
	padding-right: 1.25rem;
}
#tabintrobulletstwo {
	display: inline-block;
	padding-left: 1.25rem;
}
.tabintrobulletpoints {
	display: block;
	margin: 1.25rem 0rem 1.25rem 0rem;
}
.tabintrobulletpoints img {
	height: 2.5rem;
	margin-bottom: 0.5rem;
}
#tabtwo {
	display: block;
	text-align: center;
}
#tabtwo h2 {
	color: #000000;
	margin-bottom: 0.5rem;
}
#tabtwocola {
	display: inline-block;
	vertical-align: top;
	margin-right: 5rem
}
#tabtwocolb {
	display: inline-block;
	vertical-align: bottom;
	padding-top: 15.25rem;
}
.tabtease {
	display: block;
	width: 24rem;
	margin-top: 7.5rem;
	background-color: #e5e5e5;
	border-radius: 1rem;
	box-shadow: 0rem 0rem 1rem 1rem #e5e5e5;
}
.tabteaseimg {
	display: block;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}
.tabteaseimg img {
	width: 100%;
	border-radius: 1rem;
}
.tabteasewording {
	display: block;
	padding: 0.25rem 0rem 0.25rem 0rem;
}
#tabrewind {
	margin-top: 2.5rem;
}



#moblayout {
	display: block;
	width: 100%;
	text-align: center;
}
#mobcontent {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	padding-top: 47.5rem;
	font-size: 1.25rem;
}
#mobcontent h1 {
	color: transparent;
}

#mobimages {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
}

#mobimages > figure {
	display: block;
	animation-name: imageAnimation;
	animation-duration: 36s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	background-size: contain;
	background-repeat: no-repeat;
	color: transparent;
	opacity: 0;
	position: absolute;
	margin: 0;
	width: 100%;
	height: 125rem;
	z-index: 0;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
}
#mobimages > figure:nth-child(1) { background-image: url("background-image-mob-01.jpg"); }
#mobimages > figure:nth-child(2) { animation-delay: 6s; background-image: url("background-image-mob-02.jpg"); }
#mobimages > figure:nth-child(3) { animation-delay: 12s; background-image: url("background-image-mob-07-aurora.jpg"); }
#mobimages > figure:nth-child(4) { animation-delay: 18s; background-image: url("background-image-mob-04.jpg"); }
#mobimages > figure:nth-child(5) { animation-delay: 24s; background-image: url("background-image-mob-06.jpg"); }
#mobimages > figure:nth-child(6) { animation-delay: 30s; background-image: url("background-image-mob-05.jpg"); }

@keyframes 
imageAnimation {
0% { animation-timing-function: ease-out; opacity: 0; }
8% { animation-timing-function: ease-out; opacity: 1; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}

#mobone {
	display: block;
	width: fit-content;
	margin: 0rem auto 0rem auto;
}
#mobone p {
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0;
    margin-inline-end: 0;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
}
#mobintro {
	display: block;
	text-align: center;
}
#mobintrotitle {
	display: block;
	padding-bottom: 2.5rem;
}
#mobintrotitle img {
	height: 5.5rem;
}
#mobintrobulletholder {
	display: block;
	margin: 5rem auto 0rem auto;
	text-align: center;
	width: 40rem;
}
.mobintrobulletpoints {
	display: inline-block;
	margin: 0.5rem 2rem 0.5rem 2rem;
}
.mobintrobulletpoints img {
	height: 2.5rem;
}
#mobtwo {
	display: block;
	margin-top: 7rem;
	text-align: center;
}
#mobtwo h2 {
	color: #000000;
	margin-bottom: 0.5rem;
}
.mobteasea {
	display: block;
	width: 30rem;
	margin: 0rem auto 7.5rem 3rem;
	background-color: #e5e5e5;
	border-radius: 1rem;
	box-shadow: 0rem 0rem 1rem 1rem #e5e5e5;
}
.mobteaseb {
	display: block;
	width: 30rem;
	margin: 0rem 3rem 7.5rem auto;
	background-color: #e5e5e5;
	border-radius: 1rem;
	box-shadow: 0rem 0rem 1rem 1rem #e5e5e5;
}
.mobteaseimg {
	display: block;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}
.mobteaseimg img {
	width: 100%;
	border-radius: 1rem;
}
.mobteasewording {
	display: block;
	padding: 0.25rem 0rem 0.25rem 0rem;
}
#mobrewind {
	margin-top: -3.5rem;
}



#mob668layout {
	display: block;
	width: 100%;
	text-align: center;
}
#mob668content {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	padding-top: 47.5rem;
	font-size: 1.25rem;
}
#mob668content h1 {
	color: transparent;
}

#mob668images {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
}

#mob668images > figure {
	display: block;
	animation-name: imageAnimation;
	animation-duration: 36s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	background-size: contain;
	background-repeat: no-repeat;
	color: transparent;
	opacity: 0;
	position: absolute;
	margin: 0;
	width: 100%;
	height: 125rem;
	z-index: 0;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
}
#mob668images > figure:nth-child(1) { background-image: url("background-image-mob668-01.jpg"); }
#mob668images > figure:nth-child(2) { animation-delay: 6s; background-image: url("background-image-mob668-02.jpg"); }
#mob668images > figure:nth-child(3) { animation-delay: 12s; background-image: url("background-image-mob668-07-aurora.jpg"); }
#mob668images > figure:nth-child(4) { animation-delay: 18s; background-image: url("background-image-mob668-04.jpg"); }
#mob668images > figure:nth-child(5) { animation-delay: 24s; background-image: url("background-image-mob668-06.jpg"); }
#mob668images > figure:nth-child(6) { animation-delay: 30s; background-image: url("background-image-mob668-05.jpg"); }

@keyframes 
imageAnimation {
0% { animation-timing-function: ease-out; opacity: 0; }
8% { animation-timing-function: ease-out; opacity: 1; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}

#mob668one {
	display: block;
	width: fit-content;
	margin: 0rem auto 0rem auto;
}
#mob668one p {
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0;
    margin-inline-end: 0;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
}
#mob668intro {
	display: block;
	text-align: center;
}
#mob668introtitle {
	display: block;
	padding-bottom: 2.5rem;
}
#mob668introtitle img {
	height: 4.5rem;
}
#mob668introbulletholder {
	display: block;
	margin-top: 5rem;
	text-align: center;
}
.mob668introbulletpoints {
	display: inline-block;
	margin: 0.5rem 2rem 0.5rem 2rem;
}
.mob668introbulletpoints img {
	height: 2.5rem;
}
#mob668two {
	display: block;
	margin-top: 7rem;
	text-align: center;
}
#mob668two h2 {
	color: #000000;
	margin-bottom: 0.5rem;
}
.mob668tease {
	display: block;
	width: 30rem;
	margin: 0rem auto 7.5rem auto;
	background-color: #e5e5e5;
	border-radius: 1rem;
	box-shadow: 0rem 0rem 1rem 1rem #e5e5e5;
}
.mob668teaseimg {
	display: block;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}
.mob668teaseimg img {
	width: 100%;
	border-radius: 1rem;
}
.mob668teasewording {
	display: block;
	padding: 0.25rem 0rem 0.25rem 0rem;
}
#mob668rewind {
	margin-top: -3.5rem;
}



#mob468layout {
	display: block;
	width: 100%;
	text-align: center;
}
#mob468content {
	display: block;
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	padding-top: 55rem;
	font-size: 1.25rem;
}
#mob468content h1 {
	color: transparent;
}

#mob468images {
	display: block;
	position: absolute;
	top: 11rem;
	left: 0rem;
	width: 100%;
}

#mob468images > figure {
	display: block;
	animation-name: imageAnimation;
	animation-duration: 36s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	background-size: contain;
	background-repeat: no-repeat;
	color: transparent;
	opacity: 0;
	position: absolute;
	margin: 0;
	width: 100%;
	height: 125rem;
	z-index: 0;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
}

#mob468images > figure:nth-child(1) { background-image: url("background-image-mob468-01.jpg"); }
#mob468images > figure:nth-child(2) { animation-delay: 6s; background-image: url("background-image-mob468-02.jpg"); }
#mob468images > figure:nth-child(3) { animation-delay: 12s; background-image: url("background-image-mob468-07-aurora.jpg"); }
#mob468images > figure:nth-child(4) { animation-delay: 18s; background-image: url("background-image-mob468-04.jpg"); }
#mob468images > figure:nth-child(5) { animation-delay: 24s; background-image: url("background-image-mob468-06.jpg"); }
#mob468images > figure:nth-child(6) { animation-delay: 30s; background-image: url("background-image-mob468-05.jpg"); }

@keyframes 
imageAnimation {
0% { animation-timing-function: ease-out; opacity: 0; }
8% { animation-timing-function: ease-out; opacity: 1; }
17% { opacity: 1 }
25% { opacity: 0 }
100% { opacity: 0 }
}

#mob468one {
	display: block;
	width: fit-content;
	margin: 0rem auto 0rem auto;
}
#mob468one p {
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0;
    margin-inline-end: 0;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 0;
	-webkit-margin-end: 0;
}
#mob468intro {
	display: block;
	text-align: center;
}
#mob468introtitle {
	display: block;
	padding-bottom: 2.5rem;
}
#mob468introtitle img {
	height: 4rem;
}
#mob468introbulletholder {
	display: block;
	margin-top: 5rem;
	text-align: center;
}
.mob468introbulletpoints {
	display: inline-block;
	margin: 0.5rem 0.875rem 0.5rem 0.875rem;
}
.mob468introbulletpoints img {
	height: 2.5rem;
}
#mob468two {
	display: block;
	margin-top: 7rem;
	text-align: center;
}
#mob468two h2 {
	color: #000000;
	margin-bottom: 0.5rem;
}
.mob468tease {
	display: block;
	width: 21rem;
	margin: 0rem auto 5rem auto;
	background-color: #e5e5e5;
	border-radius: 0.75rem;
	box-shadow: 0rem 0rem 0.75rem 0.75rem #e5e5e5;
}
.mob468teaseimg {
	display: block;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}
.mob468teaseimg img {
	width: 100%;
	border-radius: 0.75rem;
}
.mob468teasewording {
	display: block;
	padding: 0.25rem 0rem 0.25rem 0rem;
}
#mob468rewind {
	margin-top: -1rem;
}



@media screen and (min-width: 1181px) {
#tablayout {
	display: none;
}
}

@media screen and (max-width: 1180px) {
#dtlayout{
	display: none;
}
}

@media screen and (min-width: 869px) {
#moblayout{
	display: none;
}
}

@media screen and (max-width: 868px) {
#tablayout {
	display: none;
}
}

@media screen and (min-width: 669px) {
#mob668layout {
	display: none;
}
}

@media screen and (max-width: 668px) {
#moblayout {
	display: none;
}
}

@media screen and (min-width: 469px) {
#mob468layout {
	display: none;
}
}

@media screen and (max-width: 468px) {
#mob668layout {
	display: none;
}
}