html {
	background: url('../images/halloween/ghost_tile.png') left top repeat;
}

header {
	background: url('../images/halloween/header_halloween.png') center top no-repeat;
}

section#intro {
	background: #300 url('../images/halloween/topimage_halloween.jpg') center bottom no-repeat;
	background-size: cover;
}

section#intro h1, section#intro p {
	color: #fec;
}


::-webkit-scrollbar {
	background: black;
	width: 9px;
}

::-webkit-scrollbar-track {
	border-radius: 4px;
	background: transparent;
}

::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background: rgba(255,0,0,0.4);
}

::-webkit-scrollbar-thumb:hover {
	background: url('../images/halloween/button_halloween.png') center center repeat;
}

::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(0,0,0,0.1);
}


/*---------------------------------------------*/
/*                  news                       */
/*---------------------------------------------*/

section#news {
	background: none;
	background-color: #510;
	display: none;
}

section#news h2 {
	background-color: rgba(250,80,0,0.6);
	color: #fe6;
}


section#news ul li {
	color: #fa0;
	border-left: 1px solid #630;
}


section#news ul li a h3, section#news ul li a p {
	color: #fa0;
}







section#aboutus {
	background: url('../images/halloween/spooky_wallpaper.jpg') center top repeat;
}

section#aboutus ul:before {
	/*content: url('../images/halloween/pixel_red_fadeleft.png');*/
	content: none;
}

section#aboutus ul:after {
	/*content: url('../images/halloween/pixel_red_faderight.png');*/
	content: none;
}

section#apps {
	background: url('../images/halloween/apps_tile.jpg') center top repeat;
}

section#clients {
	background: url('../images/halloween/spookyclient_tile.png') left top repeat;
}

footer {
	background: none;
}


button.quote {
	background: url('../images/halloween/button_halloween.png') center center no-repeat;
	background-size: 160px 36px;
}

a.quote, a.quote:visited, a.quote:active {
	background: url('../images/halloween/button_halloween.png') center center no-repeat;
	background-size: 160px 36px;
}


p.getintouch {
	padding-left: 34px;
}

p.getintouch a {
	margin-left: -34px;
}




section#aboutus ul li p.description a {
	color: #d9f;
}

section#aboutus ul li p.links {
	color: #fff;
	font-size: 0.8em;
	margin-top: 10px;
}

section#aboutus ul li p.links a {
	color: #d9f;
	text-decoration: none;
}

section#apps p.support a {
	color: #d9f;
}


div#stickersbanner {
	background-color: #f36100;
}

div#stickersbanner p {
	color: #ffc;
	/* because Firefox doesn't support clip-path fully */
	background-color: #f36100;
}


/*---------------------------------------------*/
/*              contactinfo                    */
/*---------------------------------------------*/

section#contactinfo a, section#contactinfo a:visited, section#contactinfo a:hover, section#contactinfo a:active {
	color: #ff342f;
}

section#contactinfo a.quote, section#contactinfo a.quote:visited, section#contactinfo a.quote:hover, section#contactinfo a.quote:active {
	color: #fff;
}

section#contactinfo h2 {
	max-width: 600px;
}


/*-------------------- Spooky Wallpapers --------------------*/

section#examples ul li#project_spookywallpapers {
	background: #080f39 none center -80px no-repeat;
}

section#examples ul li#project_spookywallpapers img {
	display: none !important;
}

section#examples ul li#project_spookywallpapers p.project_name {
	color: #151869;
}


section#examples ul li#project_spookywallpapers a {
	color: #808207;
}

section#examples ul li#project_spookywallpapers p.description {
	width: 260px;
	margin-bottom: 10px;
	color: #c65a00;
}


/*-------------------- Skelanimals --------------------*/

section#examples ul li#project_skelanimals {
	background: #000 none center top no-repeat;
	background-size: cover;
}

section#examples ul li#project_skelanimals img {
	width: 429px;
	height: 268px;
	position:absolute;
	margin-left: -50px;
	margin-top: 20px;
}

section#examples ul li#project_skelanimals p.project_name, section#examples ul li#project_skelanimals a {
	color: #fff;
}

section#examples ul li#project_skelanimals p.description {
	color: #fff;
}



/*-------------------- Lore --------------------*/

section#examples ul li#project_lore {
	background: #000 none center top no-repeat;
	background-size: cover;
}

section#examples ul li#project_lore img {
	width: 429px;
	height: 268px;
	position:absolute;
	margin-left: -50px;
	margin-top: 20px;
}

section#examples ul li#project_lore p.project_name, section#examples ul li#project_lore a {
	color: #fff;
}

section#examples ul li#project_lore p.description {
	color: #fff;
}


/*-------------------- Skullmoji --------------------*/

section#examples ul li#project_skullmoji {
	background: #000 none center top no-repeat;
	background-size: cover;
}

section#examples ul li#project_skullmoji img {
	width: 354px;
	height: 260px;
	position:absolute;
	margin-left: -50px;
	margin-top: 20px;
}

section#examples ul li#project_skullmoji p.project_name, section#examples ul li#project_skullmoji a {
	color: #fff;
}

section#examples ul li#project_skullmoji p.description {
	color: #fff;
}





/*-------------------- Macabre --------------------*/

section#examples ul li#project_macabre {
	background: #000 none center top no-repeat;
	background-size: cover;
}

section#examples ul li#project_macabre img {
	width: 500px;
	height: 252px;
	position:absolute;
	margin-left: -90px;
	margin-top: 20px;
}

section#examples ul li#project_macabre p.project_name, section#examples ul li#project_macabre a {
	color: #fff;
}

section#examples ul li#project_macabre p.description {
	color: #b6ff75;
}


/*-------------------- Son of Somatic --------------------*/

section#examples ul li#project_somatic {
	background: #000 none center top no-repeat;
	background-size: cover;
}

section#examples ul li#project_somatic img {
	width: 500px;
	height: 250px;
	position:absolute;
	margin-left: -120px;
	margin-top: 20px;
}

section#examples ul li#project_somatic p.project_name, section#examples ul li#project_somatic a {
	color: #fff;
}

section#examples ul li#project_somatic p.description {
	color: #f1952a;
}


/*-------------------- Hack-o-lantern --------------------*/

section#examples ul li#project_hackolantern {
	background: #000 none center top no-repeat;
	background-size: cover;
}

section#examples ul li#project_hackolantern img {
	width: 500px;
	height: 168px;
	position:absolute;
	margin-left: -120px;
	margin-top: 70px;
}

section#examples ul li#project_hackolantern p.project_name, section#examples ul li#project_hackolantern a {
	color: #fff;
}

section#examples ul li#project_hackolantern p.description {
	color: #f1c52a;
}


/*---------------------------------------------*/
/*               contactinfo                   */
/*---------------------------------------------*/

section#contactinfo h2 {
	color: #fff;
}

section#contactinfo > * {
	color: #fff;
}

section#contactinfo div.address h3, section#contactinfo div.address p
{
	color: #fff;
}

footer ul li {
	filter: invert(0.5);
}

footer p#copyright {
	color: #888;
}

/*---------------------------------------------*/
/*              retina images                  */
/*---------------------------------------------*/

/*
@media screen and (-webkit-min-device-pixel-ratio: 2) {

	header {
		background: url('../images/halloween/header_halloween@2x.png') center top no-repeat;
		background-size: 800px 144px;
	}

}
*/









/*---------------------------------------------*/
/*          media max-width: 900               */
/*---------------------------------------------*/


@media screen and (max-width: 900px) {


	/*-------------------- Spooky Wallpapers --------------------*/

	section#examples ul li#project_spookywallpapers {
		background: #080f39 none left 0px no-repeat;
		background-size: cover;
	}

	section#examples ul li#project_spookywallpapers img {
		display: none;
	}

	section#examples ul li#project_spookywallpapers p.project_name {
		padding-top: 50px;
	}


	section#examples ul li#project_spookywallpapers a {
	}

	section#examples ul li#project_spookywallpapers p.description {
		width: 260px;
	}



	/*-------------------- Skelanimals --------------------*/

	section#examples ul li#project_skelanimals {
		background-position: center center;
		background-size: 100% 100%;
	}
	
	section#examples ul li#project_skelanimals img {
		clip:rect(0px,290px,268px,0px);
		left: 50%;
		top: 10px;
		margin-left: -145px;		
	}
	
	section#examples ul li#project_skelanimals p.project_name {
		margin-top: 60px;
	}
	
	
	/*-------------------- Lore --------------------*/

	section#examples ul li#project_lore {
		background-position: center center;
		background-size: 100% 100%;
	}
	
	section#examples ul li#project_lore img {
		clip:rect(0px,290px,268px,0px);
		left: 50%;
		top: 10px;
		margin-left: -145px;		
	}
	
	section#examples ul li#project_lore p.project_name {
		margin-top: 60px;
	}
	
	
	
	/*-------------------- Skullmoji --------------------*/

	section#examples ul li#project_skullmoji {
		background-position: center center;
		background-size: 100% 100%;
	}
	
	section#examples ul li#project_skullmoji img {
		width: 300px;
		height: 221px;
		left: 50%;
		top: 30px;
		margin-left: -150px;		
	}
	
	section#examples ul li#project_skullmoji p.project_name {
		margin-top: 60px;
	}
	
	
	
	/*-------------------- Macabre --------------------*/

	section#examples ul li#project_macabre {
		background-position: center center;
		background-size: 100% 100%;
	}
	
	section#examples ul li#project_macabre img {
		clip:rect(0px,234px,252px,0px);
		left: 50%;
		top: -20px;
		margin-left: -120px;		
	}
	
	section#examples ul li#project_macabre p.project_name {
		margin-top: 20px;
	}
	
	
	/*-------------------- Son of Somatic --------------------*/

	section#examples ul li#project_somatic {
		background-position: center center;
		background-size: 100% 100%;
	}
	
	section#examples ul li#project_somatic img {
		clip:rect(0px,320px,250px,80px);
		left: 50%;
		top: 0px;
		margin-left: -200px;		
	}
	
	section#examples ul li#project_somatic p.project_name {
		margin-top: 20px;
	}


	/*-------------------- Hack-o-lantern --------------------*/

	section#examples ul li#project_hackolantern {
		background-position: center center;
		background-size: auto 100%;
	}
	
	section#examples ul li#project_hackolantern img {
		clip:rect(0px,176px,168px,0px);
		left: 50%;
		top: 0px;
		margin-left: -80px;		
	}
	
	section#examples ul li#project_hackolantern p.project_name {
		margin-top: 20px;
	}


}



/*---------------------------------------------*/
/*          media max-width: 800               */
/*---------------------------------------------*/


@media screen and (max-width: 800px) {


	section#news ul li {
		border-top: 1px solid #630;
		border-left: none;
	}

	section#apps ul {
		background: url('../images/halloween/spooky_wallpaper.png') center top repeat;
	}
	
	
	
	
	/*-------------------- Spooky Wallpapers --------------------*/

	section#examples ul li#project_spookywallpapers {
		background: #080f39 none -100px 0px no-repeat;
	}

	
	

}



/*---------------------------------------------*/
/*          media max-width: 320               */
/*---------------------------------------------*/


@media screen and (max-width: 320px) {


	/*-------------------- Spooky Wallpapers --------------------*/

	section#examples ul li#project_spookywallpapers {
		background-size: cover;
	}
	
	
}