
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<TITLE>Rene Trevino</TITLE>
<META NAME="Description" CONTENT="Paintings and drawings.">



<style>

body {
				
font:9.5pt calibri, Verdana, Arial, san-serif;
margin : 0;
padding : 0;
background:#fff;
background-position:top;
color : #036;


  
  
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS navigation rollovers with a dropdown menu</title>

<style type="text/css">
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2008 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
body {font-family:Helvetica Neue Light, Gill Sans Light, Calibri, Verdana ; font-size:9px;}

#navigation {width:140px;position:fixed; margin-top:50px; border-right:0px solid #999; padding:0px 0px; left: 0px; float:left; font-family:Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;color:#9e9e9e; font-size:13px; letter-spacing:1px;}
/* hack to correct IE5.5 faulty box model */
* html #navigation {width:120px; w\idth:120px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#navigation li {width:120px;position:relative;list-style-type: none;}
#navigation li.first-level {height:27px;}
/* style the links for the top level */
#navigation a, #navigation a:visited {display:block; height:28px; background:url(images/NavigationBar.png); top: 50px; left:0px; text-indent:-9000px;}
/* a hack so that IE5.5 faulty box model is corrected */
* html #navigation a, * html #navigation a:visited {width:145px; w\idth:145px;}

/* style the second level background */
#navigation ul ul a.drop, #navigation ul ul a.drop:visited {background:#777777}
/* style the second level hover */
#navigation ul ul a.drop:hover{background:#fff; color:#202c32;}
#navigation ul ul :hover > a.drop {background:#fff; color:#202c32;}
/* style the third level background (I´m not using this yet)*/
#navigation ul ul ul a, #navigation ul ul ul a:visited {background:#e2dfa8;}
/* style the third level hover */
#navigation ul ul ul a:hover {background:#b2ab9b;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
#navigation ul ul {visibility:hidden;position:absolute;top:4px;left:120px; padding:1px; height:auto; width:140px; border-left:0px solid #999;}
#navigation ul ul.information-subnav{top:4px;}
/* another hack for IE5.5 */
* html #navigation ul ul {top:-9px;t\op:-10px;}

/* position the third level flyout menu */
#navigation ul ul ul{left:149px; top:-1px; width:149px;}

/* position the third level flyout menu for a left flyout */
#navigation ul ul ul.left {left:-149px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
#navigation table {position:absolute; top:0; left:0; border-collapse:collapse;}

/* style the second level links */
#navigation ul ul a, #navigation ul ul a:visited {background:#fff; width: 300px; color:#646464; height:auto; line-height:12px; text-indent:0px; display:block; padding:5px; text-decoration:none;font-size:13px;letter-spacing:1.5px; font-family:Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;}
/* yet another hack for IE5.5 */
* html #navigation ul ul a, * html #navigation ul ul a:visited {width:145px;w\idth:145px;}

/* style the top level hover */
#navigation :hover > a, #navigation ul ul :hover > a {background:url(images/NavigationBar.png) top left;}

/* top level image background placements */
#navigation a.link1 {background-position:-10px -0px;}
#navigation a.link1:hover {background-position:-145px 0px;}
#navigation a.link2 {background-position:-10px -30px;}
/* DO NOT consolodate next 2 lines into one, this breaks IE6 */
#navigation a.link2:hover {background-position:-135px -30px;}
#navigation :hover > a.link2, #navigation ul ul :hover > a.link2  {background-position:-145px -30px;}
#navigation a.link3 {background-position:-10px -60px;}
#navigation a.link3:hover{background-position:-135px -60px;}
#navigation :hover > a.link3, #navigation ul ul :hover > a.link3  {background-position:-145px -60px;}


#navigation ul ul a:hover {background:#fff; color:#831F15;}
/* make the second level visible when hover on first level list OR link */
#navigation ul li:hover ul,
#navigation ul a:hover ul{visibility:visible; }
/* keep the third level hidden when you hover on first level list OR link */
#navigation ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
#navigation ul :hover ul :hover ul{ visibility:visible;}

</style>

</head>






<style type="text/css">
p.small {line-height:80%;}
p.big {line-height:200%;}
</style>


.style3 {
	font-size:8pt;
	font-family: calibri, Verdana, Arial, san-serif;
	color:#777777;
	text-align:left;
	}


a:link {
	color:#777777;
	text-decoration: none;
	
}
a:visited {
	color:#777777;
	text-decoration: none;
}
a:hover {
	color: #880011;
	text-decoration: none;
	}

#Navbar {
	position:fixed;
	left:32px;
	top:68px;
	width:500px;
	height:25x;
	font-size: 11pt;
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	letter-spacing:2px;
	line-height:20px;
	font-style:caps;
	text-transform:uppercase;
}
#menu {
  font-family:Helvetica Neue, Arial, Helvetica, sans-serif;
  font-size:14px;
  line-height:20px;
  letter-spacing:1px;
  position:fixed;
  height:auto;
  top:55px;

}
#menu ul {
  -moz-padding-start:0;
  -webkit-padding-start:0;
  padding-start:0;
  padding:0;
  margin-left: 40px;
  list-style:none;
  width: 300px;
  



}
#menu ul li {
  background-color: transparent;
  margin-bottom: 2px;
  
}
#menu ul li a {
  text-decoration: none;
  display: block;
}
#menu ul li ul {
  display: none;
  position: absolute;
  width: 120px;
  background-color:#FFF;
  left: 130px;
  padding-left: 5px;
  margin-top:-19px;
  letter-spacing:.6px;
}
#menu li li {
  min-width: 200px;
  postition: relative;

}
#menu ul ul li {
  position: relative;
}
#menu ul ul ul {
  left:0;
  top:40px;
  position:absolute;
  background-color: #333;
}
#menu ul ul ul li {background-color: #FFF;}
#menu ul ul ul a {
  color: #fff;
}
#menu ul li:hover > ul {
  display: block;
}

.nyroModalBg {
	position: fixed;
	overflow: hidden;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: #000;
	opacity: 0.9;
}	
.nyroModalTitle {
	top: -23px;
	left: 0;
	margin: 0;
    font-size: 9pt;
	letter-spacing:.5px;
	font-weight: lighter;
	font-size:11px;
	font-family: Verdana, Geneva, sans-serif;
	color: #ddd;
}
.nyroModalCont {
	position: absolute;
	border: 4px solid #777;
	margin: 25px;
	background: #777;
}

#Content {
	position:absolute;
	left:25px;
	top:320px;
	width:auto; 
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-weight:lighter;
	color:#646464;
	font-size: 9pt;
	
}

#text {
	position:absolute;
	left:48px;
	top:630px;
	width:4000px; 
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-weight:lighter;
	color:#646464;
	font-size: 9.5pt;
	line-height:14pt;
	
}
#whitebar {
	position:fixed;
	left:0px;
	top:0px;
	z-index:1;
	background-color:#fff;
	width:100%;
	height:10px;
	z-index:-2;
	}

#Home {
	position: absolute;
	align: center;
	top:180px;
	width:1000px; 
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-size: 11pt;
	font-weight:lighter;
	color:#646464;
	
}

#Homeb {
	position: absolute;
	left: 50px;
	margin-right:50px;
	margin-top:20px;
	margin-left: 260px;
	max-width: 90%;
		height: auto;
		width: auto\9; /* ie8 */
	overflow:visible;
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-size: 11pt;
	font-weight:lighter;
	color:#646464;
	z-index: -1;
}

.transparent {
        zoom: 1;
        filter: alpha(opacity=60);
        opacity: 0.6;
}
.opaque {
	filter: alpha (opacity=100);
	opacity: 1;
}
.imagehover {
color: #7777;
}
.imagehover p:hover {
color: #880011;
text-align:center;
}

#bio {
	position:fixed;
	left:300px;
	top:116px;
	width:600px; 
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-size: 10pt;
	line-height: 16pt;
	font-weight:lighter;
	letter-spacing:.4px;
	color:#686868;
}

#cv {
	position:absolute;
	left:310px;
	top:96px;
	width:auto; 
	height:2500px;
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana, monoco;
	font-size: 14pt;
	font-weight:lighter;
	line-height: 14pt;
	letter-spacing:.2px;
	color:#686868;
	z-index:-3;
	padding-right:20px;
}
.trcv {
	padding-right:25px;
}

.tdcv {
	padding-bottom:10px;
	

}

#Contactimage {
	position:fixed;
	left:175px;
	top:73px;
	width:2500px; 
	z-index:-4;
	
}
#contacttext {
	position:fixed;
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-size: 9pt;
	font-weight:500;
	letter-spacing:.5px;
	color:#FFF;
	top:500px;
	z-index:-1;
	left:625px;
	text-align:left;
}

#contactform{
	position:fixed;
	left: 180px;
	top:465px;
	font-size:12px;
font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
color:#FFF;

	
}

#News {
	position:absolute;
	left:310px;
	top:60px;
	width:800px; 
	height:auto;
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-size: 10pt;
	font-weight:lighter;
	letter-spacing:.2px;
	color:#686868;
	line-height: 14pt;
	
		
}


#ClassContent {
	position:absolute;
	left:30px;
	top:265px;
	width:auto; 
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-weight:lighter;
	color:#646464;
	font-size: 9pt;
	
}
#ClassContent tr {vertical-align:top;}

#Description {
	position:fixed;
	left:309px;
	top:50px;
	width:800px; 
	height:auto;
	font-family: Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	font-size: 11.5pt;
	font-weight:lighter;
	letter-spacing:.2px;
	color:#686868;
	line-height: 16pt;
	z-index:-3;
		
}

.title {
	color:#333;
	font-size:14px;
}


#Copyright {
	position:fixed;
	left:30px;
	bottom:10px;
	width:40%;
	font-size:8pt;
	font-family:Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	color:#999;
	text-align:left;
	
	}
	
	
#Rene {
	position:fixed;
	left:45px;
	top:20px;
	width:auto;
	font-size: 24pt;
	font-family:Helvetica Neue Light, Gill Sans Light, Calibri, Verdana;
	color:#880011;
	text-align:left;
	letter-spacing: 2px;
	z-index:-1;
}

a:active {
	text-decoration: NONE;
	
}
