a {
	text-decoration: none;
	color: white;
}

body {
	font-family: "Helvetica Neue", "Helvetica";
	background: url(images/bg.jpg) repeat;
}

/*========================================================================================*/

#layout {
	margin: 40px auto; /* Distance from top */
}

#tablet-holder { /* Container for frame */
	width: 956px;
	margin-right: auto;
	margin-left: auto;
}

#tablet-top { /* Frame */
	width: 952px;
	height: 144px;
	background-image: url(images/tablet-top.png);
}

		#header { /* Container for name and number */
			color: black;
			width: 847px;
			margin-left: auto;
			margin-right: auto;
		}
	
		h1 { /* Company name */
			font-size: 40px;
			text-shadow: 2px 1px #c7c7cc;
			padding-top: 30px; /* WHY ARE THESE NEEDED TOGETHER?!?*/
		}
	
		#phone-number {
			float: right;
			font-size: 40px;
			margin: 0 0 0 0;
			text-shadow: 2px 1px #c7c7cc;
			margin-top: -30px; /* WHY ARE THESE NEEDED TOGETHER?!?*/
		}
	
		h1 span {
			color: red;
		}

#tablet-left { /* Frame */
	width:53px;
	height:1129px;
	float: left;
	background-image: url(images/tablet-left.png);
}

/*===============================================================================================*/

#tablet-container { /* Container for entire site. Home screen ONLY */
	width: 847px;
	height: 1129px;
	float: left;
	background: url(images/wallpaper3.jpg) repeat; /* Tablet wallpaper */
}

		#statusbar { /* Transparent. Home screen ONLY */
			width:847px;
			height: 22px;
			background-image: url(images/statusbar.png);
			text-align: center;
			margin-top: -16px; /* WHY ARE THESE NEEDED TOGETHER?!? */
		}

		#statusbar2 { /* White status bar */
			width: 847px;
			height: 22px;
			background-image: url(images/statusbar2.jpg);
			text-align: center;
			margin-top: -16px; /* WHY IS THIS NEEDED?!? */
		}
		
		p#maxtime { /* Clock */
			font-size: 16px;
			color: white;
		}

		/*========================================================================================*/

#icon-container { /* Container for main icons */
	padding-top: 60px;
}

.icon-row { /* Container for row */
	width: 847px;
	height: 140px;
	float: left;
	clear: left;
	padding-bottom: 40px;
}

#dock { /* Container for Dock */
	width: 847px;
	background-image: url(images/dock.png);
	float: left;
	height: 119px; 
	color: white;
	margin-top: 30px;
}

.icon {
	width: 113px;
	height: 120px;
	float: left;
	margin-left: 30px; /* Helps space icons along with icon padding */
	padding-top: 10px; /* Helps space icon along with icon-row padding */
	padding-left: 50px;
	text-align: center;
	color: white;
	text-shadow: black 1px 1px 2px;
}

.dock-icon {
	width: 113px;
	height: 120px;
	float: left;
	padding-left: 24px;
	text-align: center;
	color: white;
	text-shadow: black 1px 1px 2px;
}

/*==========================================================================================================*/

#tablet-container2 { /* Container for entire site. Non-Home screen */
	width: 847px; /* Moves tablet-right. DO NOT TOUCH */
	height: 1129px; /*Moves tablet-bottom. DO NOT TOUCH */
	float: left; /* DO NOT TOUCH*/
}

		#tablet-container2 h2 { /* Container for banner. Non-Home screen */
			text-align: left;
			color: black;
			height: 65px; /* Moves bottom of Banner up and down. ########################################### */
			background: url(images/banner.jpg);
			font-family: "Helvetica Neue", "Helvetica";
		}
		
/*==================================================================================================*/

h2 { /* Banner text settings */
	margin: 0; /* DO NOT TOUCH*/
	font-size: 40px; /* Size of banner text */
	padding-top: 40px; /* Moves top of Banner up and down. ############################################# */
	padding-left: 25px;
	font-weight: bold;
}

/*========================================================================================================*/

#content { /* Container for content */
	width: 847px;
	height: 1057px;
	overflow: auto; /* WHY IS THIS NEEDED?!? */
	/*text-align: justify;*/
	background: url(images/background.jpg);
	margin-top: -5px; /* Controls line to bottom of text ################################################### */
	padding-top: 50px; /* Controls distance from bottom of Banner ###################################*/
}

/*================================================================================================
.single-button {
	width: 827px; /* Controls Width edge to edge */
	height: 44px;
	display: block;
	background: url(images/single-button2.png) 0 0;
	margin-top: 0px; /* Distance from top */
	margin-bottom: 25px; /*Padding distance to next asset */
	margin-left: auto;
	margin-right: auto;
	padding: 14 10 10; /* Changes viewable area of single-button */
	text-align: center;
	font-size: 25px;
	color: black;
}
		
.single-button:hover {
	background-position: 0 -68px;
	color: white;
}

/*===================================================================================================*/

.page-links li {
	height: 66px; /* LINE SPACING. DO NOT TOUCH. */
	width: 847px; /* DO NOT TOUCH */
	background: url(images/page-link2.png); /* LINE SPACING. DO NOT TOUCH. */
}
.page-links li span { /* Settings for LINK text */
	font-size: 20px;
	float: left; /*DO NOT TOUCH */
	padding-top: 23px; /*DO NOT TOUCH */
	padding-left: 20px; /* Distance from icon? DO NOT TOUCH */
	height: 43px;
	width: 375px; /* Settings was 375 I think ######################################################*/
}
.page-links a:hover {
	color: white;
}
.page-links li.top-page-link {
	background-position: 0 0;
}
.page-links li.top-page-link:hover {
	background-position: 0 200px;
}
.page-links li.bottom-page-link {
	background-position: 0 -134px;
}
.page-links li.bottom-page-link:hover {
	background-position: 0 67px;
}
.page-links a { 
	text-decoration: none;
	font-weight: normal;
	font-style: normal;
	color: black;
	border-style: none;
	width: 455px; 
	height: 66px;
	display: block;
}
.page-links  img { /* Changes icon size */
	width: 40px;
	height: 40px;
	float: left;
	margin-top: 14px;
	margin-left: 20px;
	border-style: none;
}
ul.page-links {
	margin: 0; /* Space of page-link from left frame */
	list-style-type: none;
	padding: 0px; /* Space of page-link from left frame */
	float: left;
}

.page-links li:hover {
	background-position: 0 134px;
	color: white;
}

/*==================================================================================*/

.text-box-top {
	width: 847px;
	height: 20px;
	background: url(images/text-box-top.png) repeat;
	margin-top: 40px;
	margin-right: auto;
	margin-left: auto;
}
.text-box-content {
	width: 847px;
	background: url(images/text-box-back.png) repeat;
	margin-right: auto;
	margin-left: auto;
}
.text-box-bottom {
	width: 847px;
	height: 20px;
	background: url(images/text-box-bottom.png) repeat;
	margin-right: auto;
	margin-left: auto;
}

/*===================================================================================*/
		
#tablet-right { /* Controls Frame dimensions. DO NOT TOUCH. Useful in future redesign  */
	width: 53px; 
	height: 1129px;
	float: left;
	background: url(images/tablet-right.jpg) no-repeat;
}

#tablet-bottom { /* Controls Frame dimensions. DO NOT TOUCH. Useful in future redesign */
	width: 952px;
	height: 147px;
	background-image: url(images/tablet-bottom.png);
	float: left;
}

/*=============================================================================*/

#tablet-container3 { /* Container for entire site variant 3. Settings */
	width: 847px;
	height: 1129px;
	float: left;
}

#tablet-container3 h2 { /* Container for banner for site 3. Settings */
	text-align: center;
	color: gray;
	height: 49px;
	background: url(images/bannerSETTINGS.jpg);
	text-shadow: black 1px 1px 0px;
	font-family: "Helvetica Neue", "Helvetica";
}

/*===========================================================================*/


/* SCRAPS */


/* HOME */
#home-top {
	width: 475px;
	height: 26px;
	background-image: url(images/home-top.png);
	text-align: center;
	color: white;
	font-size: 19px;
	padding-top: 4px;
}

#home-bottom2 {
	width: 460px;
	background-image: url(images/home-bottom2.png);
	float: left;
	height: 133px;
	margin-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	color: white;
	padding-top: 15px;
}

#nav {
	float: left;
	margin: 20px auto 0;
	padding: 0;
	list-style-type: none;
	font-size: 18px;
	text-decoration: none;
}

#nav a {
	text-decoration: none;
	color: gray;
}

#nav a:hover {
	color: white;
}

#nav li {
	float: left;
	padding-right: 5px;
	text-align: center;
	border-right: 1px solid gray;
	border-left: 1px solid gray;
	padding-left: 6px;
}

.icon a, #home-bottom a, .icon a img, #home-bottom a img, .left-icon a, .left-icon a img {
	text-transform: none;
	border-style: none;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	color: white;
	text-shadow: black 1px 1px 2px;
}

.icon img, #home-bottom img {
	margin-bottom: 5px;
}

.left-icon, .home-left-icon {
	width:116px;
	height: 120px;
	float: right;
	padding-top: 10px;
	text-align: center;
	text-shadow: black 1px 1px 2px;
}
	
#content p {
	margin: 0;
	text-indent: 20px;
	line-height: 1.3em;
}

#content-right, #content-left{
	width: 10px;
	float: left;
	height: 100%;
}

/* PAGE TABLE */
