@import url('undohtml.css');
@import url('lightbox.css');


body
{
	margin: 0;
	padding: 0;
	font-family:Tahoma, Geneva, Arial, Verdana, Helevetica, sans-serif;
	font-size: small;
	background-color:#cccccc;
	background: #333333 url(../images/body-bg.gif) 0 140px repeat-x;
	color:#CCCCCC;
	text-align: center;

	width:100%;
color:#003366;
}
p
{
padding:1em;

}

/*for jquery class added on the fly*/
.active
{
background-position:left;
}
.padding
{

}
.hide-text
{

}
.loader
{
font-size:120%;
text-align:center;
color:#fff;
}
#scroll-box
{

}
ul.thumbnails 
{
width:100%;
margin:auto;
padding:.25em;
clear:both;
}
.thumbnails li
{
display:inline;
float:left;
margin:3px;
padding:1em;
height:180px;

}
.thumbnails li:hover
{




}


a
{
color:#666666;
cursor:pointer;
}
a:hover
{
color:#000;
}
h1
{
display:block;
background:url(../images/rperez-logo.gif) top left no-repeat;
width:239px;
height:40px;
margin-left:120px;
text-indent:-9999em;
}

#wrapper 
{
	width:100%;
	margin: 0 auto;
	font-size: 95%; /* slight adjustment */
	text-align: left;
	min-width:900px;

}
#wrapper #mast-head 
{
clear:both;
margin:auto;
width:100%;
background:url(../images/header.jpg) bottom right no-repeat;
height:108px;

}
#wrapper #navigation 
{
float:left;
clear:both;
background:url(../images/nav-bg.gif) top left repeat-x;
width:100%;
height:33px;
}
#wrapper #navigation ul 
{
width:814px;
margin:auto;
text-transform:uppercase;
}
#wrapper #navigation ul li 
{

float:left;
display:inline;
padding:.75em 1em;

}

#wrapper #content 
{
width:814px;
margin:0 auto;

}


.websites #decorative-element
{
width:814px;
background:url(../images/web-design-heading.jpg) top left no-repeat;
margin:0 auto;
height:213px;
display:block;
clear:both;
}

.digital-art #decorative-element
{
width:814px;
background:url(../images/digital-art-heading.jpg) top left no-repeat;
margin:0 auto;
height:213px;
display:block;
clear:both;
}
.contact #decorative-element
{
width:814px;
background:url(../images/contact-heading.jpg) top left no-repeat;
margin:0 auto;
height:213px;
display:block;
clear:both;
}


#decorative-element
{
width:814px;
background:url(../images/content-heading.jpg) top left no-repeat;
margin:0 auto;
height:213px;
display:block;
clear:both;
}
#data
{
width:814px;
background:url(../images/bottom-container-2.gif) no-repeat 3px bottom;
float:left;

margin:0 auto;
color:#444;
position:relative;
padding:0;
z-index:1;
}

#data h2
{
background:url(../images/top-container.jpg) no-repeat top left;
/*height:33px;*/
padding:1em 1em;
color:#333333;
font-size:130%;
text-transform:capitalize;
}

#data p
{
clear:none;
font-size:120%;
color:#333333;
}
#data p.dec
{
font-size:100%;
width:20%;
display:block;
float:left;
clear:none;
padding:1em 1em;
margin-left:1em;
padding-bottom:40px;
background:url(../images/para-corner.gif) no-repeat bottom right;



}
#data ul.skills
{
width:30%;
display:block;
margin:0 5em;
margin-top:-40px;
list-style:none;
padding:1.5em;
float:left;

}
#data ul.skills li
{
display:block;

padding:3%;
width:100%;
background:url(../images/bullet.gif) top left no-repeat;
padding-left:20px;
height:3em;


}

/*Start next buttons*/
#gallery-nav
{
width:100%;

margin:auto;
text-align:center;
clear:both;
}

#left
{
margin-left:170px;
display:block;
float:left;
width:49px;
height:23px;
text-indent:-9999em;
background:url(../images/prev-arrow.gif) top right no-repeat;
}
#left:hover
{
background-position:left;
}

#right
{
display:block;
width:49px;
height:23px;
text-indent:-9999em;
background:url(../images/next-arrow.gif) top right no-repeat;
float:left;
}
#right:hover
{
background-position:left;
}


/*End next buttons*/
#wrapper #footer 
{
clear:both;
margin:auto;
text-align:center;
width:100%;
background:url(../images/jquery.jpg) bottom center no-repeat;
height:280px;
}
#wrapper #footer a
{
color:#FFFF99;
}
#wrapper #footer a:hover
{
color:#FFFF00;
}
#footer p img
{

}
/*interact sytles*/

#button
{
display:block;
background:url(../images/close-tab.gif) top left no-repeat;
width:149px;
height:25px;
clear:both;
margin-left:400px;
margin-top:-10px;
z-index:3;
float:left;
}



/*Form styles*/
/*
fieldset
{
border:none;
}
fieldset div
{
width:99.9%;
padding:.25em;

}
div label
{
width:49%;
text-align:right;
float:left;
display:inline;
}
div input
{
width:49%;
text-align:left;
display:inline;
}
fieldset div img
{
display:block;
clear:both;
margin-left:49%;
}

input#B2 , input#submit
{
padding:.5em;
color:#fff;
width:120px;
margin:.5em;
background-color:#222;
border:3px solid #000;
cursor:pointer;
}

input#B2:hover , input#submit:hover
{
background-color:#000;
border:3px solid #222;
color: #555;
}
*/
#data p a
{
display:block;
float:right;
background:url(../images/pdf-file-logo-icon.gif) top left no-repeat;
height:100px;
width:200px;
padding-left:35px;
padding-top:10px;
}

fieldset, form
{
width:80%;
margin:1em auto;
border:none;
clear:both;
padding:20px;

}
fieldset
{
background:url(../images/body-bg.gif) 0 -10px repeat-x;

}
label
{
display:block;
float:left;
width:100px;
margin:10px;
}
fieldset div img
{
display:block;
clear:both;
text-align:left;
padding:20px;
padding-left:130px;
}
input, textarea
{
border:1px solid #CCCCCC;
padding:2px;
margin:10px;
background:url(../images/body-bg.gif) 0 -30px repeat-x;
}
input[type="submit"], input[type="reset"]
{
margin-top:1em;
background:url(../images/button-sprite.gif) top right no-repeat;
width:151px;
height:49px;
border:none;
cursor:pointer;
}
input[type="submit"]:hover, input[type="reset"]:hover
{
background-position: top left;
}


#next
{
background:url(../images/next-prev-button.gif) top right no-repeat;
width:75px;
height:40px;
display:block;
padding-top:3px;
padding-bottom:3px;
float:left;
}
#prev
{
background:url(../images/next-prev-button.gif) top right no-repeat;
width:75px;
height:40px;
display:block;
float:left;
padding-top:3px;
padding-bottom:3px;
clear:both;
}
#prev:hover, #next:hover
{
background-position:top left;
}
#scroll-nav
{
width:162px;
margin:auto;
clear:both;
}
#scroll-box
{
clear:both;

}