*
{
	padding:0px;
	margin:0px;	
}

body
{
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:transparent;
	
	background-image:url('../gfx/loading.gif');
	background-size:30px;
	background-repeat:no-repeat;
	background-position:center;
}

html
{
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:#0c0c0c;
	background-repeat:repeat;
}


@font-face
{
	font-family: 'Boycott';
	src: url('../fonts/BOYCOTT.ttf');
}



#menu
{
	display:none;
	position:absolute;
	bottom:0px;
	width:100%;
	//height:75px;
	background-color:black;
	text-align:center;
	font-size: 0;
	border-top:1px solid #222;
	overflow:auto;
	
	-moz-user-select: none; 
   	-khtml-user-select: none; 
    -webkit-user-select: none; 
    -o-user-select: none; 
}


#adspace
{
	width:100%; 
	height:100px; 
	margin:auto; 
	background-color:black;
	border-bottom:1px solid #333;
	display:none;
	overflow:hidden;
}

#saveAdspace
{
	display:block;
	width:728px;
	height:90px;
	background-color:#444;	
}


.adsbygoogle
{
	margin:auto;
	margin-top:4px;
	display:block !important;
}

#applicationContainer
{
	//top:0px;
	top:100px;
	bottom:25px;
	width:100%;	
	position:absolute;
	overflow:hidden;	
}

.menuItem
{
	width:75px;
	height:75px;

	//margin-left:5px;
	//margin-right:5px;
	
	display: inline-block;

	border-radius:1px;
	font-size:10px;
	color:white;
	
	//border-left:1px solid #111;
	
	background-repeat: no-repeat;
	background-position:center;
	
	//border:1px solid red;
	
	background-size:80%;
	
	cursor:pointer;
}

.menuItem:hover
{
	background-color:#1c1c1c;
}

#menuItemLogoSpacer
{
	margin:0px;
	height:75px;
	width:75px;
	display:inline;
	float:right;
}

#menuItemLogo
{
	margin:0px;
	height:75px;
	width:75px;
	display:inline;
	float:left;
	background-image:url('../gfx/icons/logo-can-75.png');
}

.menuItem.first
{
	//margin-left:100px;	
}

.menuItem.last
{
	//border-right:1px solid #111;
	//margin-right:100px;	
}



#menuContainer .menuItem
{
	background-image:url('../gfx/icons/menu-sprite.png');
	background-size:65px;	
}

#menuContainer .stencilCan
{
	background-position: 5px 6px;
	border-left:1px solid #151515;
	border-right:1px solid #151515;
}

#menuContainer .wallBricks
{
	background-position: 5px -60px;	
}

#menuContainer .saveArrow
{
	border-left:1px solid #151515;
	border-right:1px solid #151515;
	background-position: 5px -125px;		
}

#subMenu
{
	display:none;
	position:absolute;
	top:0px;
	width:100%;
	height:50px;
	background-color:#111;
	text-align:center;
	font-size: 0;
	z-index:100;
	opacity:0.9;
	min-width:600px;
	border-top:1px solid #1c1c1c;
	border-bottom:1px solid #222;
	box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.75);
	
	       -moz-user-select: none; 
        -khtml-user-select: none; 
        -webkit-user-select: none; 
        -o-user-select: none; 
	
}


#dashboard
{
	display:none;
	position:absolute;
	bottom:75px;
	width:100%;
	min-width:768px;
	overflow:auto;
	border-top:1px solid #222;	
	background-color:  rgba(0, 0, 0, 0.9);
	text-align:center;
	
	box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.75);
	
}

.left
{
	float:left;	
}

.right
{
	float:right;	
}


#menuContainer
{
	display:inline-block;
	width:auto;
	min-width:400px;	
	
}

#subMenuContainer
{
	//width:227px;
	margin:auto;
	overflow:none;
	min-width:227px;
	max-width:800px;
	text-align:center;
}

#subMenuContainer .menuItem
{
	border:0px;	
	//background-size:75%;
	width:50px;
	height:50px;
	background-color:#333;
	border-left:1px solid #1c1c1c;
}

#subMenuContainer .menuItem:hover
{
	background-color:#444;
}

#colourPicker .menuItem.selected
{
	background-color:#000;
}

#imageSizes .menuItem.selected
{
	background-color:#000;
}


#menuContainer .menuItem.selected
{
	background-color:#111;	
}

#imageContrast .menuItem
{
	
}

#contrast-plus
{
	background-image:url('../gfx/icons/sub-menu-sprite.png');
	background-size:50px;
	background-position:0px -400px;
}

#contrast-minus
{
	background-image:url('../gfx/icons/sub-menu-sprite.png');
	background-size:50px;
	background-position:0px -450px;
}

#colourPicker .menuItem
{
	background-image:url('../gfx/icons/sub-menu-sprite.png');
	background-size:50px;
		
}

#colourPicker .menuItem.white
{
	background-position:0px 0px;
	
}

#colourPicker .menuItem.yellow
{
	background-position: 0px -50px;
}

#colourPicker .menuItem.blue
{
	background-position:0px -100px;
}

#colourPicker .menuItem.red
{
	background-position:0px -150px;
}

#colourPicker .menuItem.green
{
	background-position:0px -200px;
}

#colourPicker .menuItem.pink
{
	background-position:0px -250px;
}

#colourPicker .menuItem.black
{
	background-position:0px -300px;
}


#imagePicker
{
	display:inline-block;
	float:left;
	background-color:#333;
	overflow:auto;
}


#imageSizes
{
	display:inline-block;
	background-color:#333;
	margin-right:20px;
}


#colourPicker
{
	display:inline-block;
	background-color:#333;
}

#addImage
{
	position:relative;
	background-image:url('../gfx/icons/sub-menu-sprite.png');
	background-size:50px;
	background-position:0px -500px;
}



#sprayPreview
{
	//border:1px solid orange;
	
	width:60px;
	height:60px;
	
	display:inline-block;
	float:left;
	
	background-repeat:no-repeat;
	background-position:center;
}

#imageAddIcon
{
	opacity:0;
}




#viewportContainer
{
	position:absolute;
	width:100%;
	top:0px;
	bottom:75px;	
	overflow:hidden;
	//border:1px solid blue;
}

#viewport
{
	//width:100%;
	position:absolute;
	left:0px;
	bottom:0px;
	display:none;
	margin:auto;
	//border:1px solid orange;
}

.border 
{
	border-width:25px 30px 10px 20px;
	-moz-border-image:url("../gfx/border.jpg") 25 30 10 20 repeat stretch;
	-webkit-border-image:url("../gfx/border.jpg") 25 30 10 20 repeat stretch;
	border-image:url("../gfx/border.jpg") 25 30 10 20 repeat stretch;
}


#modalWindow
{
	display:none;
	//padding:5px;
	margin:auto;
	position:absolute;
	//width:80%;
	//min-width:700px;
	max-width:728px;
	background-color:#111;//#2c2c30;
	z-index:101;
	//border:5px dashed #222;
	opacity:0.90;
	border-radius:3px;
	border:1px solid #222;
//	-webkit-box-shadow: 0 8px 6px -6px black;
//	   -moz-box-shadow: 0 8px 6px -6px black;
//	        box-shadow: 0 12px 6px -6px black;
//
//   -moz-box-shadow:    inset 0 0 12px #000;
//   -webkit-box-shadow: inset 0 0 12px #000;
//   box-shadow:         inset 0 0 12px #000;
}


#modalScreen
{
	display:none;
	position:absolute;
	width:100%;
	min-width:100%;
	background-color:#0c0c0c;
	z-index:100;
	opacity:0.98;
	top:0px;
	bottom:26px;
}



#modalContainer
{
	//border:1px solid white;
	color:white;
	text-align:center;
	width:100%;	
	
	font-family: 'Boycott';
}


.backgroundThumbnailContainer
{
	display:inline-block;
	width:80px;
	height:80px;
	//overflow:auto;
	//background-color:pink;
	margin:5px;
	cursor:pointer;
	opacity: 0.6;
}

.backgroundThumbnailContainer:hover
{
	opacity:1;
}

.backgroundThumbnailContainer:hover
{
	opacity:1;
}

.backgroundThumbnail
{
	width:80px;
	height:80px;
	background-color:transparent;
	background-image:url('../gfx/loading.gif');
	background-size:30px;
	background-repeat:no-repeat;
	background-position:center;
}

.backgroundThumbnail .thumbnailImage
{
	width:80px;
	height:80px;
	border-radius:100px;
	background-size:100%;
	background-image:url('../images/thumbnails/thumbnailSprite.jpg');
}

#thumbnail-a
{
	background-position:0px 0px;
}

#thumbnail-b
{
	background-position:0px -80px;
}

#thumbnail-c
{
	background-position:0px -160px;
}

#thumbnail-d
{
	background-position:0px -240px;
}

#thumbnail-e
{
	background-position:0px -320px;
}

#thumbnail-f
{
	background-position:0px -400px;
}

#thumbnail-g
{
	background-position:0px -480px;
}

#thumbnail-h
{
	background-position:0px -560px;
}



//.backgroundThumbnailSelector
//{
//	display:block;
//	//height:40px;
//	width:50px;
//	margin-left:auto;
//	margin-right:auto;
//	margin-top:30px;
//	border-radius:5px;
//	background-color:#131313;
//	color:white;
//	font-size:1em;
//	border:0px;
//	cursor:pointer;
//}


#closeModalWindow
{
	position:absolute;
	width:40px;
	height:40px;
	right:-21px;
	top:-21px;
	display:block;
	z-index:1002;
	cursor:pointer;	
	display:none;
}

#saveImage
{
	//border-radius:3px;
	display:block;	
	margin:auto;
	background-image:url('../gfx/loading.gif');
	
	background-size:30px;
	background-repeat:no-repeat;
	background-position:center;
		
	
	
	//-webkit-user-select: none;
}

#saveInfo
{
	display:block;
	font-size:1.5em;
	color:white;	
	padding:10px;
	background-color:#0c0c0c;
}

#modalMessage
{
	display:block;
	font-size:1.5em;
	color:white;	
	margin-top:20px;
	
}


/* file upload */

#fileUploadContainer
{
	position:relative;
	width:300px;
	margin:auto;	
	opacity:0.9;
}

#fileUploadContainer:hover
{
	opacity:1;
	background-color:#1c1c1c;
}

#fileUploadImage
{
	
}

#fileUploadText
{
	font-size:24px;
	padding-bottom:5px;
}


.fileUpload
{
	cursor:pointer;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	opacity:0 !important;
}

#links
{
	
	position:absolute;
	bottom:0px;
	width:98%;
	height:25px;
	font-size:12px;
	line-height:25px;
	background-color:black;
	border-top:1px solid #222;
	text-align:right;
	padding-right:1%;
	padding-left:1%;
	color:#666;
	font-family: 'Boycott';
			
}

#links a
{
	text-decoration:none;	
}

#leftLinks
{
	float:left;
}

#rightLinks
{
	float:right;	
}

#leftLinks a
{
	margin-right:10px;
	color:#666;	
}

#rightLinks a
{
	margin-left:10px;
	color:#666;		
}