/*
	cruickshank huinink zukerman stylesheet 
	by: linda kurniawan of lkstudio
	
	last modified: march 17, 2007
		
*/


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

body {
	font: 13px/1.3 "Lucida Grande", tahoma, sans-serif;
	background: #f0f0f0;
	text-align: center;
	color: #2a2a2a;
	}

.reset {
	display: block; 
	clear: both; 
	font-size: 1px; 
	height: 1px; 
	line-height: 0.1;
	}

#quote {
    width: 400px;
    height: 400px;
    }







/* interface
-------------------------------------------------------- */
#popupwrapper {
	position: relative;
	width: 576px;
	margin: 0px auto;
	text-align: left;
	}
	
#wrapper {
	position: relative;
	width: 762px;
	margin: 0px auto;
	text-align: left;
	}

	#header, #content, #footer {
		position: relative;
		float: left;
		width: 100%;
		}
    
    #popupheader {
        position: relative;
        border-top: 1px solid;
        border-bottom: 4px solid;
    }		
			
	#content {
		padding-bottom: 21px;
		border: 3px solid #e0e0e0;
		border-top:0px none;
		border-bottom:0px none;
		}
		
		#home #content { background: #fff url("../src/content-back.gif") repeat-y; }
		#sub #content { background: #fff url("../src/sidebar-back.gif") repeat-y; }
		
	#header, #popupheader {
		background: #fff;
		}
		
	#sidebar {
		float: left;
		width: 186px;
		}
		
	#sidebar h3{
		text-indent: 10px;
		font-size: 12px;
		padding-top: 10px;
		}		
		
		#alt {
			position: relative;
			background: url("../src/sidebar-back.gif") repeat-y;
			border-bottom: 3px solid #000;
			margin-bottom: 30px;
			}		
			
			#sub #subnav { background: url("../src/content-back.gif") repeat-y; }
	
		#main {
			float: right;
			width: 576px;
			background: url("../src/cog.gif") top right no-repeat;			
			}
        
        #mainleft {
			float: left;
			width: 576px;
			background: url("../src/cog.gif") top right no-repeat;			
			}
					   			
			
			#home #main { background-position: 320px 300px; }
			#sub #main { background-position: 320px 150px; }







/* logo replacement
-------------------------------------------------------- */	
#replacelogo {
	position: relative;
	width: 186px; height: 87px;
	background: url("../src/CHZlogo.gif") 0 no-repeat;	
	left:5px;	
	top:16px;
	}

	#replacelogo h1, #replacelogo a {
		display: inline;
		width: 186px; height: 87px;
		text-indent: -9999px;		
		text-decoration: none;
		} 
	
	#replacelogo a:hover {
		background: url("../src/CHZlogo.gif") 0 -87px no-repeat;
		}


/* company title replacement
-------------------------------------------------------- */			
	#replacetitle {
	  height:50px;
	  position: absolute;	  
	  top:29px;width:40px;
	  border-left: 1px solid Gray;
	  left:70px;	  
	}
	
	  #replacetitle p 
	  {	    
	    height: 16px;
	    text-indent: 2px;
	    font-size:14px;
	    font-weight:bold;		
	    text-align:right;  		        
	  }


/* slogan replacement
-------------------------------------------------------- */		  
	#replaceslogan {
	  height:18px;
	  position: absolute;	  
	  top:65px;width:100%;
	  left:-15px;	  
	}
	
	  #replaceslogan p 
	  {	    
	    height: 16px;
	    text-indent: 2px;
	    font-size:12px;
	    font-weight:bold;		
	    text-align:right;  
	    color:Maroon;		        
	  }


/* contact replacement
-------------------------------------------------------- */	
#replacecontact {
	position: relative;
	width: 186px; height: 150px;
	background: url("../src/contact.gif") no-repeat;
	}

	#replacecontact h3, #replacecontact a {
		display: block;
		width: 186px; height: 150px;
		text-indent: -9999px;
		background: none;
		text-decoration: none;
		background: url("../src/contact.gif") no-repeat;
		} 

		#replacecontact a:hover {
			background-position: 0 -150px;
			}
			

/* button replacement
-------------------------------------------------------- */	
#replacebutton {
	position: relative;
	width: 85px; height: 20px;
	background: url("../src/button.gif") no-repeat;
	}

	#replacebutton label, #replacebutton a {
		display: block;
		width: 85px; height: 20px;
		text-indent: -9999px;
		background: none;
		text-decoration: none;
		background: url("../src/button.gif") no-repeat;
		} 

		#replacebutton a:hover {
			background-position: 0 -20px;
			}

 #replacemap {
    float: right; 
    position: absolute; 
    top: 388px;
    right: 25px;
    /*padding: 275px 50px 0px 295px;*/
    }

/* non-navigation links
-------------------------------------------------------- */
#nav {
	position: absolute;
	top: 33px; right: 30px;
	}

	#nav li {
		float: left;
		color: #8b8b8b;
		}
	
		#nav li a {
			font-size: 14px;
			color: #000;
			padding: 0 6px;
			text-decoration: none;
			}

			#nav li a:hover {
				color: #f76802;
			}
			
			#nav li.active a {
				color: #f76802;
				text-decoration: underline;
				}

#subnav {
	border-bottom: 3px solid #000;
	margin-bottom: 30px;
	}

.sub2nav {
	margin-bottom: 30px;
	}	

	#subnav li, .sub2nav li {
		width: 186px;
		display: inline;
		}
	
	#subnav li a {
		position: relative;
		display: block;
		color: #000;
		padding: 3px 6px;
		text-decoration: none;
		border-bottom: 1px solid #e0e0e0;
		}
		
	.sub2nav li a {
		position: relative;
		display: block;
		color: #000;
		padding: 3px 6px 3px 5px;
		text-decoration: none;
		font-size: 11px;
		text-indent: 10px;
		}		
	
		#subnav li a:hover {
			/*background: url("../src/subnav-over.gif") repeat-y;*/
			background-color: Gray;
			}
			
		#subnav li.active a {
			font-weight: bold;
			background-color: Gray;
			}
			
		#subnav li.active a:hover {
			background-color: Gray;
			}			
        
        .sub2nav li.subactive a {             
             background-color:Gray;
        }
        
        .subactive a {                  
             font-weight:bold;                          
             background-color: Gray;
        }                      
        
        .sub2nav li.subselectionactive a {
            background: url("../src/subnav-active.gif") repeat-y;
            font-weight: bold;
        }
        
        .sub2nav li.subselection a {
            background: url("../src/subnav-over.gif") repeat-y;
            font-weight: normal;
        }
        
        .sub2nav li.subselection a:hover {
            background: url("../src/subnav-active.gif") repeat-y;            
        }        

/* non-navigation links
-------------------------------------------------------- */
a, a:link, a:active, a:visited {
	color: #f76802;
	}

a:hover {
	color: #f98d41;
	}




/* content area
-------------------------------------------------------- */
#main-img {
	margin-bottom: 30px;
	display: block;
	}

.col {
	float: left;
	width: 175px;
	margin-top: 5px;
	margin-right: 5px;
	text-align: left;
	}

.colfull {
	float: left;
	width: 85%;
	margin-top: 5px;
	margin-right: 30px;
	text-align: left;
	}



/* table content
-------------------------------------------------------- */
table.package {
	width: 240px;
	margin: 15px 0 30px 30px;
	float: left;
	display: inline;
	font-size: 11px;
}

table.package td, table.package th {
	padding: 2px 6px;
	border-bottom: 1px solid #e0e0e0;
	}
	
table.package th {
	background: #e0e0e0 url("../src/check.gif") 3px 3px no-repeat;
	padding-left: 18px;
	}
	
table.package td.price {
	font-size: 16px;
	color: #f76803;
	border: none;
	}




/* text
-------------------------------------------------------- */
li {
	list-style: none;
	}
	
#main h3, #mainleft h3 {
	font-size: 13px;
	padding-bottom: 12px;
	background: url("../src/lines.gif") 0 21px repeat-x;
	margin-left: 30px;
	}
	
	#main h3.contentheader{
		    padding-top: 10px;
		    color:Maroon;
		    background: none;
		}
		
	#main h3.subcontentheader{
		    padding-top: 10px;
		    font-size: smaller;
		    color:#333333;
		    background: none;		    
		}		
		
	#main h3.order {
		background: #f98d41;
		color: #fff;
		margin: 30px;
		padding: 6px;
		font-size: 16px;
	}
	
#main p {
	padding: 0 30px 15px 30px; 
	}

#footer p {
	font-size: 10px;
	text-align: right;	
	padding: 8px 0px 5px 12px;
	color: #8b8b8b;
	}	

#footerleft p {
	font-size: 10px;
	text-align: left;	
	padding: 30px 0px 5px 30px;
	color: #8b8b8b;
	}	

#sidebar p {
	padding: 0 12px 12px 12px;
	font-size: 11px;
	}
	
	#alt p {
		padding: 30px 12px;
		}
		
	    #alt p a {
		    color: Maroon;
		}		
		
		#sidebar strong {
			padding-top: 12px;
			display: block;
			}

p.credit {
	position: absolute;
	left: 3px; top: 0;
	}

.col h3, .col p, .colfull h3, .colfull p {
	margin-left: 30px;
	padding-left: 0 !important;
	padding-right: 0 !important;	
	}
	
.col p, .colfull p {
	font-size: 11px;
	}


/*navigational menu
-------------------------------------------------------- */	
  #menu {
    position: relative;
    border-top: 1px solid;
    border-bottom: 4px solid;
    background: #ddd;
  }	
  
  #navt {
    position:relative;
    height: 30px;    
  }
   
  #navt td a{
    font-weight: bold;        
    color: Black;
    text-decoration: none;
  }
  #navt td a:hover{
    color: Maroon;    
    text-decoration: underline;
  }  
  #navt td a.active{
    font-weight: bold;        
    color: Maroon;
    text-decoration: underline;
  }  
  
    #navt .mSplit{      
      border-right: 1px solid #bbbbbb;
      padding-left: 20px;
    }       
    #navt td#mHome{
      padding-left: 355px;      
    }    
    #navt td#mAbout{
      padding-left: 40px;
    }
    #navt td#mServices{
      padding-left: 40px;
    }
    #navt td#mContacts{
      padding-left: 30px;
    }