/*******************************************************************************
* RoccaTiles - www.roccatiles.com
* WEBSITE BY - mrmcbreen@gmail.com  - 
*******************************************************************************/

/* ------------  GLOBAL  -------------*/
form {	height:100%;  }


	body { 	  	 
	    position:absolute; 
	  	height:100%; 
	  	width:100%;
		font-family: verdana, arial, helvetica, sans-serif;
		font-size: 74%; 
		/*FONT-SIZE: 11px;*/ } 
		
	p {
		font: normal 11px/17px "tahoma", arial, verdana, sans-serif; 
		margin: 0; 
		padding: 7px 0 0 2px; 
		color: #6a6a5d; 
		line-height: 15px;  }
	
	h1 {
		font: normal 16px arial, 'Times New Roman', Serif; 
		line-height: 18px; 
		color: #91B476; 
		padding-bottom:0px;
		margin: 0; }
		
	h2 {
		font: normal 1.4em helvetica, tahoma ,trebuchet, 'Times New Roman', Serif; 
		color: #91B476; 
		padding: 0px 0 4px 0; 
		margin: 0; }
		
	h3 {
		font: normal 1.0em "tahoma" ,helvetica, trebuchet, 'Times New Roman', Serif; 
		color: #91B476; 
		padding: 8px 0 0px 0; 
		margin: 0;
		float: left; 
		width: 304px;}
		
	h4 {	
		font: normal 1.0em "tahoma" ,helvetica, trebuchet, 'Times New Roman', Serif; 
		color: #91B476; 
		padding: 8px 0 0px 0; 
		margin: 0;
		float: left; }
	
	
	img {
		border: none;
		margin: 0px;
		padding: 0px; }

	.clear {
		clear: both;
		line-height: 0;
		height: 0;
		padding: 0;
		margin: 0 ; 
		}
		
	li {
		margin: 0px;
		padding: 0px; }
	  
	#wrapper { 
		position:relative; 
	  	width: 770px; 
	  	text-align: left; 
	  	margin-left:auto; 
	    margin-right:auto; 
	  	height:100%; 
	  	background: #fff url("../img/top.gif") top left repeat-y; }
	  

/* ------------- Header --------------*/


	#header {
		/*background: red;*/
		width: 198px;
		margin: 0px;
		padding: 0px;
		float:left; }


/* ----------- Navigation ------------*/

	
	#nav { 
		margin: 0px;
		padding: 0px;
		float:left;
		 }

	#nav ul {
		width: 320px;		
	    margin: 40px 0 0 200px;
		vertical-align: top;
		list-style-image: url(../img/bullet.gif);
		font-size: 0.85em;
		 }

	#nav ul li  {
	
		float: left;
		height: 17px;
		padding: 2px 0 0 0px; 
		list-style: none;
		background: #8CAE71; }
		
	#nav ul li a {
		padding: 0px 6px 0px 9px;
		text-decoration: none;
		margin: 0;
		font-weight: normal;
	    }
		
	#nav ul li#homenav  {
		background: #8CAE71 url("../img/navleft.gif") no-repeat left top; }
	
	#nav ul li#storenav  {
		background: #8CAE71 url("../img/navright.gif") no-repeat right top;
		padding-right: 10px; }
		

/* ------------- Content -------------*/

	
	/*for other project links */
	/*#content p.work {
		width: 290px; 
		float: left;
		padding-right: 10px;
		}*/
		
	#content p.work {
		width: 420px; 
		float: left;
		padding-right: 10px;
		}
	
	#content ul {
		font: normal 11px/15px tahoma, arial, verdana, sans-serif;
		color: #666;
		margin: 0px;
		padding: 2px 0;
		float: left;
		list-style-image: url(../img/indicator.gif);
		vertical-align: bottom;
	}
	
	#content ul {
		width: 160px;
		padding: 10px 0 0 0;
	}
	
	#content li {
		margin: 0px 0 0px 20px;
		padding: 0px 0 4px 0;
	}
	
	#content li a, #content li a:link, #content li a:visited {
	  	color: #588DA2; }

	#ProductNav {padding: 20px 0 0 0px; margin: 0px 0 0 20px}
	#ProductNav ul{list-style-image:none; list-style:none; margin: 0px; padding: 0px; }
	#ProductNav ul li{list-style:none; margin: 0px; padding: 10px 0 10px 0px; BORDER-BOTTOM: #b1b1b1 1px solid; }
	#ProductNav ul li a{padding: 0px 0 0 10px; margin: 0px !important; text-decoration: none; color: #666666 !important}
	
	/*hr {height: 1px;   padding:0px; background: #DADAD9; color: #E7EDED;  margin: 0; border: 0;}*/
	/* ------------- firstCol -------------*/
	

	#firstCol {
		float: left; 
		width: 460px;
		}
		
	#firstCol div { 
	
		clear: both;
		
	}
	
	#firstCol div.article { 
		border-bottom: 1px solid #E4E3E4;
		clear: both;
		height: 94px;
	}
	
	#firstCol div a:hover span { 
		text-decoration: none;
	}
		
	#firstCol img.floatLeft { 
		float: left; 
		margin: 6px 10px 10px 0px;
		border: 1px solid #E4E3E4;
		padding: 4px;
		}
	
	#firstCol div.floatLeft { 
		float: left; 
		margin: 6px 10px 10px 0px;
		border: 1px solid #E4E3E4;
		padding: 4px;
		}
		
	#firstCol div p{ 
		margin: 0px 4px 0 4px;
	}
	
	#firstCol div p a{ 
		margin: 0px;
		padding: 0px;
	}
	
	#firstCol span { 
		color: #A9AAA8;
		
		}
	
		
	/* ------------- secondCol -------------*/
	
	
	#secondCol {
		text-align: left; 
        float: left; 
		width: 190px;
		margin: 0 0 20px 30px
		}

	#secondCol div { 
		border-top: 1px solid #E4E3E4;
		clear: both;
	}
	
	#secondCol img.floatLeft { 
		float: left; 
		margin: 6px 6px 6px 0px; 
		border: 1px solid #E4E3E4;
		padding: 4px;
		}
	
	#secondCol div p{ 
		margin: 0px 4px 0 4px;
	}
	
	#secondCol div p a{ 
		margin: 0px;
		padding: 0px;
	}
	
	#secondCol span { 
		color: #A9AAA8;
		
		}
	 

	/* ------------- footer -------------*/
	
	
	#footer {
		padding: 0px; 
		margin: 0px; 
		background: #fff url(../img/line.gif) bottom left no-repeat; 
		border-left: 6px solid #EAE9E9; 
		margin: 0px 0 0 50px; 
		height: 6px; 
		}
		
	#fns {padding: 0px 0 0 60px;}
	#fns p {color: #DBD8D8}	
	
#contact_content {
	margin: 45px 0 0px 0;
}

label{
	display: block;
	font: normal 10px/16px "lucida grande", tahoma, arial, verdana, sans-serif;
	margin: 0;
	padding: 0px 0;
	color: #666;
}

.textfield{
	font: normal 11px/13px "lucida grande", tahoma, arial, verdana, sans-serif;
	padding:2px;
	margin: 0;
	border: 1px solid #ccc;
	background-color: #eee;
	width: 100%;
	color: #666;
}

.textfield2{
	font: normal 11px/13px "lucida grande", tahoma, arial, verdana, sans-serif;
	padding:2px;
	margin: 0;
	border: 1px solid #ccc;
	background-color: #eee;
	width: 207px;
	color: #666;
}

#contact td{
	padding:5px;
}

#contact table{
	width: 100%;
}

.CallBack { BORDER-RIGHT: #b1b1b1 1px solid;
	 PADDING-RIGHT: 10px; 
	 BORDER-TOP: #b1b1b1 1px solid; BORDER-BOTTOM: #b1b1b1 1px solid; 
	 PADDING-LEFT: 10px; 
	 PADDING-BOTTOM: 10px; 
	 BORDER-LEFT: #b1b1b1 1px solid; 
	 PADDING-TOP: 10px; 
	 BACKGROUND-COLOR: #ffffff;
}

.pnlEditBar {background-color: #36393E; height: 20px; padding: 4px; color: #DBD8D8; font: normal 11px/17px "tahoma", arial, verdana, sans-serif; }
.pnlEditBar a{color: #DBD8D8 !important;}
.sb_toolbar {color: #DBD8D8; padding: 2px 2px 0 4px;}
.sb_toolbar a{color: #DBD8D8 !important}


/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}


/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
	font-size: 24px;
	line-height: 20px;
}

.sIFR-hasFlash #work1 {
	visibility: hidden;
	font-size: 20px;
	line-height: 24px;
	padding:0;
	margin:0;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 14px;
		line-height: 14px;
}

/*---- Play ----*/

.sIFR-hasFlash #play h1 {
	visibility: hidden;
	font-size: 24px;
	line-height: 24px;
}

.sIFR-hasFlash #play h2 {
	visibility: hidden;
	line-height: 16px;
	font-size: 14px;
	padding:0;
	margin:0;
}