/*Default for iphone*/

video1 {

   background:transparent url('videos/president8stillphone.jpg') no-repeat 0 0;
   -webkit-background-size:cover;
   -moz-background-size:cover;
   -o-background-size:cover;
   background-size:cover;
}


.reveal div.slide-background {
    background-size: 95% 100%
}

.reveal .lg-only, .reveal .sm-only {
    display: none;
}

.reveal .xsm-only {
    display: block;
}

.rtop4x3 {
	   position:relative;
        z-index: 555;
        top: 39%;
    }

.rtop4xx {
        position: relative;
        z-index: 55;
        top: 38%;
    }
	
	.reveal h12      {
	color: #ffffff;
	font-family:"ArimoRegular";
	font-size: 38px;
	font-style: bold;
	text-align: center;
	text-shadow: 0 0 10px #4c3a01;
  
}

/*WHERE DO YOU WANT TO GO*/
		

.reveal h12where      {
	color: #57d4eb;
	font-family:"ArimoRegular";
	font-size: 35px;
	font-style: bold;
	text-align: center;
    	text-shadow: .5px .5px .5px #ffffff;

}

.rtop4x4 {
	   position:relative;
        z-index: 555;
        top: 34%;	

    }

.rtop4xxx {
        position: relative;
        z-index: 55;
        top: 40%;
    }
	

/*WHERE DO YOU WANT TO GO END*/	


.reveal h9 {
   
    color: #ffffff;
    font-family: "Conv_CALIBRI";
    font-size: 8px;
   	  text-decoration: none; 
    text-shadow: none;

}
.reveal h9xx {
   
    color: #ffffff;
    font-family: "Conv_CALIBRI";
    font-size: 11px;
    line-height: 0.5em;
    text-shadow: none;

}

.outbit {
	   position: relative;
        z-index: 55;
  margin: auto;
  width: 50%;
  
   top: 35%;
		text-align: left;
       
    }
	
/*iPHONE DEVICES FOR CREDITS PAGE LINKS!!!!!!!*/  
	  
.reveal a {
  color: #7a7977;
    font-family: "Conv_CALIBRI";
    font-size: 15px;
    text-shadow: none;
	  text-decoration: none; }

.reveal a:hover {
   color: #74a7cb;
    font-family: "Conv_CALIBRI";
    font-size: 15px;
    text-shadow: none;
	  text-decoration: none; }

.reveal .roll span:after {
   color: #dfghy2;
    font-family: "Conv_CALIBRI";
    font-size: 15px;
    text-shadow: none;
	  text-decoration: none; }
  
/*iPHONE DEVICES FOR LINKS TO OTHER EPISODES!!!!!!!*/

a.ex2:link {
color: #e3151f;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
   
	}
	
	a.ex2:visited {
color: #e3151f;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex2:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex2:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	
	
	
	a.ex3:link {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 20px;
    text-decoration: none;
	line-height: 1.0em;
	}	
	
	a.ex3:visited {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 20px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 20px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 20px;
    text-decoration: none;
	line-height: 1.0em;
	}






a.ex3b:link {
color: #469ef1;
	font-family:"Conv_CALIBRI";
	font-size: 28px;
    text-decoration: none;
	line-height: 1.0em;
	}	
	
	a.ex3b:visited {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 28px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3b:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 28px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3b:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 28px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
.logob {
    position: absolute;
    top: 85.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby {
    width: 50%;
	
 
}


	.logob2 {
    position: absolute;
    top: 50.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby2 {
        width: 90%;
        height: 65%;
    }





/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .reveal div.slide-background {
        background-size: 40% 95%
    }

    .reveal h9 {
   
    color: #ffffff;
    font-family: "Conv_CALIBRI";
    font-size: 13px;
    line-height: 0.5em;
    text-shadow: none;

}
	.reveal h9xx {
   
    color: #ffffff;
    font-family: "Conv_CALIBRI";
    font-size: 14px;
    line-height: 0.5em;
    text-shadow: none;

}
    .reveal .lg-only, .reveal .xsm-only {
        display: none;
    }

    .reveal .sm-only {
        display: block;
    }

  .rtop4x3 {
	   position:relative;
        z-index: 555;
        top: 39%;
    }

.rtop4xx {
        position: relative;
        z-index: 55;
        top: 38%;
    }
	
	/*WHERE DO YOU WANT TO GO*/
		

.reveal h12where      {
	color: #57d4eb;
	font-family:"ArimoRegular";
	font-size: 50px;
	font-style: bold;
	text-align: center;
   	text-shadow: .5px .5px .5px #ffffff;
 
}

.rtop4xxx {
        position: relative;
        z-index: 55;
        top: 40%;
    }
	
	 .rtop4x4 {
	   position:relative;
        z-index: 555;
        top: 36%;	

    }

/*WHERE DO YOU WANT TO GO END*/	
	
	
	.outbit {
	   position: relative;
        z-index: 55;
  margin: auto;
  width: 50%;
  
   top: 35%;
		text-align: left;
       
    }
	
	.rtop4x {
	   position:relative;
        z-index: 555;
        top: 45%;
    }
	
	.rtop4xx {
        position: relative;
        z-index: 55;
        top: 42%;
    }
	
	.rtop4x3 {
	   position:relative;
        z-index: 555;
        top: 40%;
    }
	
	
	.reveal h12      {
	color: #ffffff;
	font-family:"ArimoRegular";
	font-size: 56px;
	font-style: bold;
	text-align: center;
	text-shadow: 0 0 10px #4c3a01;
  
}
	
	.reveal h12medium1     {
	color: #da8a17;
	font-family:"ArimoRegular";
	font-size: 40px;
	font-style: bold;
	line-height: 1.5em; 
}
	
	.reveal h12medium2     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 40px;
	font-style: bold;
	
  line-height: 1.5em;
margin-left: 2%;
}

.reveal h12medium3     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 40px;
	font-style: bold;
	
  line-height: 1.5em;
margin-left: 4%;
}

.reveal h12medium4     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 40px;
	font-style: bold;
	
  line-height: 1.5em;
margin-left: 6%;
}

.reveal h12medium5     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 40px;
	font-style: bold;
	line-height: 1.5em;
margin-left: 8%;
}

/*SMALLER DEVICES FOR CREDITS PAGE LINKS!!!!!!!*/

.reveal a {
  color: #ffffff;
    font-family: "Conv_CALIBRI";
    font-size: 18px;
    text-shadow: none;
	  text-decoration: none; }

.reveal a:hover {
   color: #74a7cb;
    font-family: "Conv_CALIBRI";
    font-size: 18px;
    text-shadow: none;
	  text-decoration: none; }

.reveal .roll span:after {
   color: #dfghy2;
    font-family: "Conv_CALIBRI";
    font-size: 18px;
    text-shadow: none;
	  text-decoration: none; }
  
/*SMALLER DEVICES FOR LINKS TO OTHER EPISODES!!!!!!!*/

a.ex2:link {
color: #e3151f;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
   
	}
	
	a.ex2:visited {
color: #e3151f;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex2:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex2:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	
	
	
	a.ex3:link {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}	
	
	a.ex3:visited {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	
	
	
	
	
	a.ex3b:link {
color: #469ef1;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}	
	
	a.ex3b:visited {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3b:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3b:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}


}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
 {

    .reveal div.slide-background {
        background-size: 34% 95%
    }

     .reveal h9 {
   
    color: #ffffff;
    font-family: "Conv_CALIBRI";
    font-size: 20px;
    line-height: 0.5em;
    text-shadow: none;

}

	.reveal h9xx {
   
    color: #ffffff;
    font-family: "Conv_CALIBRI";
    font-size: 24px;
    line-height: 0.5em;
    text-shadow: none;

}
	
    .reveal .lg-only {
        display: block;
    }

    .reveal .sm-only, .reveal .xsm-only {
        display: none;
    }

   .rtop4x {
        position: relative;
        z-index: 55;
        top: 45%;
    }
	
	.rtop4xx {
        position: relative;
        z-index: 55;
        top: 42%;
    }
	
	 
	
	.rtop4x3 {
	   position:relative;
        z-index: 555;
        top: 42%;
    }
	
	/*WHERE DO YOU WANT TO GO*/	

.reveal h12where      {
	color: #57d4eb;
	font-family:"ArimoRegular";
	font-size: 50px;
	font-style: bold;
	text-align: center;
  	text-shadow: .5px .5px .5px #ffffff;

}

.rtop4xxx {
        position: relative;
        z-index: 55;
        top: 43%;
    }
	
	 .rtop4x4 {
	   position:relative;
        z-index: 555;
        top: 40%;	

    }
	
	/*WHERE DO YOU WANT TO GO END*/	
	
	.outbit {
	   position: relative;
        z-index: 55;
  margin: auto;
  width: 50%;
  
   top: 40%;
		text-align: left;
       
    }
	

	
	.rtop4xx {
        position: relative;
        z-index: 55;
        top: 42%;
    }
	
	
	.reveal h12      {
	color: #ffffff;
	font-family:"ArimoRegular";
	font-size: 76px;
	font-style: bold;
	text-align: center;
	text-shadow: 0 0 10px #4c3a01;
  
}
	
	

.reveal h12medium1     {
	color: #da8a17;
	font-family:"ArimoRegular";
	font-size: 60px;
	font-style: bold;
	line-height: 1.5em; 
}

.reveal h12medium2     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 60px;
	font-style: bold;
	
  line-height: 1.5em;
margin-left: 2%;
}

.reveal h12medium3     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 60px;
	font-style: bold;
	
  line-height: 1.5em;
margin-left: 4%;
}

.reveal h12medium4     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 60px;
	font-style: bold;
	
  line-height: 1.5em;
margin-left: 6%;
}

.reveal h12medium5     {
	color: #575652;
	font-family:"ArimoRegular";
	font-size: 60px;
	font-style: bold;
	line-height: 1.5em;
margin-left: 8%;
}


/*LARGER DEVICES FOR CREDITS PAGE LINKS!!!!!!!*/

.reveal a {
  color: #7a7977;
    font-family: "Conv_CALIBRI";
    font-size: 28px;
    text-shadow: none;
	  text-decoration: none; 
	  }

.reveal a:hover {
   color: #74a7cb;
    font-family: "Conv_CALIBRI";
    font-size: 28px;
    text-shadow: none;
	  text-decoration: none; 
	  }

.reveal .roll span:after {
   color: #dfghy2;
    font-family: "Conv_CALIBRI";
    font-size: 28px;
    text-shadow: none;
	  text-decoration: none; }
  
/*LARGER DEVICES FOR LINKS TO OTHER EPISODES!!!!!!!*/

a.ex2:link {
color: #e3151f;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
   
	}
	
	a.ex2:visited {
color: #e3151f;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex2:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex2:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 60px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	
	
	
	a.ex3:link {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}	
	
	a.ex3:visited {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	
	
	
	
	
	
	a.ex3b:link {
color: #469ef1;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}	
	
	a.ex3b:visited {
color: #d87277;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3b:hover {
color: #1c7eb0;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
	
	a.ex3b:active {
color: #000000;
	font-family:"Conv_CALIBRI";
	font-size: 30px;
    text-decoration: none;
	line-height: 1.0em;
	}
}











/*THIS IS FOR BOTTOM-RIGHT2b */

/* Default is phones */

.bottom-right2 {
   position: absolute;  
    top: .0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1;
  
}


.bottom-right2b {
    width : 100%;
    height: 100%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2b {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 100%;
    height: 100%;
    }
	
	.bottom-right2 {
   position: absolute;  
    top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .bottom-right2b {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 100%;
    height: 100%;
	
	 
    }

}










/*THIS IS FOR BOTTOM-RIGHT2bx */

/* Default is phones */


.bottom-right2x {
   position: absolute;  
    top: 5.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-right2bx {
    width : 45%;
    height: 95%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2bx {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 98%;
    }
	
	.bottom-right2x {
   position: absolute;  
    top: 15.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-right2bx {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 30%;
    height: 80%;
	
	 
    }

}






/*THIS IS FOR textsb */

/* Default is phones */


.texts {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.textsb {
    width : 52%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .textsb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 70%;
    height: 98%;
    }
	
	.texts {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .textsb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 35%;
    height: 80%;
		 
    }
	.texts {
   position: absolute;  
    top: 16.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}












/*THIS IS FOR bigbird */

/* Default is phones */


.bigbird {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bigbirdb {
    width : 52%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bigbirdb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 62%;
    height: 98%;
    }
	
	.bigbird {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bigbirdb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 24%;
    height: 48%;
		 
    }
	.bigbird {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}







/*THIS IS FOR BOTTOM-RIGHTdancer */

/* Default is phones */


.bottom-rightdancer {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-rightdancer2 {
    width : 37%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-rightdancer2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 44%;
    height: 98%;
    }
	
	.bottom-rightdancer {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-rightdancer2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 31%;
    height: 87%;
		 
    }
	.bottom-rightdancer {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}






/*THIS IS FOR BOTTOM-RIGHT2by */

/* Default is phones */

.bottom-right2b {
   position: absolute;  
    top: 02%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-right2by {
    width : 35%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2by {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 98%;
    }
	
	.bottom-right2b {
   position: absolute;  
    top: 02.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-right2by {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 25%;
    height: 80%;
	
	 
    }
	
	.bottom-right2b {
   position: absolute;  
    top: 8.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}








/*THIS IS FOR BOTTOM-RIGHT2by2 */

/* Default is phones */

.bottom-right2y2 {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-right2by2 {
    width : 53%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2by2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 98%;
    }
	
	.bottom-right2y2 {
   position: absolute;  
    top: 02.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-right2by2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 43%;
    height: 89%;
	
	 
    }
	
	.bottom-right2y2 {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}








/*THIS IS FOR BOTTOM-RIGHT2by4 */

/* Default is phones */

.bottom-right2y4 {
   position: absolute;  
    top: 20%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 499;
  
}


.bottom-right2by4 {
    width : 70%;
    height: 78%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2by4 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 70%;
    height: 78%;
    }
	
	.bottom-right2y4 {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 499;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-right2by4 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 53%;
    height: 68%;
	
	 
    }
	
	.bottom-right2y4 {
   position: absolute;  
    top: 18.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 499;
  
}

}







/*THIS IS FOR twitter */

/* Default is phones */

.twitter {
   position: absolute;  
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.twitterb {
    width : 97%;
    height: 100%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .twitterb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 95%;
    height: 90%;
    }
	
	.twitter{
   position: absolute;  
    top: 8.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .twitterb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 65%;
    height: 80%;
	
	 
    }
	
	.twitter {
   position: absolute;  
    top: 17.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}












/*THIS IS FOR instagram */

/* Default is phones */

.instagram {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.instagramb {
    width : 35%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .instagramb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 98%;
    }
	
	.instagram {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .instagramb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 28%;
    height: 89%;
	
	 
    }
	
	.instagram {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}










/*THIS IS FOR instagram */

/* Default is phones */

.instagramc {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.instagramd {
    width : 35%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .instagramd {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 98%;
    }
	
	.instagramc {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .instagramd {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 26%;
    height: 89%;
	
	 
    }
	
	.instagramc {
   position: absolute;  
    top: 11.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}












/*THIS IS FOR affidavit */

/* Default is phones */

.affidavit {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.affidavitb {
    width : 43%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .affidavitb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 50%;
    height: 98%;
    }
	
	.affidavit {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .affidavitb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 35%;
    height: 89%;
	
	 
    }
	
	.affidavit {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}










/*THIS IS FOR phone */

/* Default is phones */

.phone {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.phoneb {
    width : 33%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phoneb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 30%;
    height: 90%;
    }
	
	.phone {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phoneb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 30%;
    height: 90%;
	
	 
    }
	
	.phone {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}











/*THIS IS FOR phone */

/* Default is phones */

.phonext {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 199;
  
}


.phonebxt {
    width : 33%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phonebxt {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 30%;
    height: 90%;
    }
	
	.phonext {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 199;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phonebxt {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 30%;
    height: 90%;
	
	 
    }
	
	.phonext {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 199;
  
}

}












/*THIS IS FOR phone ringing gif*/

/* Default is phones */

.phonephone2 {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 299;
   cursor: pointer;
}


.phonephone2b {
    width : 33%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phonephone2b {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 30%;
    height: 90%;
    }
	
	.phonephone2 {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 299;
   cursor: pointer;
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phonephone2b {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 30%;
    height: 90%;
	
	 
    }
	
	.phonephone2 {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 299;
   cursor: pointer;
}

}










/*THIS IS FOR phone horizontal */

/* Default is phones */

.phoneh {
   position: absolute;  
    top: 20%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.phonehb {
    width : 70%;
    height: 80%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phonehb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 45%;
    height: 65%;
    }
	
	.phoneh {
   position: absolute;  
    top: 22.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phonehb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 45%;
    height: 65%;
	
	 
    }
	
	.phoneh {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}











/*THIS IS FOR phone horizontal */

/* Default is phones */

.phonehxt {
   position: absolute;  
    top: 20%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 199;
  
}


.phonehbxt {
    width : 70%;
    height: 80%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phonehbxt {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 45%;
    height: 65%;
    }
	
	.phonehxt {
   position: absolute;  
    top: 22.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 199;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phonehbxt {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 45%;
    height: 65%;
	
	 
    }
	
	.phonehxt {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 199;

}

}










/*THIS IS FOR phone ringing gif */

/* Default is phones */

.phonephone {
   position: absolute;  
    top: 20%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 299;
    cursor: pointer;
}


.phonephoneb {
    width : 70%;
    height: 80%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phonephoneb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 45%;
    height: 65%;
    }
	
	.phonephone {
   position: absolute;  
    top: 22.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 299;
    cursor: pointer;
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phonephoneb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 45%;
    height: 65%;
	
	 
    }
	
	.phonephone {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 299;
  cursor: pointer;
  
}

}













/*THIS IS FOR phone horizontal with higher z index */

/* Default is phones */

.phonehz {
   position: absolute;  
    top: 20%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 599;
  
}


.phonehbz {
    width : 55%;
    height: 65%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phonehbz {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 70%;
    height: 65%;
    }
	
	.phonehz {
   position: absolute;  
    top: 22.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 599;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phonehbz {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 45%;
    height: 56%;
	
	 
    }
	
	.phonehz {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 599;
  
}

}





/*THIS IS FOR phone */

/* Default is phones */

.phonec {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 599;
  
}


.phoned {
    width : 45%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .phoned {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 50%;
    height: 98%;
    }
	
	.phonec {
   position: absolute;  
    top: 02.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 599;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .phoned {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 36%;
    height: 89%;
	
	 
    }
	
	.phonec {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 599;
  
}

}









/*THIS IS FOR BOTTOM-RIGHT2bw */

/* Default is phones */

.bottom-right2w {
   position: absolute;  
    top: 10%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-right2bw {
    width : 98%;
    height: 28%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2bw {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 75%;
    height: 62%;
    }
	
	.bottom-right2w {
   position: absolute;  
    top: 18.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-right2bw {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 20%;
    height: 70%;
	
	 
    }
	
	.bottom-right2w {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 599;
  
}

}






/*THIS IS FOR BOTTOM-RIGHT2bz */

/* Default is phones */

.bottom-right2z {
   position: absolute;  
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-right2bz {
    width : 100%;
    height: 100%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2bz {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 100%;
    height: 85%;
    }
	
	.bottom-right2z {
   position: absolute;  
    top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .bottom-right2bz {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 100%;
    height: 100%;
    }
	
	.bottom-right2z {
   position: absolute;  
    top: .0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}










/*THIS IS FOR BOTTOM-RIGHT2bx2reversed */

/* Default is phones */


.bottom-right2x2reversed {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-right2bx2reversed {
    width : 71%;
    height: 79%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2bx2reversed {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 59%;
    height: 66%;
    }
	
	.bottom-right2x2reversed {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-right2bx2reversed {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 59%;
    height: 66%;
	
	 
    }
	
	.bottom-right2x2reversed {
   position: absolute;  
    top: 13.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}






/*THIS IS FOR BOTTOM-RIGHT2bx2reversed2 */

/* Default is phones */


.bottom-right2x2reversed2 {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.bottom-right2bx2reversed2 {
    width : 61%;
    height: 79%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .bottom-right2bx2reversed2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 59%;
    height: 66%;
    }
	
	.bottom-right2x2reversed2 {
   position: absolute;  
    top: 21.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .bottom-right2bx2reversed2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 49%;
    height: 66%;
	
	 
    }
	
	.bottom-right2x2reversed2 {
   position: absolute;  
    top: 21.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	

}








/*THIS IS FOR girls */

/* Default is phones */


.girls {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.girls2 {
    width : 61%;
    height: 79%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .girls2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 45%;
    height: 58%;
    }
	
	.girls {
   position: absolute;  
    top: 21.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .girls2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 40%;
    height: 53%;
	
	 
    }
	
	.girls {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	

}







/*THIS IS FOR hopes */

/* Default is phones */


.hopes {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.hopes2 {
    width : 51%;
    height: 79%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .hopes2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 63%;
    }
	
	.hopes {
   position: absolute;  
    top: 22.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .hopes2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 30%;
    height: 53%;
	
	 
    }
	
	.hopes {
   position: absolute;  
    top: 27.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	

}







/*THIS IS FOR therecanbeonlyone */

/* Default is phones */


.therecanbeonlyone2 {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.therecanbeonlyone2b {
    width : 61%;
    height: 79%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .therecanbeonlyone2b {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 59%;
    height: 66%;
    }
	
	.therecanbeonlyone2 {
   position: absolute;  
    top: 21.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .therecanbeonlyone2b {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 30%;
    height: 44%;
	
	 
    }
	
	.therecanbeonlyone2 {
   position: absolute;  
    top: 35.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}









/*THIS IS FOR MAP */

/* Default is phones */

.map {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.mapb {
    width : 90%;
    height: 98%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .mapb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 92%;
    height: 90%;
    }
	
	.map {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px) {

    .mapb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 77%;
    height: 90%;
	
	 
    }
	
	.map {
   position: absolute;  
    top: 05.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}







/*THIS IS FOR MAP2 */

/* Default is phones */

.map2 {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.map2a {
    width : 53%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .map2a {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 70%;
    height: 70%;
    }
	
	.map2 {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px) {

    .map2a {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 40%;
    height: 85%;
	
	 
    }
	
	.map2 {
   position: absolute;  
    top: 08.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}






/*THIS IS FOR BOTTOM-RIGHT2by3 */

/* Default is phones */

.email {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.email2 {
    width : 35%;
    height: 99%;
}






/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .email2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 98%;
    }
	
	.email {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}






/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .email2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 26%;
    height: 89%;
	
	 
    }
	
	.email {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}






/*THIS IS FOR phone */

/* Default is phones */

.app {
   position: absolute;  
    top: 37%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.appb {
    width : 66%;
    height: 40%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .appb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 36%;
    height: 23%;
    }
	
	.app {
   position: absolute;  
    top: 40.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .appb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 36%;
    height: 23%;
	
	 
    }
	
	.app {
   position: absolute;  
    top: 40.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
  
}

}












/*THIS IS FOR escher */

/* Default is phones */


.escher {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.escherb {
    width : 52%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .escherb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 62%;
    height: 98%;
    }
	
	.escher {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .escherb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 35%;
    height: 30%;
		 
    }
	.escher {
   position: absolute;  
    top: 15.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}



















/*THIS IS FOR table */

/* Default is phones */


.table {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.tableb {
    width : 35%;
    height: 60%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .tableb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 35%;
    height: 60%;
    }
	
	.table {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .tableb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 35%;
    height: 60%;
		 
    }
	.table {
   position: absolute;  
    top: 25.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}






/*THIS IS FOR hermessage */

/* Default is phones */

.hermessage {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.hermessage2 {
    width : 47%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .hermessage2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 45%;
    height: 78%;
    }
	
	.hermessage {
   position: absolute;  
    top: 18.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .hermessage2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 28%;
    height: 71%;
	
	 
    }
	
	.hermessage {
   position: absolute;  
    top: 23.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}









/*THIS IS FOR hermessage3 */

/* Default is phones */

.hermessage3 {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2099;
  
}


.hermessage4 {
    width : 40%;
    height: 98%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .hermessage4 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 35%;
    height: 90%;
    }
	
	.hermessage3 {
   position: absolute;  
    top: 8.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2099;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .hermessage4 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 33%;
    height: 90%;
	
	 
    }
	
	.hermessage3 {
   position: absolute;  
    top: 8.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2099;
  
}

}




/*THIS IS FOR pleasewait */

/* Default is phones */


.pleasewait {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: -100;
    width : 100%;
    height: 100%;
  
}
	

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .pleasewait {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: -100;
    width : 100%;
    height: 100%;
  
}
	
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

   
	.pleasewait {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: -100;
    width : 1%;
    height: 1%;
  
}
	
	
}









/*THIS IS FOR laws */

/* Default is phones */


.laws {
   position: absolute;  
    top: 20.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.lawsb {
    width : 56%;
    height: 79%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .lawsb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 56%;
    height: 79%;
    }
	
	.laws {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .lawsb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 48%;
    height: 60%;
		 
    }
	.laws {
   position: absolute;  
    top: 27.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}



	
 








/*THIS IS FOR EARL NOTE NOTE !!!!!!!!!  earl text*/

/* Default is phones */

.earl{ 
position:absolute; 
top: 15%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;
	 
  }


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {
    
	
	.earl { 
position:absolute; 
top:17%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;}

  
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.earl { 
position:absolute; 
top:27%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;

    margin-right: auto;}

  
}


/* ----------- Non-Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) {
	  
	  .earl { 
position:absolute; 
top:12%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;}

  



  }

/* ----------- Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 
  
  .earl { 
position:absolute; 
top:12%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;}

  
}








/*THIS IS FOR earl2 NOTE NOTE !!!!!!!!!  earl text*/

/* Default is phones */

.earl2{ 
position:absolute; 
top: 15%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;
	 width: 70%;
  height: 70%;
  }


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {
    
	
	.earl2 { 
position:absolute; 
top:17%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;}

  
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.earl2 { 
position:absolute; 
top:27%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;}

  
}


/* ----------- Non-Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) {
	  
	  .earl2 { 
position:absolute; 
top:12%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;}

  

  }

/* ----------- Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 
  
  .earl2 { 
position:absolute; 
top:12%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;}
	

  
}










/*THIS IS FOR top30b for NO*/

/* Default is phones */

.top30b {
  position: absolute;  
    top: 50.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 599;
   margin-left: auto;
    margin-right: auto;

}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {
	
	.top30b {
   position: absolute;  
    top: 50.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 599;
   margin-left: auto;
    margin-right: auto;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{
   
	.top30b {
   position: absolute;  
    top: 45.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 599;
   margin-left: auto;
    margin-right: auto;

}


}











/*THIS IS FOR top30c for yes*/

/* Default is phones */

.top30c {
  position: absolute;  
    top: 71.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.top30c {
   position: absolute;  
    top: 67.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto;
	
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.top30c {
   position: absolute;  
    top: 56.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto;
	 
}


}








/*THIS IS FOR top30d for question mark*/

/* Default is phones */

.top30d{
  position: absolute;  
    top: 48.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.top30d {
   position: absolute;  
    top: 50.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto;
	
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.top30d {
   position: absolute;  
    top: 45.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto;
	  
}


}












/*THIS IS FOR top30e for yes*/

/* Default is phones */

.top30e {
  position: absolute;  
    top: 42.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 599;
   margin-left: auto;
    margin-right: auto;
	width: 50%;
  height: 50%;

}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {
	
	.top30e {
   position: absolute;  
    top: 42.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 599;
   margin-left: auto;
    margin-right: auto;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{
   
	.top30e {
   position: absolute;  
    top: 42.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 599;
   margin-left: auto;
    margin-right: auto;
pointer-events: auto;
}


}














/*THIS IS FOR top30f for yes*/

/* Default is phones */

.top30f {
  position: absolute;  
    top: 57.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto;
	width: 50%;
  height: 50%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.top30f {
   position: absolute;  
    top: 50.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto;
	
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.top30f {
   position: absolute;  
    top: 50.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 699;
   margin-left: auto;
    margin-right: auto;
	  
}


}










/*THIS IS FOR top24ad PLAY BUTTON FOR AD VIDEOS*/

/* Default is phones */

.top24ad { 
position:absolute; 
top:15%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 499;
   margin-left: auto;
    margin-right: auto;
	 width: 70%;
  height: 70%;
}
	
	
	
	.top24ad2 { 
position:absolute; 
top:20%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;
	 width: 70%;
  height: 70%;
  }
  

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {
    
	
	.top24ad { 
position:absolute; 
top:24%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 499;
   margin-left: auto;
    margin-right: auto;
	 width: 70%;
  height: 70%;
  }
	
	
	.top24ad2 { 
position:absolute; 
top:30%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;
	 width: 70%;
  height: 70%;
  }

  
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.top24ad { 
position:absolute; 
top:24%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 499;
   margin-left: auto;
    margin-right: auto;
	 width: 70%;
  height: 70%;
  }
	
	
	.top24ad2 { 
position:absolute; 
top:30%;
left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 399;
   margin-left: auto;
    margin-right: auto;
	 width: 70%;
  height: 70%;
  }
  
}








/*THIS IS FOR amazon */

/* Default is amazon */

.amazon {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.amazon2 {
    width : 38%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .amazon2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 40%;
    height: 98%;
    }
	
	.amazon {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .amazon2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 36%;
    height: 89%;
	
	 
    }
	
	.amazon {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}






/*THIS IS FOR news */

/* Default is phones */


.news {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.news2 {
    width : 38%;
    height: 99%;
}







/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .news2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 46%;
    height: 98%;
    }
	
	.news {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}







/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .news2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 32%;
    height: 87%;
		 
    }
	.news {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}












/*THIS IS FOR news */

/* Default is phones */


.news3 {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.news4 {
    width : 38%;
    height: 99%;
}







/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .news4 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 46%;
    height: 98%;
    }
	
	.news3 {
   position: absolute;  
    top: 1.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}







/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .news4 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 32%;
    height: 95%;
		 
    }
	.news3 {
   position: absolute;  
    top: 7.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
	
	
}









/*THIS IS FOR hangover */

/* Default is phones */

.hangover {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.hangoverb {
    width : 74%;
    height: 98%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .hangoverb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 52%;
    height: 90%;
    }
	
	.hangover {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px) {

    .hangoverb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 52%;
    height: 90%;
	
	 
    }
	
	.hangover {
   position: absolute;  
    top: 09.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}



/*THIS IS FOR signpost */

/* Default is phones */


.signpost {
   position: absolute;  
    top: 18.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.signpost2 {
    width : 51%;
    height: 84%;
}









/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .signpost2 {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 59%;
    height: 66%;
    }
	
	.signpost {
   position: absolute;  
    top: 22.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}









/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{
	
	.signpost {
   position: absolute;  
    top: 18.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

    .signpost2 {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 35%;
    height: 76%;
	
	 
    }

}


/*THIS IS FOR quiz */

/* Default is phones */

.quiz{
 position: absolute;  
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 499;
  margin-left: auto;
    margin-right: auto;
	 width : 100%;
    height: 100%;
}



/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   
	
	.quiz {
   position: absolute;  
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 499;
  margin-left: auto;
    margin-right: auto;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

	
	.quiz {
   position: absolute;  
    top: 10.0%;
    left: 0%;
    bottom: 0%;
    right: 0%;
	padding: 0px;
   z-index: 499;
   margin-left: auto;
    margin-right: auto;
  
}

}




/*THIS IS FOR letter */

/* Default is phones */

.letter {
   position: absolute;  
    top: 01%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.letterb {
    width : 45%;
    height: 99%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .letterb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 50%;
    height: 98%;
    }
	
	.letter {
   position: absolute;  
    top: 01.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .letterb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 32%;
    height: 89%;
	
	 
    }
	
	.letter {
   position: absolute;  
    top: 10.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}




/*THIS IS FOR home */

/* Default is phones */

.home {
  position: absolute;  
    top: 3.0%;
    left: 88%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 10%;
  height: 10%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.home {
   position: absolute;  
    top: 3.0%;
    left: 88%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  width: 10%;
  height: 10%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.home {
   position: absolute;  
    top: 3.0%;
    left: 88%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 10%;
  height: 10%;
  
}


}










/*THIS IS FOR mallory */

/* Default is phones */

.mallory {
  position: absolute;  
     top: 27.0%;
    left: 12%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 13%;
  height: 13%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.mallory {
   position: absolute;  
    top: 27.0%;
    left: 12%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;
  
}
}





/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.mallory {
   position: absolute;
   top: 27.0%;
    left: 12%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;
  
}


}














/*THIS IS FOR fort */

/* Default is phones */

.fort {
  position: absolute;  
    top: 68.0%;
    left: 5%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 13%;
  height: 13%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.fort {
   position: absolute;  
    top: 68.0%;
    left: 5%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;
  
}
}





/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.fort {
   position: absolute;  
    top: 68.0%;
    left: 5%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;
  
}


}













/*THIS IS FOR butterfly */

/* Default is phones */

.butterfly {
  position: absolute;  
    top: 54.0%;
    left: 22%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.butterfly {
   position: absolute;  
    top: 54.0%;
    left: 22%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.butterfly {
   position: absolute;  
    top: 54.0%;
    left: 22%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  
}


}












/*THIS IS FOR southernmost */

/* Default is phones */

.southernmost {
  position: absolute;  
    top: 72.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
   

}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.southernmost {
   position: absolute;  
    t  top: 72.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
   
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.southernmost {
   position: absolute;  
    top: 72.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;

  
}


}














/*THIS IS FOR flagler */

/* Default is phones */

.flagler {
  position: absolute;  
   top: 14.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.flagler {
   position: absolute;  
    top: 14.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.flagler {
   position: absolute;  
    top: 14.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;

  
}


}














/*THIS IS FOR duval */

/* Default is phones */

.duval {
  position: absolute;  
    top: 40.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.duval {
   position: absolute;  
    top: 40.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.duval {
   position: absolute;  
      top: 36.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
  
  cursor: pointer;
}


}













/*THIS IS FOR ocean */

/* Default is phones */

.ocean {
  position: absolute;  
    top: 83.0%;
    left: 1%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.ocean {
   position: absolute;  
   top: 83.0%;
    left: 1%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.ocean {
   position: absolute;  
      top: 83.0%;
    left: 1%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  cursor: pointer;
}


}









/*THIS IS FOR eaton */

/* Default is phones */

.eaton {
  position: absolute;  
    top: 35.0%;
    left: 40%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    

}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.eaton {
   position: absolute;  
    top: 35.0%;
    left: 40%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.eaton {
   position: absolute;  
      top: 35.0%;
    left: 40%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  cursor: pointer;
}


}










/*THIS IS FOR palm */

/* Default is phones */

.palm {
  position: absolute;  
    top: 25.0%;
    left: 50%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.palm {
   position: absolute;  
    top: 25.0%;
    left: 50%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.palm {
   position: absolute;  
      top: 25.0%;
    left: 50%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  cursor: pointer;
}


}









/*THIS IS FOR petronia */

/* Default is phones */

.petronia {
  position: absolute;  
    top: 53.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.petronia {
   position: absolute;  
   top: 53.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.petronia {
   position: absolute;  
      top: 53.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
 
  cursor: pointer;
}


}





















/*THIS IS FOR lighthouse */

/* Default is phones */

.lighthouse {
  position: absolute;  
    top: 55.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.lighthouse {
   position: absolute;  
    top: 55.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.lighthouse {
   position: absolute;  
      top: 55.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  cursor: pointer;
}


}














/*THIS IS FOR trumbo */

/* Default is phones */

.trumbo {
  position: absolute;  
     top: 10.0%;
    left: 45%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.trumbo {
   position: absolute;  
     top: 10.0%;
    left: 45%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.trumbo {
   position: absolute;  
      top: 10.0%;
    left: 45%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  cursor: pointer;
}


}














/*THIS IS FOR trumbo */

/* Default is phones */

.trumbo2 {
  position: absolute;  
     top: 10.0%;
    left: 45%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.trumbo2 {
   position: absolute;  
     top: 10.0%;
    left: 45%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
  
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.trumbo2 {
   position: absolute;  
      top: 10.0%;
    left: 35%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  cursor: pointer;
}


}


















/*THIS IS FOR bahama*/

/* Default is phones */

.bahama {
  position: absolute;  
    top: 66.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.bahama {
   position: absolute;  
    top: 66.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.bahama {
   position: absolute;  
      top: 66.0%;
    left: 20%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  cursor: pointer;
}


}











/*THIS IS FOR hemingway*/

/* Default is phones */

.hemingway {
  position: absolute;  
      top: 53.0%;
    left: 18%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.hemingway {
   position: absolute;  
     top: 53.0%;
    left: 18%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
 
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.hemingway {
   position: absolute;  
      top: 53.0%;
    left: 18%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
 
  cursor: pointer;
}


}








/*THIS IS FOR casa */

/* Default is phones */

.casa {
  position: absolute;  
    top: 70.0%;
    left: 38%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.casa {
   position: absolute;  
    top: 70.0%;
    left: 38%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
 
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.casa {
   position: absolute;  
      top: 70.0%;
    left: 38%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5099;
  
  cursor: pointer;
}


}












/*THIS IS FOR pool1 */

/* Default is phones */

.pool1 {
  position: absolute;  
    top: 70.0%;
    left: 41%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5001;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.pool1 {
   position: absolute;  
    top: 70.0%;
    left: 41%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5001;
   
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.pool1 {
   position: absolute;  
      top: 70.0%;
    left: 41%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 5001;
  
  cursor: pointer;
}


}


















/*THIS IS FOR airport */

/* Default is phones */

.airport {
  position: absolute;  
    top: 41.0%;
    left: 80%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.airport {
   position: absolute;  
    top: 41.0%;
    left: 80%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.airport {
   position: absolute;  
      top: 41.0%;
    left: 80%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   
  cursor: pointer;
}


}














/*THIS IS FOR weather1 rain*/

/* Default is phones */

.weather1 {
  position: absolute;  
      top: 86.0%;
    left: 46%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
     width: 10%;
  height: 10%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.weather1 {
   position: absolute;  
     top: 86.0%;
    left: 46%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 10%;
  height: 10%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.weather1 {
   position: absolute;  
      top: 86.0%;
    left: 46%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 10%;
  height: 10%;
 cursor: pointer; 
}


}













/*THIS IS FOR weather2  sun*/

/* Default is phones */

.weather2 {
  position: absolute;  
     top: 43.0%;
    left: 2%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 10%;
  height: 10%;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.weather2 {
   position: absolute;  
    top: 43.0%;
    left: 2%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 10%;
  height: 10%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.weather2 {
   position: absolute;  
      top: 43.0%;
    left: 2%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 10%;
  height: 10%;
 cursor: pointer; 
}

}










/*THIS IS FOR weather2b  sun*/

/* Default is phones */

.weather2b {
position: absolute;  
      top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 100%;
  height: 100%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.weather2b {
   position: absolute;  
      top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 100%;
  height: 100%;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.weather2b {
   position: absolute;  
      top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 100%;
  height: 100%;
}

}











/*THIS IS FOR weather3 bolt*/

/* Default is phones */

.weather3 {
  position: absolute;  
     top: 5.0%;
    left: 42%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
     width: 10%;
  height: 10%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.weather3 {
   position: absolute;  
    top: 5.0%;
    left: 42%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 10%;
  height: 10%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.weather3 {
   position: absolute;  
      top: 5.0%;
    left: 42%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 10%;
  height: 10%;
 cursor: pointer; 
}


}















/*THIS IS FOR weather4 wind*/

/* Default is phones */

.weather4 {
  position: absolute;  
        top: 43.0%;
    left: 86%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
     width: 10%;
  height: 10%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.weather4 {
   position: absolute;  
      top: 43.0%;
    left: 86%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 10%;
  height: 10%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.weather4 {
   position: absolute;  
      top: 43.0%;
    left: 86%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 10%;
  height: 10%;
 cursor: pointer; 
}


}















/*THIS IS FOR more */

/* Default is phones */

.more {
  position: absolute;  
    top: 45.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
    width: 13%;
  height: 13%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.more {
   position: absolute;  
     top: 45.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.more {
   position: absolute;  
      top: 45.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;

}


}








/*THIS IS FOR weather3b */

/* Default is phones */

.weather3b {
   position: absolute;  
    top: .0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 10;
    width : 100%;
    height: 100%;
  
}



/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {  
	
	.weather3b {
   position: absolute;  
    top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 10;
   width : 100%;
    height: 100%;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .weather3b {
       position: absolute;  
    top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 10;
   width : 100%;
    height: 100%;
	 
    }

}






/*THIS IS FOR weather3c */

/* Default is phones */

.weather3c {
   position: absolute;  
    top: .0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1;
    width : 100%;
    height: 100%;
  
}



/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {  
	
	.weather3c {
   position: absolute;  
    top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1;
   width : 100%;
    height: 100%;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .weather3c {
       position: absolute;  
    top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1;
   width : 100%;
    height: 100%;
	 
    }

}











/*THIS IS FOR shimmer  sun*/

/* Default is phones */

.shimmer {
	  position: absolute;  
   top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.shimmer {
   position: absolute;  
     top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.shimmer {
   position: absolute;  
      top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  
}

}













/*THIS IS FOR shimmerb  sun*/

/* Default is phones */

.shimmerb {
	  position: absolute;  
   top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;


}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.shimmerb {
   position: absolute;  
     top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.shimmerb {
   position: absolute;  
      top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 20;
   width: 100%;
  height: 100%;
  opacity: 0.2
}

}









/*THIS IS FOR shimmerc  sun*/

/* Default is phones */

.shimmerc {
	  position: absolute;  
      top: 40%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  opacity: 0.1;

}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.shimmerc {
   position: absolute;  
      top: 40%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  opacity: 0.1;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.shimmerc {
   position: absolute;  
      top: 40%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  opacity: 0.1;
}

}










/*THIS IS FOR shimmerd  sun*/

/* Default is phones */

.shimmerd {
	  position: absolute;  
      top: 40%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  opacity: 0.3;

}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.shimmerd {
   position: absolute;  
      top: 40%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  opacity: 0.3;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.shimmerd{
   position: absolute;  
      top: 40%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 2;
   width: 100%;
  height: 100%;
  opacity: 0.3;
}

}








/*THIS IS FOR fortsign */

/* Default is phones */

.fortsign {
   position: absolute;  
    top: 5%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}


.fortsignb {
    width : 55%;
    height: 80%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .fortsignb {
        /* override just the attributes you need
          for positioning on a  tablet */
		   width : 55%;
    height: 80%;
    }
	
	.fortsign {
   position: absolute;  
    top: 15.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .fortsignb {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 55%;
    height: 80%;
	
	 
    }
	
	.fortsign {
   position: absolute;  
    top: 15.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 99;
  
}

}
















/*THIS IS FOR cemetary*/

/* Default is phones */

.cemetary{
   position: absolute;  
      top: 40.0%;
    left: 38%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 10%;
  height: 10%;
  cursor: pointer;
  object-fit: fill;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.cemetary {
  position: absolute;  
      top: 40.0%;
    left: 38%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 15000;
   width: 10%;
  height: 10%;
   cursor: pointer;
object-fit: fill;
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.cemetary {
   position: absolute;  
      top: 40.0%;
    left: 38%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 10%;
  height: 10%;
  cursor: pointer;

}

}












/*THIS IS FOR fleming*/

/* Default is phones */

.fleming{
  position: absolute;  
      top: 20.0%;
    left: 8%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;
 cursor: pointer; 

}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.fleming {
  position: absolute;  
      top: 20.0%;
    left: 8%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 15000;
   width: 13%;
  height: 13%;
 cursor: pointer; 
  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.fleming {
   position: absolute;  
      top: 20.0%;
    left: 8%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 4099;
   width: 13%;
  height: 13%;
 cursor: pointer; 
}

}













/*THIS IS FOR doodle1*/

/* Default is phones */

.doodle1{
   position: absolute;  
     top: 33.0%;
    left: 40%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
  cursor: pointer;
  object-fit: fill;
  pointer-events:none;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.doodle1 {
  position: absolute;  
      top: 33.0%;
    left: 40%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
   cursor: pointer;
object-fit: fill;
pointer-events:none;  
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.doodle1 {
   position: absolute;  
       top: 33.0%;
    left: 40%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
  cursor: pointer;
pointer-events:none;
}

}










/*THIS IS FOR doodle2 */

/* Default is phones */

.doodle2 {
  position: absolute;  
        top: 40.0%;
    left: 36%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
    width: 8%;
  height: 8%;
pointer-events:none;

}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.doodle2 {
   position: absolute;  
       top: 40.0%;
    left: 36%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
  pointer-events:none;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.doodle2 {
   position: absolute;  
        top: 40.0%;
    left: 36%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
  cursor: pointer;
  pointer-events:none;
}


}











/*THIS IS FOR doodle3*/

/* Default is phones */

.doodle3{
  position: absolute;  
     top: 50.0%;
    left: 1%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
 cursor: pointer; 
 pointer-events:none;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.doodle3 {
  position: absolute;  
    top: 50.0%;
    left: 1%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
 cursor: pointer; 
   pointer-events:none;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.doodle3 {
   position: absolute;  
     top: 50.0%;
    left: 1%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
 cursor: pointer;
  pointer-events:none;
}

}













/*THIS IS FOR doodle4*/

/* Default is phones */

.doodle4{
  position: absolute;  
        top: 25.0%;
    left: 65%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer; 
 pointer-events:none;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.doodle4 {
  position: absolute;  
       top: 25.0%;
    left: 65%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer; 
   pointer-events:none;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.doodle4 {
   position: absolute;  
       top: 25.0%;
    left: 65%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer;
  pointer-events:none;
}

}













/*THIS IS FOR doodle5*/

/* Default is phones */

.doodle5{
  position: absolute;  
      top: 25.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
 cursor: pointer; 
 pointer-events:none;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.doodle5 {
  position: absolute;  
       top: 25.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
 cursor: pointer; 
   pointer-events:none;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.doodle5 {
   position: absolute;  
       top: 25.0%;
    left: 30%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 10%;
  height: 10%;
 cursor: pointer;
  pointer-events:none;
}

}










/*THIS IS FOR doodle6*/

/* Default is phones */

.doodle6{
  position: absolute;  
      top: 35.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer; 
 pointer-events:none;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.doodle6 {
  position: absolute;  
    top: 35.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer; 
   pointer-events:none;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.doodle6 {
   position: absolute;  
     top: 35.0%;
    left: 70%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer;
  pointer-events:none;
}

}





















/*THIS IS FOR doodle6*/

/* Default is phones */

.doodle7{
  position: absolute;  
     top: 20.0%;
    left: 60%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer; 
 pointer-events:none;
}


/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    
	
	.doodle7 {
  position: absolute;  
     top: 20.0%;
    left: 60%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer; 
   pointer-events:none;
}
}


/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    
	.doodle7 {
   position: absolute;  
     top: 20.0%;
    left: 60%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 26000;
   width: 8%;
  height: 8%;
 cursor: pointer;
  pointer-events:none;
}

}















/*THIS IS FOR barefoot horizontal */

/* Default is phones */



.barefoot {
    width : 55%;
    height: 42%;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .barefoot {
        /* override just the attributes you need
          for positioning on a  tablet */
		 width : 55%;
    height: 42%;
    }
	
	
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{

    .barefoot {
        /* override just the attributes you need
          for positioning on a desktop*/
		  width : 55%;
    height: 42%;
	
	 
    }
	
	

}



.ghost1 {
   position: absolute;  
   z-index: 5000;
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
background-color: rgba(237, 237, 238, 0.65);
   
}

.ghost2 {
   position: absolute;  
   z-index: 5000;
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
background-color: rgba(237, 237, 238, 0.65);
pointer-events: none;

}











.opacity {
  opacity: 0.8;
}

.opacity2 {
  opacity: 0.2;
  position: absolute;  
   z-index: 1;
}

.opacity3 {
  opacity: 0.3;
  
}

.opacityghost {
  opacity: 0.7;
   position: absolute;  
   z-index: 1;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;


   
}

.opacityghost2 {
  opacity: 0.3;
   position: absolute;  
   z-index: 5000;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
  pointer-events:none;

   
}
.zindex {
 position: absolute;  
   z-index: 4000;
}




.btn.hidden {
    display: none;
}

.dark {
  position: absolute;  
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 25499;
  margin-left: auto;
    margin-right: auto;
	 width : 100%;
    height: 100%;
	  pointer-events:none;
}

.dark2 {
  position: absolute;  
    top: 0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 25499;
  margin-left: auto;
    margin-right: auto;
	 width : 100%;
    height: 100%;
	  pointer-events:none;
}



.clouds {
opacity: 0.2
}

.clouds2 {
opacity: 0.4
}

.pacmanstorm {
opacity: 0.8
}




/*THIS IS H1234 */

/* Default is phones */

.reveal h1234      {
	font-family:"ArimoRegular";
	color: #ffffff;
	font-size: 15px;
	font-style: bold;
	text-align: center;
	 line-height: 1.5em;
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

    .reveal h1234      {
	font-family:"ArimoRegular";
	color: #ffffff;
	font-size: 28px;
	font-style: bold;
	text-align: center;
	 line-height: 1.5em;
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .reveal h1234      {
	font-family:"ArimoRegular";
	color: #ffffff;
	font-size: 28px;
	font-style: bold;
	text-align: center;
	 line-height: 1.5em;
}

}








/*THIS IS btn1 */

/* Default is phones */

   .btn1 {
	
   position: absolute;  
     top: 58.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 22200;
	width: 15.2%;
  height: 15.2%; 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn1 {

  position: absolute;  
     top: 58.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	width: 15.2%;
  height: 15.2%; 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn1 {

   position: absolute;  
     top: 58.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	width: 15.2%;
  height: 15.2%; 
}
}








/*THIS IS btn1b */

/* Default is phones */

     .btn1b {
	 
   position: absolute;  
     top: 58.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	width: 15.2%;
  height: 15.2%; 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn1b {
	   
  position: absolute;  
     top: 58.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	width: 15.2%;
  height: 15.2%; 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn1b {

   position: absolute;  
     top: 58.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	width: 15.2%;
  height: 15.2%; 
}
}












/*THIS IS btn2 */

/* Default is phones */

   .btn2 {
	    
   position: absolute;  
     top: 62.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 300;
	width: 15.2%;
  height: 15.2%; 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn2 {
	    
 position: absolute;  
     top: 62.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 300;
	width: 15.2%;
  height: 15.2%; 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn2 {
		 
    position: absolute;  
     top: 62.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 300;
	width: 15.2%;
  height: 15.2%; 
	 
}
}








/*THIS IS btn2b */

/* Default is phones */

    .btn2b {
	
   position: absolute;  
     top: 62.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 300;
	width: 15.2%;
  height: 15.2%; 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn2b {
	  
 position: absolute;  
     top: 62.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 300;
	width: 15.2%;
  height: 15.2%; 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn2b {

    position: absolute;  
     top: 62.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 300;
	width: 15.2%;
  height: 15.2%; 
	 
}
}













/*THIS IS btn3 */

/* Default is phones */

   .btn3 {
    position: absolute;  
     top: 69.8%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 400;
	width: 15.2%;
  height: 15.2%; 
  	  
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn3 {
    position: absolute;  
     top: 69.8%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 400;
	width: 15.2%;
  height: 15.2%; 
	  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn3 {
   position: absolute;  
     top: 69.8%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 400;
	width: 15.2%;
  height: 15.2%; 
	  
}
}








/*THIS IS btn3b */

/* Default is phones */

   .btn3b {
    position: absolute;  
     top: 69.8%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 400;
	width: 15.2%;
  height: 15.2%; 

}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn3b {
    position: absolute;  
     top: 69.8%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 400;
	width: 15.2%;
  height: 15.2%; 

}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn3b {
   position: absolute;  
     top: 69.8%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 400;
	width: 15.2%;
  height: 15.2%; 

}
}













/*THIS IS btn4 */

/* Default is phones */

   .btn4 {
    position: absolute;  
     top: 73.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 500;
	width: 15.2%;
  height: 15.2%; 
   	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn4 {
  position: absolute;  
     top: 73.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 500;
	width: 15.2%;
  height: 15.2%; 
	  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn4 {
     position: absolute;  
     top: 73.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 500;
	width: 15.2%;
  height: 15.2%; 
 	 
}
}








/*THIS IS btn4b */

/* Default is phones */

   .btn4b {
    position: absolute;  
     top: 73.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 500;
	width: 15.2%;
  height: 15.2%; 

}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn4b {
  position: absolute;  
     top: 73.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 500;
	width: 15.2%;
  height: 15.2%; 

}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn4b {
     position: absolute;  
     top: 73.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 500;
	width: 15.2%;
  height: 15.2%; 
	 
}
}













/*THIS IS btn5 */

/* Default is phones */

   .btn5 {
	    
    position: absolute;  
     top: 80.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 600;
	width: 15.2%;
  height: 15.2%; 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn5 {
	    
  position: absolute;  
     top: 80.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 600;
	width: 15.2%;
  height: 15.2%; 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn5 {
		 
    position: absolute;  
     top: 80.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 600;
	width: 15.2%;
  height: 15.2%; 
}
}








/*THIS IS btn5b */

/* Default is phones */

   .btn5b {
	  	
    position: absolute;  
     top: 80.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 600;
	width: 15.2%;
  height: 15.2%; 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn5b {
	 	
  position: absolute;  
     top: 80.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 600;
	width: 15.2%;
  height: 15.2%; 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn5b {
		
    position: absolute;  
     top: 80.67%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 600;
	width: 15.2%;
  height: 15.2%; 
}
}













/*THIS IS btn6 */

/* Default is phones */

   .btn6 {
     position: absolute;  
     top: 85%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 700;
	width: 15.2%;
  height: 15.2%; 
  	  
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn6 {
   position: absolute;  
     top: 85%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 700;
	width: 15.2%;
  height: 15.2%; 
	  
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn6 {
    position: absolute;  
     top: 85%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 700;
	width: 15.2%;
  height: 15.2%; 
	  
}
}








/*THIS IS btn6b */

/* Default is phones */

   .btn6b {
     position: absolute;  
     top: 85%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 700;
	width: 15.2%;
  height: 15.2%; 
  			
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn6b {
   position: absolute;  
     top: 85%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 700;
	width: 15.2%;
  height: 15.2%; 
			
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn6b {
    position: absolute;  
     top: 85%;
    left: 28.4%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 700;
	width: 15.2%;
  height: 15.2%; 
			
}
}
















/*THIS IS btn7 */

/* Default is phones */

   .btn7 {
    
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 13.0%;
 left: 59%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn7 {
   
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 59%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn7 {
    
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 59%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}








/*THIS IS btn7b */

/* Default is phones */

   .btn7b {
    pointer-events: none;
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 13.0%;
 left: 59%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn7b {
  pointer-events: none;
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 59%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn7b {
  pointer-events: none;
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 59%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
}
}












/*THIS IS btn8 */

/* Default is phones */

   .btn8 {
    
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 13.0%;
 left: 66%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn8 {
   
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 66%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn8 {
    
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 66%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}








/*THIS IS btn8b */

/* Default is phones */

   .btn8b {
    pointer-events: none;
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 13.0%;
 left: 66%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn8b {
  pointer-events: none;
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 66%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn8b {
  pointer-events: none;
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 66%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
}
}


















/*THIS IS btn9 */

/* Default is phones */

   .btn9 {
    
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 13.0%;
 left: 73%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn9 {
   
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 73%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn9 {
    
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 73%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}








/*THIS IS btn9b */

/* Default is phones */

   .btn9b {
    pointer-events: none;
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 13.0%;
 left: 73%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn9b {
  pointer-events: none;
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 73%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn9b {
  pointer-events: none;
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 73%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
}
}







/*THIS IS btn10 */

/* Default is phones */

   .btn10 {
    
	width: 12%;
  height: 12%;
   position: absolute;  
    top: 13.0%;
 left: 45%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .btn10 {
   
	width: 10%;
  height: 10%;
   position: absolute;  
    top: 13.0%;
 left: 46%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .btn10 {
    
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 46%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
	 
}
}




#button10 {
    visibility: hidden;
}







.hidden {
    display: none;
}



.btn-group {
  position: absolute;  
     top: 58.2%;
 left: 29%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 200;
}



.btn-group button {
  
 
  display: block; /* Make the buttons appear below each other */
 
}

.btn-group button:not(:last-child) {
  border-bottom: none; /* Prevent double borders */
}

/* Add a background color on hover */
.btn-group button:hover {
  background-color: #3e8e41;
}




.oneb {
pointer-events: none;

}

.twob {
pointer-events: none;

}

.threeb {
pointer-events: none;

}

.fourb {
pointer-events: none;

}

.fiveb {
pointer-events: none;

}

.sixb {
pointer-events: none;

}







/*THIS IS buttonreturn */

/* Default is phones */

   .buttonreturn {
	width: 18%;
  height: 18%;
   position: absolute;  
     top: 45.0%;
 left: 80%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 10000;	
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .buttonreturn {
	width: 15%;
  height: 15%;
   position: absolute;  
      top: 82.0%;
 left: 67%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1000;	 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .buttonreturn {
	width: 15%;
  height: 15%;
   position: absolute;  
     top: 84.0%;
 left: 67%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1000;	 
}
}
















/*THIS IS buttonend */

/* Default is phones */

   .buttonend {
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 82.0%;
 left: 67%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1000;	
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .buttonend {
	width: 10%;
  height: 10%;
   position: absolute;  
      top: 82.0%;
 left: 67%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1000;	 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .buttonend {
	width: 100%;
  height: 100%;
   position: absolute;  
     top: 40.0%;
 left: 40%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 1000;	 
}
}





/*THIS IS buttonover */

/* Default is phones */

   .buttonover{
	width: 12%;
  height: 12%;
   position: absolute;  
     top: 13.0%;
 left: 52%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
  	 
}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .buttonover {
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 13.0%;
 left: 52%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 100;	 
	 
}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .buttonover {
	width: 10%;
  height: 10%;
   position: absolute;  
     top: 85.0%;
 left: 68%;
    bottom: 0;
    right: 0;
	padding: 0px;
   z-index: 22500;	 
}
}




.center {
	   position: absolute; 
	     z-index: 10;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
}



.center1 {
	   position: absolute; 
	     z-index: 100;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
}


.center2 {
	   position: absolute; 
	     z-index: 200;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
}

.center3 {
	   position: absolute; 
	     z-index: 300;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
}

.center4 {
	   position: absolute; 
	     z-index: 400;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
}

.center5 {
	   position: absolute; 
	     z-index: 500;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
}

.center6 {
	   position: absolute; 
	     z-index: 600;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
   
}

.center7 {
	   position: absolute; 
	     z-index: 700;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
   
}


.center8 {
	   position: absolute; 
	     z-index: 800;
     top: 1.0%;
display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;	
   background:none !important;
   
}








/*THIS IS centerp */

/* Default is phones */

   .centerp{
	 position: absolute; 
	     z-index: 10;
     top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px; 	 
}

.centerpx {
	width :59%;

}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .centerp {
	 position: absolute; 
	     z-index: 10;
     top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
}

.centerpx {
	width :57%;

}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .centerp {
	 position: absolute; 
	     z-index: 10;
     top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px; 
}

.centerpx {
	width :57%;

}
}









/*THIS IS centerp */

/* Default is phones */

   .centerp1{
	 position: absolute; 
	     z-index: 100;
     top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px; 	 
}

.centerpx1 {
	width :59%;

}

/*Small devices such as tablets*/
@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {

   .centerp1 {
	 position: absolute; 
	     z-index: 100;
     top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px;
}

.centerpx1 {
	width :57%;

}
}

/*Larger devices (such as desktops)*/
@media only screen
and (min-device-width: 1024px)
{	

    .centerp1 {
	 position: absolute; 
	     z-index: 100;
     top: 0.0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px; 
}

.centerpx1 {
	width :57%;

}
}




@media only screen and (orientation: portrait) {
  .landscape {
	     position: absolute; 
	     z-index: 10000;
     top: .0%;
    left: 0;
    bottom: 0;
    right: 0;
	padding: 0px; 
	width: 100%;
		  
  }
}






@media only screen
and (min-device-width: 768px)
and (orientation: landscape) {
	
	.logob {
    position: absolute;
    top: 85.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby {
    width: 20%;
	
 
}


	.logob2 {
    position: absolute;
    top: 70.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby2 {
        width: 60%;
        height: 40%;
    }


}



@media only screen
and (min-device-width: 1024px) {
	
	.logob {
    position: absolute;
    top: 85.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby {
    width: 20%;
	
 
}


	.logob2 {
    position: absolute;
    top: 70.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby2 {
        width: 60%;
        height: 40%;
    }



}


.logob {
    position: absolute;
    top: 85.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby {
    width: 40%;
	
 
}


	.logob2 {
    position: absolute;
    top: 70.0%;
    left: 80%;
    bottom: 0;
    right: 0;
    padding: 0px;
    z-index: 200;

}

.logoby2 {
        width: 70%;
        height: 50%;
    }




.progress {
    pointer-events: none;
}