-webkit-user-select: none;                /* disable cut copy paste */
-webkit-touch-callout: none;              /* disable callout, image save panel */



 /* sets it up so that you can click on images in ios */

div,img {-webkit-user-select: none; -webkit-touch-callout: none; }



 /* installs font */

@font-face
	{
		font-family: digistrip;
		src: url(../fonts/digistrip_reg.otf);
	}
	
@font-face
	{
		font-family: digistrip;
		src: url(../fonts/digistrip_b.otf);
		font-weight:bold;
	}	
	
@font-face
	{
		font-family: digistrip;
		src: url(../fonts/digistrip_i.otf);
		font-style:italic;
	}	
	
a,a:visited,a:active {	text-decoration:none;font-style:none;color:rgb(150,150,150);
 }

a:hover {	color:rgb(255,255,255);}

.credits {
	color:rgb(150,150,150);
	text-align: center;
	font-family: digistrip, sans-serif;
	font-size: 8pt;
	line-height:150%;


}


 /* sets the size of largest container to allow for overscroll */
.bigpage {
	height:14400px;
	}

 /* general setting for comic panels */
.panel {
	
	background-repeat:no-repeat;
	background-position:center center;
	margin-top: 5px;
	margin-bottom: 5px;

	}
	
 /* text settings for comic text */	
.text  {
	
	font-family: digistrip, sans-serif;
	font-size: 8pt;
	border:solid 2px black;
	position:relative;
	background-color: rgba(255, 255, 255, 1);
	padding:10px;
	border-radius: 5px;
	text-align:center;
	line-height:135%;
	
		}



 /* for boxes that cover other boxes on the inside to help with interactivity */
.fader {height:100%;width:100%;}



 /* used to set the fade in features for the text boxes */	
.fade {	
	-webkit-transition: all 1s ease-in-out;
  	-moz-transition: all 1s ease-in-out;
  	-ms-transition: all 1s ease-in-out;
  	-o-transition: all 1s ease-in-out;
  	transition: all 1s ease-in-out;
  
	-webkit-opacity: 0;
  	-moz-opacity: 0;
  	opacity: 0;	
	
	}
	
.fade:hover {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}

.fade:active {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
	
	
	
 /* used to set the fade in features for the rain */		
.fade2 {	
	-webkit-transition: all 1s ease-in-out;
  	-moz-transition: all 1s ease-in-out;
  	-ms-transition: all 1s ease-in-out;
  	-o-transition: all 1s ease-in-out;
  	transition: all 1s ease-in-out;
  
	-webkit-opacity: .25;
  	-moz-opacity: .25;
  	opacity: .25;	
	
	}
	
.fade2:hover {
  -webkit-opacity: .6;
  -moz-opacity: .6;
  opacity: .6;
}

.fade2:active {
  -webkit-opacity: .6;
  -moz-opacity: .6;
  opacity: .6;
}
		
	
	
	
	
	
 /* used to style the container box for the rain */		
.rain {width:960px;margin:auto;z-index:50;position:absolute;background-color: blue;}	

 /* used to act as fill for the overlays on the night animations that go to black */	
.tint {height:100%; width:100%;}

 /* used to style the rain drops */	
.drop {position:relative;z-index: 50;margin:0px; display:inline;padding:0px;  border-width: 0px;}
	
	
	
	
 /* BACKGROUND IMAGES FOR ALL OF THE COMIC PANELS */		
	
#p001 {
	
	background-image:url('../images/cloudEdit001.gif');
	height:1000px;
	-webkit-user-select: none; -webkit-touch-callout: none;
	
	}
	
	
#p002 {
	
	background-image:url('../images/cloudEdit002.gif');
	height:1000px;
	-webkit-user-select: none; -webkit-touch-callout: none;
	
	}	
	

#p003 {
	
	background-image:url('../images/cloudEdit003.gif');	
	height:1000px;
	-webkit-user-select: none; -webkit-touch-callout: none;
	
	
	}	
	
	
#p004 {
	
	background-image:url('../images/cloudEdit004.gif');	
	height:500px;	
	-webkit-user-select: none; -webkit-touch-callout: none;
	}	
	
	
#p005 {
	
	background-image:url('../images/cloudEdit005.gif');	
	height:600px;
	-webkit-user-select: none; -webkit-touch-callout: none;	
	}	
	
	
#p006 {
	
	background-image:url('../images/cloudEdit006.gif');	
	height:600px;
	background-position:0px 0px;
	-webkit-user-select: none; -webkit-touch-callout: none;
	}	
	
	
#p007 {
	
	background-image:url('../images/cloudEdit007.gif');	
	height:300px;
	background-position:center center;
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}	

#p008 {
	
	background-image:url('../images/cloudEdit008.gif');	
	height:500px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}
	
#p009 {
	
	background-image:url('../images/cloudEdit009.gif');	
	height:500px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}	

#p010 {
	
	background-image:url('../images/cloudEdit010.gif');	
	height:500px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}

#p011 {
	
	background-image:url('../images/cloudEdit011.gif');	
	height:500px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}

#p012 {
	
	background-image:url('../images/cloudEdit012.gif');	
	height:200px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}

#p013 {
	
	background-image:url('../images/cloudEdit013.gif');	
	height:300px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}

#p014 {
	
	background-image:url('../images/cloudEdit014.gif');	
	height:500px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}


#p015 {
	
	background-image:url('../images/cloudEdit015_2.gif');	
	height:620px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}

#p016 {
	
	background-image:url('../images/cloudEdit018.gif');	
	height:200px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}

#p017 {
	
	background-image:url('../images/cloudEdit016.gif');	
	height:200px;
	-webkit-user-select: none; -webkit-touch-callout: none; 	
	
	}

#p018 {	
	background-image:url('../images/cloudEdit017.gif');	
	height:200px;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}


#moon1 {
	background-image:url('../images/moon_left.gif');	background-position: ;
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#moon2 {
	background-image:url('../images/moon_right.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#b2o {
	background-image:url('../images/blue2orange2.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#atmosphere {
	background-image:url('../images/aurora4.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#stars {
	background-image:url('../images/stars.gif'); background-position: ;opacity:.5;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#kong {
	background-image:url('../images/hongkong.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#grid1 {
	background-image:url('../images/grid1.gif'); background-position: center;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#grid2 {
	background-image:url('../images/grid2.gif'); background-position: center;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#dawn1  {
	background-image:url('../images/dawn1a.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}


#dawn2  {
	background-image:url('../images/dawn2.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#dawn3  {
	background-image:url('../images/dawn3.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph01  {
	background-image:url('../images/graph01.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph02  {
	background-image:url('../images/graph31.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph03  {
	background-image:url('../images/graph02.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph04  {
	background-image:url('../images/graph08.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph05  {
	background-image:url('../images/graph04.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}
	

#graph06  {
	background-image:url('../images/graph15.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph07  {
	background-image:url('../images/graph21.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph08  {
	background-image:url('../images/graph27.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph09  {
	background-image:url('../images/graph33.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph10  {
	background-image:url('../images/graph34.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph11  {
	background-image:url('../images/graph36.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}
	

#graph12  {
	background-image:url('../images/graph37.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph13  {
	background-image:url('../images/graph13.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph14  {
	background-image:url('../images/graph10.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph15  {
	background-image:url('../images/graph11.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#graph16  {
	background-image:url('../images/graph12.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#storm1  {
	background-image:url('../images/storm1.gif'); background-position: bottom;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#storm2  {
	background-image:url('../images/storm2.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#storm3  {
	background-image:url('../images/storm3.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#storm4  {
	background-image:url('../images/storm4.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#storm5  {
	background-image:url('../images/storm5.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#storm6  {
	background-image:url('../images/storm6.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#storm7  {
	background-image:url('../images/storm7.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#powerline1  {
	background-image:url('../images/powerline1.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#powerline2  {
	background-image:url('../images/powerline2.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#birdwing  {
	background-image:url('../images/birdwing2.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#planewing  {
	background-image:url('../images/planewing3.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#bird  {
	background-image:url('../images/bird2.gif'); background-position: ;
	background-attachment: local; background-repeat: repeat;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#plane  {
	background-image:url('../images/plane2.gif'); background-position: ;
	background-attachment: local; background-repeat: repeat;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#highway1  {
	background-image:url('../images/highway1.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#highway2  {
	background-image:url('../images/highway2.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#highway3  {
	background-image:url('../images/highway3.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#trees  {
	background-image:url('../images/trees5.gif'); background-position: ;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}

#final  {
	background-image:url('../images/sky2.gif'); background-position: ;height:850px;	
	-webkit-user-select: none; -webkit-touch-callout: none; 
	}


#wrapper {
   overflow: auto;
}

/* Target the'touch' class
   generated by Modernizr */

.touch #wrapper {
   overflow: hidden;
}











