@charset "UTF-8";
/* CSS Document */

body {
	background-color: #0e0a08;
}
#bg_image {
	height: 393px;
	width: 800px;
	margin-left: -400px;
	position: absolute;
	left: 50%;
	top: 0px;
	background-image: url(images/main_bg.jpg);
	z-index: 0;
}
#retfar_logo {
	height: 68px;
	width: 255px;
	margin-left: -127px;
	position: absolute;
	left: 50%;
	top: 33px;
	background-image: url(images/retfar_logo.gif);
	z-index: 1;
}
#menu_box {
	height: 42px;
	width: 800px;
	margin-left: -400px;
	position: absolute;
	left: 50%;
	top: 124px;
	z-index: 1;
	}
#main_box {
	height: 601px;
	width: 800px;
	margin-left: -400px;
	position: absolute;
	left: 50%;
	top: 185px;
	z-index: 2;
	background-color: #878584;
	background-image: url(images/box_bg.jpg);
	background-repeat: no-repeat;
	border: 1px solid #FFFFFF;
}

/*
Internet Explorer: Width & Height include the border and padding etc. For example, 600px width includes 50px padding- it doesn't add it on.

Other Browsers: The Width & Height do not include b & p, it is added on to it. So 600px width will become 700px width with 50px padding on each side.

So, below, the html>body tag is the details for all other browsers- IE will ignore this and read what is in the regular tag. Get it?
 */

#main_text_bg {
	height: 571px;
	width: 316px;
	position: absolute;
	left: 470px;
	top: 15px;
	z-index: 1;
	background-image: url(images/txt_bg.jpg);
	background-repeat: no-repeat;
	padding: 20px;
}


html>body #main_text_bg {
width: 276px;
height: 531px;

} 


.regtext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
}
.headtxt {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	color: #FFFFFF;
	font-weight: bolder;
}
#top_left_box {
	height: 301px;
	width: 213px;
	position: absolute;
	left: 15px;
	top: 15px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
}
#top_mid_box {
	height: 301px;
	width: 213px;
	position: absolute;
	left: 243px;
	top: 15px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
}
#topright_textbox {
	height: 135px;
	width: 213px;
	position: absolute;
	left: 243px;
	top: 331px;
	z-index: 5;
	background-color: #741422;
	border: 1px solid #FFFFFF;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}
html>body #topright_textbox {
	height: 115px;
	width: 193px;
} 


#topleft_textbox {
	height: 135px;
	width: 213px;
	position: absolute;
	left: 15px;
	top: 331px;
	z-index: 5;
	background-color: #742515;
	border: 1px solid #FFFFFF;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	vertical-align: top;
}
a:link   {
	color: #CCCCCC;
}

a:visited   {
	color: #CCCCCC;
}

html>body #topleft_textbox {
	height: 115px;
	width: 193px;
} 
#copyright {
	width: 800px;
	position: absolute;
	left: 0px;
	top: 102%;
	z-index: 2;
	background-color: #878584;
	background-repeat: no-repeat;
	border: 1px solid #FFFFFF;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFFFFF;
}
#news {
	height: 92px;
	width: 421px;
	position: absolute;
	left: 15px;
	top: 481px;
	z-index: 5;
	background-color: #660033;
	border: 1px solid #FFFFFF;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	vertical-align: top;
}
#top_left_box_about {
	height: 450px;
	width: 450px;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	position: absolute;
	left: 15px;
	top: 15px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/box_bg2.jpg);
}


html>body #top_left_box_about {
	height: 430px;
	width: 420px;
}

#gallery {
	height: 570px;
	width: 770px;
	position: absolute;
	left: 15px;
	top: 15px;
	z-index: 5;
	border: 1px solid #FFFFFF;
}
#prod01 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 15px;
	top: 15px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/prod_roi.jpg);
}
#prod02 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 211px;
	top: 15px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/prod_tao.jpg);
}
#prod03 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 407px;
	top: 15px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/poster_kent.jpg);
}
#prod04 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 603px;
	top: 15px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/poster_buddy.jpg);
}
#prod_txt {
	height: 200px;
	width: 780px;
	position: absolute;
	left: 15px;
	top: 287px;
	z-index: 5;
	background-color: #741422;
	border: 1px solid #FFFFFF;
	padding: 10px;
}

html>body #prod_txt {
	height: 170px;
	width: 750px;
}#prod05 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 15px;
	top: 491px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/prod_condios.jpg);
}
#prod06 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 211px;
	top: 491px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/prod_tango.jpg);
}
#prod07 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 407px;
	top: 491px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/prod_who.jpg);
}
#prod08 {
	height: 256px;
	width: 181px;
	position: absolute;
	left: 603px;
	top: 491px;
	z-index: 5;
	background-color: #000000;
	border: 1px solid #FFFFFF;
	background-image: url(images/prod_roig.jpg);
}

