/*==============================
// home.css
// Written by Andy Konwinski
// this is a css for the homepage specific styles,
// see common.css for the styles that all pages share
===============================*/

/*=====================================================
// the following is content1 and related styling to control
// the image link mapping for that div, which has three link
// <a href...><i>link</i></a> tags in it that we are going to
// make invisible but still clickable as a css image map */
#content1 {
	background-repeat: no-repeat;
	border-left: 1px solid #AAB3C3;
	position: relative;
	height: 240px;
	z-index: 1;
	width: 499px;
}

#content1 a {
	text-decoration: none;
}

#content1 a i {
  visibility: hidden;
}

#siding a {height: 97px; width: 199px; top: 19px; left: 0; background-image: url(../images/siding/sidingBG.gif); background-repeat: no-repeat;}
#siding a:hover {background-position: -203px 0;}
#windows a { height: 155px; width: 129px; top: 98px; left: 196px; background-image: url(../images/windows/windowsBG.gif); background-repeat: no-repeat;}
#windows a:hover {background-position: -142px 0;}
#gutters a {height: 140px; width: 149px; top: 7px; left: 327px; background-image: url(../images/gutters/guttersBG.gif); background-repeat: no-repeat;}
#gutters a:hover {background-position: -189px 0;}

/*=====================================================
// same as above, but now for content2 */
#content2 {
	background-color: #8893A3;
	background-image: url(../images/siding/Moderra/moderra.jpg);
	background-repeat: no-repeat;
	position: absolute;
	height: 386px;
	width: 223px;
	padding: 10px;
	left: 500px;
	top: 161px;
	z-index: 2;
	border-left: 1px solid #FFFFFF;
}

#content2 a {
	position: absolute;
	text-decoration: none;
	left: 5px;
	top: 7px;
	height: 1px;
}

#content2 a i {
  visibility: hidden;
}

#qrnews {height: 148px; width: 200px; top: 1px; left: 14px;}
#freeestimatebutton a{
	background-image:url(../images/Site_Graphics/Buttons/rectbutt_home.gif);
	background-repeat: no-repeat;
	top: 189px;
	height: 42px;
	width: 137px;
	left: 335px;
}
#freeestimatebutton a:hover {
	background-position: -139px 0
}
/*.freeestimatebutton:hover {background-color:#333399;}*/


/*=====================================================
// same as above, but now for content3 */
#content3 {
  background-color: #AAB3C3;
  background-image: url(../images/home_graphics/homecontent3.jpg);
  background-repeat: no-repeat;
  position:relative;
  border-top: 1px solid #FFFFFF;
  height: 145px;
  padding: 10px;
  z-index: 1;
}

#content3 a {
  position: absolute;
  text-decoration: none;
}

#content3 a i {
  visibility: hidden;
}

#payment { height: 50px; width: 152px; top: 37px; left: 7px;}
#store { height: 150px; width: 135px; top: 10px; left: 177px;}
#gutterprotection { height: 150px; width: 158px; top: 10px; left: 348px;}