/*##################################################
CSS and graphics by Auriel Rene at fundamental force
auriel.rene at fundamentalforce dot net
(c)2007
##################################################*/


body {
margin: 0px;
padding: 0px;
background: #080A0A url(img/sidebar.gif) 0px 0px repeat-y;
}

/* top of page */

#headerbox {
height: 100px;
width: 800px;
position: absolute; top: 10px; left: 160px;
background: url("http://www.13por13.com/juan/img/juan3.gif") 0px 0px no-repeat;
}
#title {
height: 25px;
width: 800px;
position: absolute; top: 75px; right: 50px;
color: #f37a31;
font: 25px sans-serif;
text-align: right;
}

#title a {font: sans-serif; color: #e8500e; text-decoration: none;} 

#title a span {display:none;}

#title a:hover {color: #f37a31;}

#title a:hover span {
display: block;
position: absolute; top: 35px; right: 0px;
z-index: 100;
width: 700px;
padding: 10px;
background: #0A0B09;
border: 1px solid #102929;
font-size: 14px; 
color: #558D8D;
text-align: center;
}

/* sidebar menu */

#sidebar {
position: absolute; left: 0px; top: 0px;
height: 170%;
width: 150px;
margin: 0;
background: url(img/sidebar.gif) 0px 0px repeat;
color: #558D8D;
text-align: center;
text-decoration: none;
line-height: 150%;
padding-right: 0px;
overflow: auto;
}
#sidebar a, a:link, a:visited {
text-decoration: none;
}
#sidebar a:hover {
text-decoration: none;
}

#rec{
height: 54px;
width: 92px;
position: absolute; top: 100px; left: 24px;
text-align: center;
background: url(img/button-rec.gif) no-repeat;
}

#rec a {
display: block;
color: #558D8D;
}

#rec a:link, a:visited {
text-decoration: none;
}

#rec a:hover {
height: 54px;
background: url(img/button-rec2.gif) no-repeat;
}

#pas {
height: 27px;
width: 137px;
position: absolute; top: 174px; left: 1px;
text-align: center;
background: url(img/button-pas.gif) no-repeat;
}

#pas a {
display: block;
color: #558D8D;
}

#pas a:link, a:visited {
text-decoration: none;
}

#pas a:hover {
height: 27px;
background: url(img/button-pas2.gif) no-repeat;
}

#sho {
height: 81px;
width: 137px;
position: absolute; top: 221px; left: 1px;
text-align: center;
background: url(img/button-sho.gif) no-repeat;
}

#sho a {
display: block;
color: #558D8D;
}

#sho a:link, a:visited {
text-decoration: none;
}

#sho a:hover {
height: 81px;
background: url(img/button-sho2.gif) no-repeat;
}


#bio {
height: 54px;
width: 137px;
position: absolute; top: 322px; left: 1px;
text-align: center;
background: url(img/button-bio.gif) no-repeat;
}

#bio a {
display: block;
color: #558D8D;
}

#bio a:link, a:visited {
text-decoration: none;
}

#bio a:hover {
height: 54px;
background: url(img/button-bio2.gif) no-repeat;
}

#res {
height: 27px;
width: 92px;
position: absolute; top: 396px; left: 24px;
text-align: center;
background: url(img/button-res.gif) no-repeat;
}

#res a {
display: block;
color: #558D8D;
}

#res a:link, a:visited {
text-decoration: none;
}

#res a:hover {
height: 27px;
background: url(img/button-res2.gif) no-repeat;
}

#con {
height: 27px;
width: 107px;
position: absolute; top: 443px; left: 16px;
text-align: center;
background: url(img/button-con.gif) no-repeat;
}

#con a {
display: block;
color: #558D8D;
}

#con a:link, a:visited {
text-decoration: none;
}

#con a:hover {
height: 27px;
background: url(img/button-con2.gif) no-repeat;
}

#ric {
height: 54px;
width: 137px;
position: absolute; top: 490px; left: 1px;
text-align: center;
background: url(img/button-ricardo.gif) no-repeat;
}

#ric a {
display: block;
color: #558D8D;
}

#ric a:link, a:visited {
text-decoration: none;
}

#ric a:hover {
height: 54px;
background: url(img/button-ricardo2.gif) no-repeat;
}

#copyright {
height: 81px;
width: 107px;
position: absolute; top: 590px; left: 16px;
text-align: center;
background: url(img/copyright.gif) no-repeat;
}

#copyright a {
display: block;
color: #558D8D;
}

#copyright a:link, a:visited {
text-decoration: none;
}

#copyright a:hover {
height: 81px;
background: url(img/copyright2.gif) no-repeat;
}

/* main text */

#text {
position: absolute; left: 155px; top: 105px;
width: 700px;
height: 100%;
margin: 0;
color: #447C7B;
text-align: left;
font-family: sans-serif;
font-size: 14px;
font-weight: ;
line-height: 110%;
z-index: 2}

#text a:link, #text a:visited {
color: #447C7B;
text-decoration: none;
}

#text a:hover {
color: #97C7C7;
text-decoration: none;
}

#text h1 {
color: #447C7B;
font-size: 16px;
text-align: center;
text-transform: uppercase;
letter-spacing: 0.05em;
line-height: 110%;
padding: 10px 10px 10px;
}

.indent {
text-indent: 100px;
}

.overflow {
overflow: auto;
width: 685px;
height: 98%;
}

.padside {
padding-right: 10px;
}
.pad {
padding: 10px;
}

ul.none {list-style-type: none}

/* shows */

#text2  {
position: absolute; left: 635px; top: 155px;
width: 600px;
height: 100%;
margin: 0;
color: #447C7B;
text-align: center;
font-family: sans-serif;
font-size: 14px;
font-weight: bold;
line-height: 200%;
z-index: 2}

#text2  a:link, #text2 a:visited {
color: #3db1b0;
text-decoration: none;
}

#text2 a:hover {
color: #97C7C7;
text-decoration: none;
}

#text2 h1 {
color: #3db1b0;
font-size: 18px;
text-align: center;
text-transform: uppercase;
letter-spacing: 0.05em;
line-height: 110%;
}

#text2 h2 {
color: #3db1b0;
font-size: 18px;
text-align: center;
letter-spacing: 0.05em;
line-height: 110%;
}

#text2 h2 a:link {
color: #3db1b0;
}


/* resume columns */
/* exhibitions */

#left {
    float:left;
    width:70px;
    position: absolute; top: 150px; left: 155px;
    padding: 5px;
    padding-top: 20px;
    text-align: left;
    color: #f37a31;
    font-family: sans-serif;
    font-size: 14px;
    font-weight: bold;
    line-height: 110%;
    }

#right {
    float:right;
    width:800px;
    padding: 5px;
    padding-top: 20px;
    position: absolute; top: 150px; left: 250px;
    text-align: left;
    color: #447C7B;
    font-family: sans-serif;
    font-size: 14px;
    line-height: 110%;
    }

#right a:link, #right a:visited {
color: #97C7C7;
text-decoration: none;
}

#right a:hover {
color: #f37a31;
text-decoration: none;
}


/* artwork */

#art {
height: 100%;
width: 700px;
padding: 10px;
position: absolute; left: 155px; top: 125px;
z-index: 1
color: #447C7B;
text-align: left;
font-family: sans-serif;
font-size: 14px;
font-weight: ;
line-height: 110%;
}

#art a:link, #art a:visited {
color: #447C7B;
text-decoration: none;
}

#art a:hover {
color: #97C7C7;
text-decoration: none;
}

#art h1 {
color: #447C7B;
font-size: 20px;
letter-spacing: 0.2em;
padding: 10px 10px 10px;
}

/* recent artwork */

/* 2009 */

#sugarskull {
height: 285px;
width: 277px;
position: absolute; top: 20px; left: 262px;
background: url(art/2009/p/sugarskull.jpg) 0px 0px no-repeat;
}

#sugarskull a {
display: block;
}

#sugarskull a:hover {
height: 285px;
width: 277px;
background: url(art/2009/p/sugarskull-2.jpg) 0px 0px no-repeat;
}


/* 2008 */

#immigrationcup {
height: 285px;
width: 222px;
position: absolute; top: 20px; left: 20px;
background: url(art/2008/p/immigrationcup.jpg) 0px 0px no-repeat;
}

#immigrationcup a {
display: block;
}

#immigrationcup a:hover {
height: 285px;
width: 222px;
background: url(art/2008/p/immigrationcup-2.jpg) 0px 0px no-repeat;
}

#teammexico {
height: 285px;
width: 250px;
position: absolute; top: 20px; left: 262px;
background: url(art/2008/p/teammexico.jpg) 0px 0px no-repeat;
}

#teammexico a {
display: block;
}

#teammexico a:hover {
height: 285px;
width: 250px;
background: url(art/2008/p/teammexico-2.jpg) 0px 0px no-repeat;
}

#teamusa {
height: 285px;
width: 250px;
position: absolute; top: 20px; left: 532px;
background: url(art/2008/p/teamusa.jpg) 0px 0px no-repeat;
}

#teamusa a {
display: block;
}

#teamusa a:hover {
height: 285px;
width: 250px;
background: url(art/2008/p/teamusa-2.jpg) 0px 0px no-repeat;
}

#sanchupas {
height: 285px;
width: 174px;
position: absolute; top: 325px; left: 20px;
background: url(art/2008/p/sanchupas.jpg) 0px 0px no-repeat;
}

#sanchupas a {
display: block;
}

#sanchupas a:hover {
height: 285px;
width: 174px;
background: url(art/2008/p/sanchupas-2.jpg) 0px 0px no-repeat;
}

#pitbull {
height: 285px;
width: 281px;
position: absolute; top: 325px; left: 245px;
background: url(art/2008/p/pitbull_luchador.jpg) 0px 0px no-repeat;
}

#pitbull a {
display: block;
}

#pitbull a:hover {
height: 285px;
width: 281px;
background: url(art/2008/p/pitbull_luchador-2.jpg) 0px 0px no-repeat;
}

#power_lines {
height: 285px;
width: 205px;
position: absolute; top: 325px; left: 577px;
background: url(art/2008/p/power_lines.jpg) 0px 0px no-repeat;
}

#power_lines a {
display: block;
}

#power_lines a:hover {
height: 285px;
width: 205px;
background: url(art/2008/p/power_lines-2.jpg) 0px 0px no-repeat;
}


/* past artwork */

/* 2006 */

#aids_poster {
height: 285px;
width: 225px;
position: absolute; top: 20px; left: 20px;
background: url(art/2006/p/aids_poster.jpg) 0px 0px no-repeat;
}

#aids_poster a {
display: block;
}

#aids_poster a:hover {
height: 285px;
width: 225px;
background: url(art/2006/p/aids_poster-2.jpg) 0px 0px no-repeat;
}

#cal_2006 {
height: 273px;
width: 205px;
position: absolute; top: 20px; left: 285px;
background: url(art/2006/p/cal_2006.jpg) 0px 0px no-repeat;
}

#cal_2006 a {
display: block;
}

#cal_2006 a:hover {
height: 273px;
width: 205px;
background: url(art/2006/p/cal_2006-2.jpg) 0px 0px no-repeat;
}

#cal_2007 {
height: 280px;
width: 212px;
position: absolute; top: 20px; left: 530px;
background: url(art/2006/p/cal_2007.jpg) 0px 0px no-repeat;
}

#cal_2007 a {
display: block;
}

#cal_2007 a:hover {
height: 280px;
width: 212px;
background: url(art/2006/p/cal_2007-2.jpg) 0px 0px no-repeat;
}

#narco_punk {
height: 324px;
width: 167px;
position: absolute; top: 325px; left: 157px;
background: url(art/2006/p/narco_punk.jpg) 0px 0px no-repeat;
}

#narco_punk a {
display: block;
}

#narco_punk a:hover {
height: 324px;
width: 167px;
background: url(art/2006/p/narco_punk-2.jpg) 0px 0px no-repeat;
}

#paletero {
height: 204px;
width: 258px;
position: absolute; top: 325px; left: 364px;
background: url(art/2006/p/paletero.jpg) 0px 0px no-repeat;
}

#paletero a {
display: block;
}

#paletero a:hover {
height: 204px;
width: 258px;
background: url(art/2006/p/paletero-2.jpg) 0px 0px no-repeat;
}

/* 2005 */

#I290 {
height: 198px;
width: 448px;
position: absolute; top: 20px; left: 20px;
background: url(art/2005/p/290.jpg) 0px 0px no-repeat;
}

#I290 a {
display: block;
}

#I290 a:hover {
height: 198px;
width: 448px;
background: url(art/2005/p/290-2.jpg) 0px 0px no-repeat;
}

#columbus {
height: 225px;
width: 375px;
position: absolute; top: 258px; left: 20px;
background: url(art/2005/p/columbus_comes_to_pilsen.jpg) 0px 0px no-repeat;
}

#columbus a {
display: block;
}

#columbus a:hover {
height: 225px;
width: 375px;
background: url(art/2005/p/columbus_comes_to_pilsen-2.jpg) 0px 0px no-repeat;
}

#wacker {
height: 250px;
width: 342px;
position: absolute; top: 375px; left: 435px;
background: url(art/2005/p/lower_wacker.jpg) 0px 0px no-repeat;
}

#wacker a {
display: block;
}

#wacker a:hover {
height: 250px;
width: 342px;
background: url(art/2005/p/lower_wacker-2.jpg) 0px 0px no-repeat;
}

#support{
height: 315px;
width: 188px;
position: absolute; top: 20px; left: 508px;
background: url(art/2005/p/support_the_troops.jpg) 0px 0px no-repeat;
}

#support a {
display: block;
}

#support a:hover {
height: 315px;
width: 188px;
background: url(art/2005/p/support_the_troops-2.jpg) 0px 0px no-repeat;
}

/* 2004 */

#state {
height: 227px;
width: 296px;
position: absolute; top: 20px; left: 20px;
background: url(art/2004/p/18_State_16AE.jpg) 0px 0px no-repeat;
}

#state a {
display: block;
}

#state a:hover {
height: 227px;
width: 296px;
background: url(art/2004/p/18_State_16AE-2.jpg) 0px 0px no-repeat;
}

#c1952 {
height: 256px;
width: 172px;
position: absolute; top: 20px; left: 356px;
background: url(art/2004/p/1952.jpg) 0px 0px no-repeat;
}

#c1952 a {
display: block;
}

#c1952 a:hover {
height: 256px;
width: 172px;
background: url(art/2004/p/1952-2.jpg) 0px 0px no-repeat;
}

#untitled {
height: 264px;
width: 139px;
position: absolute; top: 20px; left: 568px;
background: url(art/2004/p/Untitled.jpg) 0px 0px no-repeat;
}

#untitled a {
display: block;
}

#untitled a:hover {
height: 264px;
width: 139px;
background: url(art/2004/p/Untitled-2.jpg) 0px 0px no-repeat;
}

#orangeline {
height: 172px;
width: 344px;
position: absolute; top: 324px; left: 30px;
background: url(art/2004/p/Orange_line.jpg) 0px 0px no-repeat;
}

#orangeline a {
display: block;
}

#orangeline a:hover {
height: 172px;
width: 344px;
background: url(art/2004/p/Orange_line-2.jpg) 0px 0px no-repeat;
}

#vatotriste {
height: 185px;
width: 260px;
position: absolute; top: 324px; left: 414px;
background: url(art/2004/p/Vato_Triste.jpg) 0px 0px no-repeat;
}

#vatotriste a {
display: block;
}

#vatotriste a:hover {
height: 185px;
width: 260px;
background: url(art/2004/p/Vato_Triste-2.jpg) 0px 0px no-repeat;
}

/* artwork pages */

/*2009*/

#large_sugarskull {
height: 721px;
width: 700px;
background: url(art/2009/sugarskull.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

/*2008*/

#large_immigrationcup {
height: 452px;
width: 700px;
background: url(art/2008/immigrationcup.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_teammexico {
height: 584px;
width: 700px;
background: url(art/2008/teammexico.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_teamusa {
height: 584px;
width: 700px;
background: url(art/2008/teamusa.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}


#large_sanchupas {
height: 1149px;
width: 700px;
background: url(art/2008/sanchupas.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_pitbull{
height: 710px;
width: 700px;
background: url(art/2008/pitbull_luchador.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_power_lines {
height: 972px;
width: 700px;
background: url(art/2008/power_lines.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}


/*2006*/

#large_aids {
height: 886px;
width: 700px;
background: url(art/2006/aids_poster.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_2006 {
height: 900px;
width: 675px;
background: url(art/2006/cal_2006.jpg) 0px 0px no-repeat;
position: absolute; left: 187px; top: 200px;
z-index: 1
}

#large_2007 {
height: 900px;
width: 682px;
background: url(art/2006/cal_2007.jpg) 0px 0px no-repeat;
position: absolute; left: 184px; top: 200px;
z-index: 1
}

#large_narco {
height: 900px;
width: 465px;
background: url(art/2006/narco_punk.jpg) 0px 0px no-repeat;
position: absolute; left: 293px; top: 200px;
z-index: 1
}

#large_paletero {
height: 553px;
width: 700px;
background: url(art/2006/paletero.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

/* 2005 */

#large_290 {
height: 309px;
width: 700px;
background: url(art/2005/290.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_columbus {
height: 420px;
width: 700px;
background: url(art/2005/columbus_comes_to_pilsen.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_wacker {
height: 513px;
width: 700px;
background: url(art/2005/lower_wacker.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_support {
height: 900px;
width: 538px;
background: url(art/2005/support_the_troops.jpg) 0px 0px no-repeat;
position: absolute; left: 256px; top: 200px;
z-index: 1
}

/* 2004 */

#large_state {
height: 539px;
width: 700px;
background: url(art/2004/18_State_16AE.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_1952 {
height: 426px;
width: 288px;
background: url(art/2004/1952.jpg) 0px 0px no-repeat;
position: absolute; left: 381px; top: 200px;
z-index: 1
}

#large_orange {
height: 352px;
width: 700px;
background: url(art/2004/Orange_line.jpg) 0px 0px no-repeat;
position: absolute; left: 175px; top: 200px;
z-index: 1
}

#large_untitled {
height: 587px;
width: 308px;
background: url(art/2004/untitled.jpg) 0px 0px no-repeat;
position: absolute; left: 371px; top: 200px;
z-index: 1
}

#large_vato {
height: 309px;
width: 432px;
background: url(art/2004/Vato_Triste.jpg) 0px 0px no-repeat;
position: absolute; left: 371px; top: 200px;
z-index: 1
}