/*
 * #01 - General 
 * #02 - Masthead
 * #03 - Header
 * #04 - Navigation
 * #05 - Content (Note: Anything within the content
 *				  area should be in layout_content.css)  
 * #06 - Footer
 * #07 - Other 
 */

/* #01 - GENERAL **************************************************************/

* { margin: 0;  padding: 0; }

html
{
	/* footerStickAlt */
	height: 100%;
}

body
{
	/* centering */
	text-align: center;
	
	/* footerStickAlt */
	height: 100%;
	
	background: #edf3fa url('../images/bg_body.jpg') repeat-x 0 0;
}

#nonfooter
{
	/* centering */
	margin: 0 auto;
	text-align: center;
	
	/* footerStickAlt */
	position: relative;
	min-height: 100%;
		    
	background: transparent; 
}

* html #nonfooter
{
	/* footerStickAlt */
	height: 100%;
}

#outer-wrapper
{
	/* centering */
	width: 980px;
	margin: 0 auto;
	
	background: #fff url('../images/bg_outer_wrapper.gif') repeat-y 50% 0;
	
	/* height of #wrapper does not stretch to full height of screen like
	 * #nonfooter does.  #nonfooter background image may need to contain #wrapper
	 * section and should repeat-y in order to give impression that #wrapper is
	 * full height of screen.
	 */ 
}

#inner-wrapper
{
	/* centering */
	width: 912px;
	margin: 0 auto;
	
	padding: 30px 0 15px;
	overflow: hidden;
	
	text-align: left;
}

#wrapper-footer
{
	/* centering */
	width: 980px;
	margin: 0 auto;
	
	/* footerStickAlt */
	padding-bottom: 110px; /* same height as footer, extra padding for underneath content can be added here */
	overflow: hidden; /* required if #wrapper contains floats */
	
	height: 43px;
	
	background: #edf3fa url('../images/bg_wrapper_footer.jpg') no-repeat 50% 0;
}

/* #02 - MASTHEAD *************************************************************/

#masthead
{
	/* centering */
	width: 980px;
	margin: 0 auto;
	
	height: 190px;
	overflow: hidden;
	
	text-align: left;
	background: transparent url('../images/bg_masthead.jpg') no-repeat 50% 0;	
}

#masthead-logo
{
	display: block;
	width: 210px;
	height: 175px;
	overflow: hidden;
	text-indent: -9999px;
	background: transparent url('../images/cci_wireless_logo.gif');
	margin: 20px 0 0 22px;
	float: left;
}

#masthead-links
{
	width: 478px; /* Increase when Customer Login (or other) button is added */
	height: 32px;
	margin: 32px 30px 0 0;
	float: right;
}

#masthead-links a
{
	display: block;
	height: 32px;
	text-indent: -9999px;
	overflow: hidden;
	float: left;
}

#masthead-contact
{
	width: 100px;
	background: transparent url('../images/masthead_links.gif') no-repeat 0 0;
}
#masthead-contact:hover,
body#contact #masthead-contact { background-position: 0 -32px; }

#masthead-support
{
	width: 115px;
	background: transparent url('../images/masthead_links.gif') no-repeat -100px 0;
	margin-right: 10px;
}
#masthead-support:hover,
body#support #masthead-support,
body#tech #masthead-support,
body#trouble #masthead-support,
body#hardware #masthead-support,
body#guides #masthead-support,
body#care #masthead-support,
body#billing #masthead-support { background-position: -100px -32px; }

#masthead-login
{
	width: 148px;
	background: transparent url('../images/masthead_buttons.gif') no-repeat 0 0;
}
#masthead-login:hover { background-position: 0 -32px; }

#masthead-myphone
{
	width: 107px;
	background: transparent url('../images/masthead_buttons.gif') no-repeat -296px 0;
}
#masthead-myphone:hover { background-position: -296px -32px; }

#masthead-webmail
{
	width: 145px;
	background: transparent url('../images/masthead_buttons.gif') no-repeat -148px 0;
}
#masthead-webmail:hover { background-position: -148px -32px; }

/* #03 - HEADER ***************************************************************/

/* #04 - NAVIGATION ***********************************************************/

#nav
{
	width: 624px;
	height: 32px;
	margin: 78px 34px 0 0;
	float: right;
}

#nav a
{
	display: block;
	height: 32px;
	text-indent: -9999px;
	overflow: hidden;
	float: left;
	margin-right: 25px;
}
#nav a#nav-about { margin-right: 0; }

#nav-home
{
	width: 50px;
	background: transparent url('../images/nav_links.gif') no-repeat 0 0;
}
#nav-home:hover { background-position: 0 -32px; }

#nav-residential
{
	width: 164px;
	background: transparent url('../images/nav_links.gif') no-repeat -75px 0; 
}
#nav-residential:hover,
body#res-serv #nav-residential,
body#res-int #nav-residential,
body#res-voice #nav-residential { background-position: -75px -32px; }

#nav-business
{
	width: 140px;
	background: transparent url('../images/nav_links.gif') no-repeat -264px 0;
}
#nav-business:hover,
body#bus-serv #nav-business { background-position: -264px -32px; }

#nav-avail
{
	width: 91px;
	background: transparent url('../images/nav_links.gif') no-repeat -429px 0;
}
#nav-avail:hover,
body#avail #nav-avail,
body#sign-up #nav-avail { background-position: -429px -32px; }

#nav-about
{
	width: 79px;
	background: transparent url('../images/nav_links.gif') no-repeat -545px 0;
}
#nav-about:hover,
body#about #nav-about,
body#leadership #nav-about,
body#careers #nav-about { background-position: -545px -32px; }

/* #05 - CONTENT **************************************************************/

/* #06 - FOOTER ***************************************************************/

#footer
{
	/* should not contain content, only #inner-footer */
	/* if border-top is required, achieve this by adding border design to
	   background image, to avoid Disappearing Overflow bug */
	
	/* footerStickAlt */
	position: relative;
	margin-top: -110px;
	height: 110px;
	background: #fff url('../images/bg_footer.jpg') repeat-x 0 0;
    clear: both;
}

#inner-footer
{
	/* centering */
	width: 960px;
	margin: 0 auto;
	padding: 0 10px;
	
	height: 110px;
	overflow: hidden;
	
	text-align: left;
	background: #fff url('../images/bg_footer.jpg') repeat-x 0 0;
}

/* #07 - OTHER ****************************************************************/
