@charset "UTF-8";
/* ********************************************************************* 
IMPORTANT NOTES: 

The HTML editor only outputs straigt up html tags (no classes). Be sure the desired display 
style of all basic tags are covered in all dynamic HTML text areas output by the editor. If
necessary, wrap areas in DIV ID area with tag instances set for that areas ID.

The defualt standard font size for all broswers is 16px. Start with default body set to
100%, then use em's to set desired font size on tags. This will insure consistency and 
site accessability. Use pts for print size to ensure accurate printer output. 

Separate screen display and print area are defined below. Use these areas to format as
appropriate for screen and print. Use DIV ID areas to define specific tag styles. This will
make it possible to use classes for device control and control what does and does not
display on each device. This convension will facilitate easy expansion to accomodate other
devices in the future 

In paragraphs use bottom to set height between pagargraphs and leave marging top zero. This
will make it easier to control desired spacing with H tags and other block level elements.

********************************************************************* */ 

/* ********************************************************************* 
THE AREA BELOW IS USED TO ENSURE PAGES ARE FORMATTED FOR SCREEN DISPLAY 
************************************************************************  */

@media screen {
	/* reset tags to reduce browser inconsistencies */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
	   {margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		vertical-align: baseline;
		background: transparent;
	}

	/* forces vertical scroll bar to eliminate jumping on short pages */
	html {
		overflow-y: scroll;
	}

	body {
		font-size: 100%;
		font-family: Arial, Verdana, Helvetica, sans-serif;
		line-height: 150%;
		color: #636466;
		background: #FFFFFF;
		margin-left: auto; 
		margin-right: auto;
		text-align: center; /* to make primary container center properly in IE */
		background:url(images/bkrnd.jpg) center repeat-y;
	}

	/* primary container sets base page width */
	#container { 
		width:999px;
		margin-left: auto; 
		margin-right: auto;
		text-align: left;
	}
	
	h1 {
		font-weight: normal;
		font-size: 1.3em;
		margin-top: 1.7em;
		margin-bottom: .5em;
	}

	h2 {
		font-weight: normal;
		font-size: .9em;
		margin: 2em 0 0 0;
		color: #cc5f1b;
	}

	h3 {		
		font-weight: normal;
		font-style:italic;
		color: #cc5f1b;
		font-size: .75em;
		margin: 0 0 0 10px;
	}

	h4 {
		font-size: 1em;
		margin-top: 1.3em;	
		margin-bottom: .4em;
	}
	h5 {
		font-size: 1.06em;
		font-weight:normal;
		margin-top: 1em;	
		margin-bottom: 1em;
		color: #898b8d;
	}
	p  {
		font-size: .75em;
		line-height: 1.8em;
		margin-top: 0em;
		margin-bottom: 1.5em;
	}

	ul {
		font-size: .75em;
		margin: 2em 0 1.2em 3em;
	}	

	ol {
		margin-left: 3em; 
		font-size: .73em;
	}

	li {
		margin-bottom: 2em;
		line-height: 1.2em;
	}

	a {
		color: #cc5f1b;
		text-decoration:none;
	}
	
	a:active { /* removes outline on clicked links in FF browsers */
			outline: none;}
	a:focus {
  		-moz-outline-style: none;}
	
	/* a:visited {color: #333333;} */
	
	a:hover {
		color: #000;
		text-decoration:underline;
	}

	
	.formbox {
		background-color: #eee;
		padding: 20px;
		margin: 0 0 0 12px;
		clear: both;
		overflow: visible;
		}
		
	.formbox label { 
		font: 11px Arial, Helvetica, sans-serif;
		display: block;
		clear: both;}
 	.formbox input, select, textarea {
		margin-bottom:15px;}
		
	.checkbox {
		font: 11px Arial, Helvetica, sans-serif;
		display:block;
		float: left;
		overflow: auto;
		margin: 0 10px 0 0;}
	.checkbox input {
		margin: 0 2px 8px 0;
		padding: 0;
		float:left; }
	.checkbox label {
		clear:none;
		line-height: 15px;
	}
	.checkboxtighter input {
		margin-bottom:5px !important;
		height:14px!important;
		margin-top:-1px!important;
		margin-bottom:1px!important;
	
		}
	.radiobutton {
		font: 11px Arial, Helvetica, sans-serif;
		display:block;
		float: left;
		overflow: auto;
		width:70px;
		}
	.radiobutton input {
		margin: 0 3px 0 0 ;
		padding: 2px 0 0 0;
		vertical-align: top;
		float: left;
	}
	
	.error {
	font-weight:bold;
	color: #cc5f1b;
	}
	
	
	
/* END OF FORM AREA	*/



	/* used for output messaging action button following transaction error */
	.center {
			text-align: center;
			margin-left: 0px;
			margin-right: 0px;
	}
	
	/* used for output messaging following transaction */
	.msg {
			font-weight: bold;
			text-align: center;
			margin-top : 10px;
			margin-bottom : 0px;
			margin-left : 10px;
			margin-right : 0px;
	}
	
	.print { 
	 		/* use this class on things that are print only, for example, a print from statement */
			display: none !important;
		}


	/* start unique DIV areas by ID  
	-------------------------------------------------- */
	
	
	
	
	/* COLOR GUIDE 
	
	Orange --- #cc5f1b
	Dark gray --- #636466
	Medium gray --- #898b8d

	*/
	
	
	
	.globalmargin {
		margin: 0 8px 0 8px;}
	
	#tnav {
		overflow: auto;
		clear: both;
	 }
	
	#tnav ul, #tnav li {
		display:block;
		margin:0;
		text-indent:0;
		padding: 0;
		list-style-type:none;
		float: left;}
	
	#tnav li a {
		display:block;
		text-indent:-9999px;
		cursor:pointer;}

	
	.tnav-logo a {
		width:287px; height:93px;
		background: url(images/tnav2-crescendo-logo.gif);}
	
	
	.tnav-services a {
		width:97px; height:93px;
		background: url(images/tnav2.gif) 0 0;}
	.tnav-services a:hover, #services .tnav-services a {
		background-position: 0 -93px;}
		
		
	.tnav-gallery a {
		width:94px; height:93px;
		background: url(images/tnav2.gif) -97px 0; }
	.tnav-gallery a:hover, #gallery .tnav-gallery a {
		background-position: -97px -93px;}

		
	.tnav-projects a {
		width:101px; height:93px;
		background: url(images/tnav2.gif) -191px 0;}
	.tnav-projects a:hover, #projects .tnav-projects a {
		background-position: -191px -93px;}
		
		
	.tnav-the-latest a {
		width:107px; height:93px;
		background: url(images/tnav2.gif) -292px 0;}
	.tnav-the-latest a:hover, #the-latest .tnav-the-latest a {
			background-position: -292px -93px;}

	
	.tnav-contact-us a {
		width:115px; height:93px;
		background: url(images/tnav2.gif) -399px 0;}
	.tnav-contact-us a:hover, #contact-us .tnav-contact-us a {
		background-position: -399px -93px;}

	
	.tnav-architects a {
		width:182px; height:93px;
		background: url(images/tnav2.gif) -514px 0;}
	.tnav-architects a:hover,  #architects .tnav-architects a {
		background-position: -514px -93px;}

	





	#ubar, #hpflash, #hdrimg {
		position: relative;
		margin-top:6px;
		margin-bottom:6px;
		background: #000;
		clear: both;
		}
		
	#ubar a:hover, #textarea input[type='image']:hover {
		filter:alpha(opacity=90);/*Needed for IE*/
		-moz-opacity:0.90;/*Older mozilla broswers like NN*/
		-khtml-opacity: 0.90;/*Old versions of Safari and "KHTML" browser engines*/
		opacity: 0.90;/*FF, Safari, and Opera*/
		}
	
	#content {
		margin-top:18px;
		overflow: visible;
		clear: both;}
		
	.duocolorfirst {
		color: #898b8d;}
	
	.duocolorsecond {
		color: #cc5f1b;}
		
	#hpmessage {
		display: block;
		float: left;
		width:415px;
		height:310px;
		margin-bottom: 10px;
		border-right: 1px solid #a1a1a5;
	    background:url(images/hp-home-control-img.jpg) bottom right no-repeat;
		}
	#hpmessage p {
		margin-left: 30px;
		margin-right: 25px;
		}
	
	#hpbanner {
		display: block;
		width:225px;
		float: left;
		}
	
	#footer {
		xmargin-top:18px;
		overflow: auto;
		clear: both;}
	.footertext {
		float: left;
		display: block;
		margin:8px 20px 10px 25px;
		font-size:.7em;}
	#footerlinks {
		float: left;
		height: 33px;
		width: 533px;
		background:#000 url(images/footerbar-rside-brknd.gif)  no-repeat right;}
	#footerlinks ul {
		height: 33px;
		margin: 0 0 0 15px; }
	#footerlinks li {
		display:block;
		border-right: 1px solid #cc5f1b;
		margin:9px 0;
		text-indent:0;
		padding: 0 10px;
		list-style-type:none;
		float: left;
		font-size: .9em;
	}
	#footerlinks li a {
		color: #fff;
		text-decoration:none;
		}
	#footerlinks li a:hover {
		color: #cc5f1b;
		text-decoration:none;}
	#footlogos {
		clear: both;
		margin: 0 0 20px 25px;
		vertical-align: text-top;}
		
		

	#clientlogin {
		height: 33px;
		width: 448px;
		float: left;
		background:#000 url(images/footerbar-rside-brknd.gif)  no-repeat right;}
	#clientlogin .textfield {
		width:92px; 
		height: 13px; 
		margin:6px 7px 7px 0;
		padding-left:5px;
		float: left;}
	#clientlogin label {
		font-size:.6em; 
		color: #898b8d; 
		margin:4px 4px 8px 4px;
		float: left;}
	

	#contentdrill {
		margin-top:32px;
		overflow: visible;
		clear: both;}


	#leftnav {
		width: 245px;
		margin: -13px 0 40px -2px;
		overflow: auto;
		float: left;
	}
	
	.lnav-services {
	background:url(images/bkrnd-services-nav.jpg) no-repeat;
	}
	.lnav-contact-us {
	background:url(images/bkrnd-contact-us-nav.jpg) no-repeat;
	}
	
	
	#leftnav ul {
		margin: 50px 0 0 13px;
		font-size: .73em;

		}
	#leftnav li {
		display: block;
		list-style: none;
		text-indent:25px;
		margin:0;
		padding: 0;
		width: 205px;
		height:29px;
		line-height: 28px;
		background:url(images/services-nav-divider.gif) bottom  left no-repeat;
	}
	
	#leftnav a {
		display: block;
		font: bold 1em Arial, Helvetica, sans-serif;
		color: #636466;
		text-decoration:none;
		line-height: 28px;

	}
	
	#leftnav li:hover, #home-control .lnav-home-control, #audio-video .lnav-audio-video, #theater .lnav-theater, #lighting .lnav-lighting, #phone .lnav-phone, #surveillance .lnav-surveillance, #shades .lnav-shades, #commercial .lnav-commercial, #emailalerts .lnav-emailalerts, #staff .lnav-meet-our-staff, #team .lnav-join-our-team {
		background:url(images/services-nav-divider-r.gif) bottom  left no-repeat;
		text-decoration:none;
	}

	.contactinfo {
		margin: 40px 0 0 15px;
		}
	.contactinfo p {
		margin-left:10px;
		line-height:16px;
	}
	.contactinfo a {
		font-weight: normal!important;	
	}

	#textarea {
		width:498px;
		overflow: visible;
		float: left;
		min-height:300px;
	}
	#textarea h1,#textarea p, #textarea h2 {
		padding: 0 55px 0 10px;}
		
	#textarea a {
		color: #636466;
		text-decoration:underline;}
	
	#textarea a:hover {
		color: #cc5f1b;
		text-decoration:underline;}
	.drillh1 { 
		margin-top:10px;}
		
		
	#textarea ul {
		list-style:none;
		margin: 20px 0 30px 10px;

	}
	#textarea li {
		font-size: 1em;
		line-height: 1.8em;
		margin-right: 50px;
		padding: 0 0 0 10px;
		background:url(images/bullet-arrow-gray.gif) 1px 7px no-repeat;
	}	
	
	#textarea ul.tight li {
	line-height: 0.5em;
	background:url(images/bullet-arrow-gray.gif) no-repeat;
	margin-left:20px;
	}	
	
	#textarea table {
		width: 90%;
		margin: 0 35px 25px 11px;
		background: #ececed;
	}
	#textarea th {
		border: 2px solid #fff;
		font-size: .75em;
		line-height: 1.4em;
		padding: 10px 15px;
		background: #d9d9db;
		color: #cc5f1b;
		font-weight: bold;
		text-align: left;
	}
	#textarea td {
		border: 2px solid #fff;
		font-size: .75em;
		line-height: 1.4em;
		padding: 10px 15px;
	}
	#textarea table ul {
		margin: 5px 0 20px 0;
		padding: 0;
		list-style:none;
	}
	#textarea table li {
		font-size: 1.3em;
		line-height: 1.6em;
		margin:0;
		padding: 0 0 0 10px;
		background:url(images/bullet-arrow-gray.gif) 1px 5px no-repeat;
	}
	
	
	
	#rcol{
		width:225px;
		overflow: visible;
		float: right;
		margin: 0 0 40px 8px;
		position: relative;
	}

	#testimonialbox {
		width:244px;
		position: relative;
		top: 35px;
		left: -11px;
		background: url(images/brknd-testimonial-box.jpg) top left no-repeat;
		min-height: 122px;
		overflow: visible;
		
	}
	.testimonial-quote {
		display: block;
		padding:45px 35px 20px 35px;
		font-size: .72em;
		line-height: 1.4em;
		}
		
	.testimonial-author {
		display: block;
		padding: 0 30px 0 35px;
		font-size: .69em;
		line-height: 1.4em;
		text-align: right;
		color: #cc5f1b;
		}
		
	.testimonial-location {
		display: block;
		padding: 0 30px 20px 35px;
		font-size: .69em;
		line-height: 1.4em;
		text-align: right;
		}
	



} /* END SCREEN DISPLAY FORMAT AREA */


/* ***************************************************************** 
THE AREA BELOW IS USED TO FORMAT PAGES FOR PRINT 
********************************************************************  */
@media print {
	body {
		margin : auto auto auto auto;
		color: #000000;
	}	
	
	.screen { 
	 		/* use this class on things that are display only, for example, Printer icons */
			display: none !important;
		}
	
} /* END FOR PRINT FORMAT AREA */


