/* -------------- OXFAM GUATEMALA ---------------- */
/* ------------- Author: DDS --------------- */
/* -------- Domestic Data Streamers 2019 --------- */

/*------------------------------ Fonts ----------------------------*/


@font-face {
  	font-family: 'Asul';
  	src: url('../fonts/Asul-Regular.ttf')  format('truetype');
}

@font-face {
  font-family: 'Source-sans';
  src: url('../fonts/source-sans-300.ttf')  format('truetype');
  src: url('../fonts/source-sans-300.woff')  format('woff');
}

h1 { 
	font-family: 'Asul', sans-serif;
	font-size: 5em;
	margin: 0px;
}

h2 { 
	font-family: 'Asul', sans-serif;
	font-size: 3em;
	margin: 0px;
}

h3 { 
	font-family: 'Asul', sans-serif;
	font-size: 2.2em;
	margin: 0px;
}

p { 
	font-family: 'Asul', sans-serif;
	font-size: 1.8em;
}

a{
	color: #000;
}

a:hover{
	color: #000;
}

a{ 
	font-size: 2.2em; 
}

.scene2 a{ 
	font-size: 1em;
    color: #468f80;
}

@media (max-width: 1600px) {
	h1{ font-size: 4.2em; }
	h2{ font-size: 2.5em; }
	h3{ font-size: 2em; }
	p{ font-size: 1.4em; }
	a{ font-size: 2em; }
	.scene2 a{ font-size: 1em; }
 }

@media (max-width: 1200px) {
	h1{ font-size: 4em; }
	h2{ font-size: 2.4em; }
	h3{ font-size: 1.5em; }
	p{ font-size: 1.2em; }
	a{ font-size: 1.6em; }
	.scene2 a{ font-size: 1em; }
 }

 @media (max-width: 800px) {
 	h1 { font-size: 3em; }
	h2 { font-size: 2.2em; }
	h3 { font-size: 1.5em; }
	p { font-size: 1.1em; }
	a{ font-size: 1.5em; }
	.scene2 a{ font-size: 1em; }
 }

 @media (max-width: 400px) {
 	h1 { font-size: 3em; }
	h2 { font-size: 1.6em; }
	h3 { font-size: 1.2em; }
	p { font-size: 1em; }
	a{ font-size: 1.3em; }
	.scene2 a{ font-size: 1em; }
 }

/*------------------------- Global content -------------------------*/

html, body{
    width:100%;
    height:100%;
    background-color: #EBE4D3;
	font-family: 'apercu_legular', sans-serif; 
	overflow: hidden;
}

canvas{
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}
    
.carousel-inner,.carousel,.item,.container,.fill {
  	height:100%;
  	width:100%;
  	background-position:center center;
  	background-size:cover;
  	padding: 0px;
  	margin: 0px;
}

.slide-wrapper{
	display:inline;
}

.inner-content{
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	padding: 0;
	padding-right: 0;
	z-index: 20;
}

.static-content{
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	z-index: 0;
}

.logo-oxfam{
	width: 230px;
}

@media (max-width: 800px) {
	.logo-oxfam{
		width: 150px;
	}
}

/*------------------ vertical bootstrap slider --------------------*/

.carousel-inner> .item.next ,  .carousel-inner > .item.active.right{ 
	transform: translateY(100%); 
	-webkit-transform: translateY(100%); 
	-ms-transform: translateY(100%);
	-moz-transform: translateY(100%); 
	-o-transform: translateY(100%);  
	top: 0;
	left:0;
}
.carousel-inner > .item.prev ,.carousel-inner > .item.active.left{ 
	transform: translateY(-100%); 
	-webkit-transform: translateY(-100%);  
	-moz-transform: translateY(-100%);
	-ms-transform: translateY(-100%); 
	-o-transform: translateY(-100%); 
	top: 0; 
	left:0;
}
.carousel-inner > .item.next.left , .carousel-inner > .item.prev.right , .carousel-inner > .item.active{
	transform:translateY(0); 
	-webkit-transform:translateY(0);
	-ms-transform:translateY(0);
	-moz-transform:translateY(0); 
	-o-transform:translateY(0); 
	top:0; 
	left:0;
}

/*----- Vertical carousel indicators -----*/
.carousel-indicators{
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	height: 20px;
	right: 10px; left:auto;
	width: auto;
	opacity: 0.5;
}

.carousel-indicators li{
	display: block; 
	margin-bottom: 5px; 
	border: 1px solid #767676; 
}

.carousel-indicators li.active{
	margin-bottom: 5px; 
	background: #767676;
}


/*------ Slides Transition velocity ------*/

.carousel-inner>.item {
    -webkit-transition: -webkit-transform 1.5s ease-in-out !important;
    -o-transition: -o-transform 1.5s ease-in-out !important;
    transition: transform 1.5s ease-in-out !important;

    background-color: #000;
}

/*------------------------------ Slides ----------------------------*/


/*-------- Slide 1 ------*/
.item1{
	background-color: #000;
}

/*-------- Slide 4 ------*/
.item4{
	background-color: #6c8ac7;
}

/*-------- Slide 5 ------*/
.item5{
	background-color: #000;
}

/*-------- Slide 6 ------*/

.item6{
	background-color: #3d4c97;
}

/*-------- Slide 7 ------*/
.item7{
	background-color: #ffa967;
}

/*-------- Slide 8 ------*/

.item8{
	background-color: #9598a9;
}

/*-------- Slide 9 ------*/
.item9{
	background-color: #000;
}

/*-------- Slide 10 ------*/
.item10{
	background-color: #000;
}

/*-------- Slide 11 ------*/
.item11{
	background-color: #000;
}

/*-------- Slide 12 ------*/
.item12{
	background-color: #ebe5d4;
	text-align: center;
}

#s12-2{
	margin-top: -5px;
}
/* ---------------------- Layers ---------------------- */

.layer-img{
	position:absolute;
    top:0;
    bottom:0;
    left: 0;
    right: 0;
    margin:auto;
    max-height: 100%;
    min-width: 100%;
    z-index: 9999;
}

.layer, .layer2{
	position:absolute;
    top:0;
    bottom:0;
    left: 0;
    right: 0;
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;

}

.title, .info-panel{
    background-color: #dce4e4;
    border: 2px solid #000;
    color: #1c4724;
    font-family: 'Asul',sans-serif;
    width: 38%;
    max-height: fit-content;
    height: -moz-fit-content;
    padding: 2%;
    -webkit-filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, .3));
  	filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, .3));
  	display: table;
  	
}


.title{
	position: absolute;
    margin: auto;
    top: 46%;
    left: 50%;
    text-align: center;
    width: 50%;
    padding: 4%;
    transform: translate(-50%, -50%);
 }

 .title hr{
 	margin: 5% auto;
 	border: 1.5px solid;
    width: 40px;
 }


 .info-panel{
 	position: absolute;
    margin: auto;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    /*-webkit-animation-duration: 1s;
	animation-duration: 1s;*/ 	
  	opacity: 0;
  	color: #000;
 }

.text-content{
	position:absolute;
    top:0;
    bottom:0;
    left: 0;
    right: 0;
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    z-index: 100;
}

 @media (max-width: 1200px) {
 	.info-panel, .title{
		width: 45%;
	}
 }

 @media (max-width: 800px) {
 	.info-panel, .title{
		width: 90%;
	}
 }

  @media (max-width: 400px) {
 	 .info-panel{
		width: 98%;
		padding: 4%;
	 }
	 .title{
	 	padding: 7%;
	 }
 }

#t1-0, #t1-0-xs{
	background-color:#EBE4D3;
}

#t4-1, #t4-1-xs{
	background-color:#c3b9c8;
}

#t6-1, #t6-1-xs{
	background-color:#eba889;
}

#t2-1, #t2-1-xs, #t7-1, #t7-1-xs, , #t10-1, #t10-1-xs{
	background-color: #F4E8E2;
}

#t1-1, #t1-1-xs, #t1-2, #t1-2-xs{
	background-color: #ececec;
}

#t9-1, #t9-1-xs{
	background-color: #e9cb9e;
}

#t4-2, #t4-2-xs, #t5-2, #t5-2-xs, #t6-2, #t6-2-xs, #t8-1, #t8-1-xs, #t9-2, #t9-2-xs, #t11-1, #t11-1-xs{
	background-color: #222222;
	color: #fff;
}

#t4-2 h3, #t4-2-xs h3, #t5-2 h3, #t5-2-xs h3, #t6-2 h3, #t6-2-xs h3, #t8-1 h3, #t8-1-xs h3, #t9-2 h3, #t9-2-xs h3, #t11-1 h3, #t11-1-xs h3{
	/*font-family: 'Source-sans',sans-serif;*/
}

/* ---------------------- Animate ccs ---------------------- */

@keyframes slideInUp {
  from {
    opacity: 1;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes slideInDown {
  from {
    opacity: 1;
    transform: translate3d(0, -10%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes slideOutUp {
  from {
    opacity: 1;
    transform: none;
  }
  to {
    opacity: 1;
    transform: translate3d(0, -100%, 0);
  }
}


/* ---------------------- Loading Page ---------------------- */

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: #ebe5d4;
    text-align: center;
}

.load-gif, .loading-title, .block{
	position: fixed;
	margin: auto;
	top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(-25%);
    height: 150px;
}

.load-gif{
    transform: translateY(-25%);
    height: 150px;
}

.loading-title{
    width: 180px;
    transform: translateY(55%);
}

 @media (min-width: 1200px) {
	.load-gif{
	    transform: translateY(-25%);
	    height: 200px;
	}

	.loading-title{
	    width: 250px;
	    transform: translateY(65%);
	}
}

.block{
    width: 100%;
    height: 100%;
    z-index: 8000;
    display: block;
    transform: translateY(0);
    text-align: center;
}

.static-general{
	position:absolute;
    top:0;
    bottom:0;
    left: 0;
    right: 0;
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    z-index: 3000;
}

#start{
	position: absolute;
	margin: auto;
    top:85%;
    left: 50%;
  	background-color: #EBE4D3;
  	display: table;
  	max-height: fit-content;
  	width: max-content;
  	border: 2px solid #000;
  	color: #1c4724;
  	padding: 18px 30px;
    -webkit-filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, .3));
  	filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, .3));
  	transform: translate(-50%,-50%);
}

.scroll, .scrollTop{
	position: absolute;
	margin: auto;
    top:84%;
    bottom:0;
    left: 0;
    right: 0;
    height: 7%;
    z-index: 8004;
    -webkit-filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, 0.4));
  	filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, 0.4));
  	opacity: 0;
}

.scrollTop{
	display: none;
}

.sound{
	position: absolute;
	margin: auto;
    top:0;
    bottom:87%;
    right: 20px;
    height: 7%;
    z-index: 8006;
    -webkit-filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, 0.4));
  	filter: drop-shadow( 5px 5px 10px rgba(0, 0, 0, 0.4));
}

#police, #police-xs{
	opacity: 0;
	z-index: 7530;
}

#s8-1{
	opacity: 0;
}



/** CREDITS **/

.credits{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
    padding: 12%;
    z-index: 9999;
    opacity: 0;
	display: none;
}

.credits-top{
	position: relative;
	top: 50%;
	transform: translateY(-50%);
    padding: 12% 15%;
    opacity: 0;
}


  @media (max-width: 800px) {
 	.credits, .credits-top{
		padding: 6% 4%;
	}
	.sound{
	    right: 15px;
	}
 }

.links{
	margin-top: 10px;
	text-align: center;
}
.links li{
	width: 46px;
	display: inline-block;
	margin-top: 12px;
	cursor: pointer;
}

@media (max-width: 800px) {
	.links li{
		width: 40px;
	}
}

.credits-text{
	padding: 10px;
}

.credits-title{
	padding: 3%;
	padding-bottom: 0px;
}

.text-right{
	border-left: 2px solid #4a4a4a;
	text-align: center;
}

.text-left{
	text-align: center;
}

.text-bottom{
	padding: 2% 8%;
	padding-top: 26px;
}

.text-btn{
	margin-top: 20px;
}

.text-left a, .text-right a, .text-btn a{
	background-color: #ffc31a;
    padding: 2% 6%;
    border-radius: 40px;
    font-family: 'Asul', sans-serif;
    border: 2px solid #000;
    margin-top: 20px;
    box-shadow: 2px 2px 8px #00000059;
    margin-bottom: 15px;
    cursor: pointer;
}

.text-left h3, .text-right h3{
    margin-bottom: 30px;
    margin-top: 25px;
    padding: auto 2%;
}

 @media (min-width: 1000px) {
	.text-left h3, .text-right h3{
		margin-bottom: 30px;
		margin-top: 15px;
		padding: auto 1%;
	}
	.text-bottom{
	    padding-top: 50px;
	}
	.credits-title {
	    padding-bottom: 3%;
	}
}
 @media (max-width: 1000px) {
 	.text-left h3, .text-right h3{
		border: none;
	}
}

.text-bottom a{
    border-radius: 50px;
    font-family: 'Asul', sans-serif;
    border: 2px solid #fec319;
    margin-top: 10px;
    background-color: transparent;
    box-shadow: none;
    cursor: pointer;
    padding: 15px 30px;
}

 @media (max-width: 800px) {
	.text-bottom a{
		padding: 12px 25px;
	}
}

/*------------------------------ General presets positions ----------------------------*/

.top-left{
	top: 12%;
    left: 10%;
}

.top-right{
	top: 12%;
    left: 50%;
}

.bottom-left{
    left: 10%;
    top: 60%;
}

.bottom-right{
    left: 50%;
    top: 60%;
}

.top-xs{
	bottom: 100%;
}

.item5 .top-xs{
	bottom: 120%;
}

.medium-xs{
	top: 5%;
}

.bottom-xs{
	bottom: 0%;
}

.lg{
	display: none;
}

.info-panel .lg, .title .lg{
	display: table;
}

.xs{
	display: block;
}


 @media (min-width: 800px) {
	.lg{
		display: table;
	}
	.info-panel .lg{
		display: table;
	}
	.xs{
		display: none;
	}

	/** Images Slide 1 **/
	#s1-9 { background-image: url('../img/scene1/s1-layer9-3R.png'); }
	#s1-8 { background-image: url('../img/scene1/s1-layer8-2B.png'); }
	#s1-7 { background-image: url('../img/scene1/s1-layer7-3L.png'); }
	#s1-6 { background-image: url('../img/scene1/s1-layer6-2L.png'); }
	#s1-5 { background-image: url('../img/scene1/s1-layer5-2R.png'); }
	#s1-4 { background-image: url('../img/scene1/s1-layer4-1R.png'); }
	#s1-3 { background-image: url('../img/scene1/s1-layer3-1T.png'); }
	#s1-2 { background-image: url('../img/scene1/s1-layer2-1B.png'); }
	#s1-1 { background-image: url('../img/scene1/s1-layer1-1L.png'); } 

	/** Images Slide 2 **/
	#s2-6  { background-image: url('../img/scene2/s2-layer6-1T.jpg'); }
	#s2-5  { background-image: url('../img/scene2/s2-layer5-2T.png'); }
	#s2-4A { background-image: url('../img/scene2/s2-layer4A-1T.png'); } 
	#s2-4B { background-image: url('../img/scene2/s2-layer4B-1T.png'); } 
	#s2-3  { background-image: url('../img/scene2/s2-layer3-3B.png'); }
	#s2-2  { background-image: url('../img/scene2/s2-layer2-2B.png'); }
	#s2-1C { background-image: url('../img/scene2/s2-layer1C-1B.png'); } 
	#s2-1B { background-image: url('../img/scene2/s2-layer1B-1B.png'); }
	#s2-1A { background-image: url('../img/scene2/s2-layer1A-1B.png'); } 

	/** Images Slide 3 **/
	#s3-9 { background-image: url('../img/scene3/s3-layer9-2T.jpg'); }
	#s3-8 { background-image: url('../img/scene3/s3-layer8-5B.png'); }
	#s3-7 { background-image: url('../img/scene3/s3-layer7-4B.png'); }
	#s3-6 { background-image: url('../img/scene3/s3-layer6-3B.png'); }
	#s3-5 { background-image: url('../img/scene3/s3-layer5-1R.png'); }
	#s3-4 { background-image: url('../img/scene3/s3-layer4-1L2.png'); }  
	#s3-3 { background-image: url('../img/scene3/s3-layer3-2B.png'); }
	#s3-2 { background-image: url('../img/scene3/s3-layer2-1B.png'); }
	#s3-1 { background-image: url('../img/scene3/s3-layer1-1T.png'); }  

	/** Images Slide 4 **/
	#s4-3 { background-image: url('../img/scene4/s4_layer3_C1.png'); }
	#s4-2 { background-image: url('../img/scene4/s4_layer2_B1.png'); }
	#s4-1 { background-image: url('../img/scene4/s4_layer1_1T.png'); }

	/** Images Slide 5 **/
	#s5-5 { background-image: url('../img/scene5/s5_layer5_3B.jpg'); } 
	#s5-4 { background-image: url('../img/scene5/s5_layer4_2B.jpg'); }
	#s5-3 { background-image: url('../img/scene5/s5_layer3_1B.png'); }                        
	#s5-2 { background-image: url('../img/scene5/s5_layer2_1L.png'); }
	#s5-1 { background-image: url('../img/scene5/s5_layer1_1R.png'); }

	/** Images Slide 6 **/
	#s6-2 { background-image: url('../img/scene6/s6_layer1_1B.jpg'); }
	#s6-1 { background-image: url('../img/scene6/s6_layer2_1T.png'); }

	/** Images Slide 7 **/
	#s7-2 { background-image: url('../img/scene7/s7_layer2_B1.jpg'); }
	#s7-3 { background-image: url('../img/scene7/s7_layer3_C2.png'); }
	#s7-4 { background-image: url('../img/scene7/s7_layer4_C3.png'); }

	/** Images Slide 8 **/
	#s8-3 { background-image: url('../img/scene8/s8_layer3_3C.png '); }
	#s8-2 { background-image: url('../img/scene8/s8_layer2_2C.jpg '); }                         
	#s8-1 { background-image: url('../img/scene8/s8_layer1_1C.png '); }

	/** Images Slide 9 **/
	#s9-4 { background-image: url('../img/scene9/s9_layer4_4C.jpg'); }
	#s9-3 { background-image: url('../img/scene9/s9_layer3_3C.png'); }
	#s9-2 { background-image: url('../img/scene9/s9_layer2_2C.png'); }
	#s9-1 { background-image: url('../img/scene9/s9_layer1_1C.png'); }

	/** Images Slide 10 **/
	#s10-4 { background-image: url('../img/scene10/s10_layer4_BG.jpg'); }
	#s10-3 { background-image: url('../img/scene10/s10_layer3_2B.png'); }
	#s10-2 { background-image: url('../img/scene10/s10_layer2_1T.png'); }
	#s10-1 { background-image: url('../img/scene10/s10_layer1_1B.png'); }  

	/** Images Slide 11 **/
	#s11-5 { background-image: url('../img/scene11/scene11-bg.jpg'); }
	#s11-4 { background-image: url('../img/scene11/s11_layer4_3B.png'); }
	#s11-3 { background-image: url('../img/scene11/s11_layer3_2B.png'); }
	#s11-2 { background-image: url('../img/scene11/s11_layer2_1B.png'); }
	#s11-1 { background-image: url('../img/scene11/s11_layer1_1T.png'); }

	/** Images Slide 12 **/
	#s12-6 { background-image: url('../img/scene12/s12_layer13_C3.jpg') }
	#s12-5 { background-image: url('../img/scene12/s12_layer12_C2.png') }
	#s12-4 { background-image: url('../img/scene12/s12_layer11_B1.png') }

	#s12-3 { background-image: url('../img/scene12/s12_layer3_C3.jpg'); }
	#s12-2 { background-image: url('../img/scene12/s12_layer2_C2.png'); }
	#s12-1 { background-image: url('../img/scene12/s12_layer1_C1.png'); }

	#police { background-image: url('../img/general/police.png'); }

}

 @media (max-width: 799px) {

	/** Images Slide 1 **/
	#s1-9 { background-image: url('../img/scene1-xs/s1-layer9-3R.png'); }
	#s1-8 { background-image: url('../img/scene1-xs/s1-layer8-2B.png'); }
	#s1-7 { background-image: url('../img/scene1-xs/s1-layer7-3L.png'); }
	#s1-6 { background-image: url('../img/scene1-xs/s1-layer6-2L.png'); }
	#s1-5 { background-image: url('../img/scene1-xs/s1-layer5-2R.png'); }
	#s1-4 { background-image: url('../img/scene1-xs/s1-layer4-1R.png'); }
	#s1-3 { background-image: url('../img/scene1-xs/s1-layer3-1T.png'); }
	#s1-2 { background-image: url('../img/scene1-xs/s1-layer2-1B.png'); }
	#s1-1 { background-image: url('../img/scene1-xs/s1-layer1-1L.png'); } 

	/** Images Slide 2 **/
	#s2-6  { background-image: url('../img/scene2-xs/s2-layer6-1T.jpg'); }
	#s2-5  { background-image: url('../img/scene2-xs/s2-layer5-2T.png'); }
	#s2-4A { background-image: url('../img/scene2-xs/s2-layer4A-1T.png'); } 
	#s2-4B { background-image: url('../img/scene2-xs/s2-layer4B-1T.png'); } 
	#s2-3  { background-image: url('../img/scene2-xs/s2-layer3-3B.png'); }
	#s2-2  { background-image: url('../img/scene2-xs/s2-layer2-2B.png'); }
	#s2-1C { background-image: url('../img/scene2-xs/s2-layer1C-1B.png'); } 
	#s2-1B { background-image: url('../img/scene2-xs/s2-layer1B-1B.png'); }
	#s2-1A { background-image: url('../img/scene2-xs/s2-layer1A-1B.png'); } 

	/** Images Slide 3 **/
	#s3-9 { background-image: url('../img/scene3-xs/s3-layer9-2T.jpg'); }
	#s3-8 { background-image: url('../img/scene3-xs/s3-layer8-5B.png'); }
	#s3-7 { background-image: url('../img/scene3-xs/s3-layer7-4B.png'); }
	#s3-6 { background-image: url('../img/scene3-xs/s3-layer6-3B.png'); }
	#s3-5 { background-image: url('../img/scene3-xs/s3-layer5-1R.png'); }
	#s3-4 { background-image: url('../img/scene3-xs/s3-layer4-1L2.png'); }  
	#s3-3 { background-image: url('../img/scene3-xs/s3-layer3-2B.png'); }
	#s3-2 { background-image: url('../img/scene3-xs/s3-layer2-1B.png'); }
	#s3-1 { background-image: url('../img/scene3-xs/s3-layer1-1T.png'); }  

	/** Images Slide 4 **/
	#s4-3 { background-image: url('../img/scene4-xs/s4_layer3_C1.png'); }
	#s4-2 { background-image: url('../img/scene4-xs/s4_layer2_B1.png'); }
	#s4-1 { background-image: url('../img/scene4-xs/s4_layer1_1T.png'); }

	/** Images Slide 5 **/
	#s5-5 { background-image: url('../img/scene5-xs/s5_layer5_3B.jpg'); } 
	#s5-4 { background-image: url('../img/scene5-xs/s5_layer4_2B.jpg'); }
	#s5-3 { background-image: url('../img/scene5-xs/s5_layer3_1B.png'); }                        
	#s5-2 { background-image: url('../img/scene5-xs/s5_layer2_1L.png'); }
	#s5-1 { background-image: url('../img/scene5-xs/s5_layer1_1R.png'); }

	/** Images Slide 6 **/
	#s6-2 { background-image: url('../img/scene6-xs/s6_layer1_1B.jpg'); }
	#s6-1 { background-image: url('../img/scene6-xs/s6_layer2_1T.png'); }

	/** Images Slide 7 **/
	#s7-2 { background-image: url('../img/scene7-xs/s7_layer2_B1.jpg'); }
	#s7-3 { background-image: url('../img/scene7-xs/s7_layer3_C2.png'); }
	#s7-4 { background-image: url('../img/scene7-xs/s7_layer4_C3.png'); }

	/** Images Slide 8 **/
	#s8-3 { background-image: url('../img/scene8-xs/s8_layer3_3C.png '); }
	#s8-2 { background-image: url('../img/scene8-xs/s8_layer2_2C.jpg '); }                         
	#s8-1 { background-image: url('../img/scene8-xs/s8_layer1_1C.png '); }

	/** Images Slide 9 **/
	#s9-4 { background-image: url('../img/scene9-xs/s9_layer4_4C.jpg'); }
	#s9-3 { background-image: url('../img/scene9-xs/s9_layer3_3C.png'); }
	#s9-2 { background-image: url('../img/scene9-xs/s9_layer2_2C.png'); }
	#s9-1 { background-image: url('../img/scene9-xs/s9_layer1_1C.png'); }

	/** Images Slide 10 **/
	#s10-4 { background-image: url('../img/scene10-xs/s10_layer4_BG.jpg'); }
	#s10-3 { background-image: url('../img/scene10-xs/s10_layer3_2B.png'); }
	#s10-2 { background-image: url('../img/scene10-xs/s10_layer2_1T.png'); }
	#s10-1 { background-image: url('../img/scene10-xs/s10_layer1_1B.png'); }  

	/** Images Slide 11 **/
	#s11-5 { background-image: url('../img/scene11-xs/scene11-bg.jpg'); }
	#s11-4 { background-image: url('../img/scene11-xs/s11_layer4_3B.png'); }
	#s11-3 { background-image: url('../img/scene11-xs/s11_layer3_2B.png'); }
	#s11-2 { background-image: url('../img/scene11-xs/s11_layer2_1B.png'); }
	#s11-1 { background-image: url('../img/scene11-xs/s11_layer1_1T.png'); }

	/** Images Slide 12 **/
	#s12-6 { background-image: url('../img/scene12-xs/s12_layer13_C3.jpg'); }
	#s12-5 { background-image: url('../img/scene12-xs/s12_layer12_C2.png'); }
	#s12-4 { background-image: url('../img/scene12-xs/s12_layer11_B1.png'); }

	#s12-3 { background-image: url('../img/scene12-xs/s12_layer3_C3.jpg'); }
	#s12-2 { background-image: url('../img/scene12-xs/s12_layer2_C2.png'); }
	#s12-1 { background-image: url('../img/scene12-xs/s12_layer1_C1.png'); }

	#police { background-image: url('../img/general/police-xs.png'); }

}