/*  
Theme Name: Hectorquinones.com v1
Description: Hector Quinones portfolio
Version: 3
Author: Hector Quinones
Author URI: http://hectorquinones.com/

	This theme was designed and built by Hector Quinones

*/

/* Begin Typography & Colors */


/*******************************global styles**************************/

html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset {

	margin: 0;
	padding: 0;
	border: 0;

}

/*hide from IE mac \*/
html {
	min-height: 100%;
	margin-bottom: 1px;
}

/*end hide from IE mac \*/

* {

	margin: 0;
	padding: 0;
}

body {
	background-color:#2C150F;
	margin:0px;
}

body, td, th {

	font:80%/1.5 "Lucida Grande", Geneva, Verdana, Arial, Helvetica, sans-serif;
	color:#663300;

}

.clear {clear:both;}

#headerBG {

margin-top: 0px;
background-image: url(images/Bg_Heading.jpg);
background-repeat: repeat-x;
height:160px;

}

#header, #page, #footer-content {

margin:auto;
width:955px;

}


#pageBG{
margin-top:135px;
background-image: url(images/Bg_paper.jpg);
background-repeat: repeat;
}

#page {

z-index:100;
margin-top: -155px;
padding-top:25px;
}

#header{
height:165px;
}

#logo{
float:left;
}

#logo h1{
text-indent:-99999px;
margin-bottom:-45px;
width:315px;
height:68px;
}

#logo img{
border:none;
}

p.description {
text-indent:-99999px;
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:10px;
}

div.pages {
float:right;
margin-top:37px;
}

/*******************************main nav styles**************************/
ul#MainNav {
border: 0;
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
clear: left;
}

ul#MainNav li {
display: block;
float: left;
text-align: center;
padding: 0;
margin: 0;
margin-right: 8px;
}

ul#MainNav li a  {
outline: none;
border-left: none;
height: 30px;
padding: 0;
margin: 0px;
text-indent:-9999px;
display: block;  
}

ul#MainNav li.page-item-5 a  {
width:75px;
background-image:url(images/btn-home.gif);
}

ul#MainNav li.page-item-5 a:hover  {
width:75px;
background-image:url(images/btn-on-home.gif);
}

ul#MainNav li.current_page_item.page-item-5 a {
width:75px;
background-image:url(images/btn-on-home.gif);
}

ul#MainNav li.page-item-11 a  {
width:75px;
background-image:url(images/btn-about.gif);
}

ul#MainNav li.page-item-11 a:hover  {
width:75px;
background-image:url(images/btn-on-about.gif);
}

ul#MainNav li.current_page_item.page-item-11 a {
width:75px;
background-image:url(images/btn-on-about.gif);
}

ul#MainNav li.page-item-12 a  {
width:101px;
background-image:url(images/btn-portfolio.gif);
}

ul#MainNav li.page-item-12 a:hover  {
width:101px;
background-image:url(images/btn-on-portfolio.gif);
}

ul#MainNav li.current_page_item.page-item-12 a {
width:101px;
background-image:url(images/btn-on-portfolio.gif);
}

ul#MainNav li.page-item-13 a  {
width:69px;
background-image:url(images/btn-contact.gif);
}

ul#MainNav li.page-item-13 a:hover  {
width:69px;
background-image:url(images/btn-on-contact.gif);
}

ul#MainNav li.current_page_item.page-item-13 a {
width:69px;
background-image:url(images/btn-on-contact.gif);
}

/*******************************content styles**************************/
#content{
float:left;
width: 613px;
}

#content a, a:active{
color: #660000;
text-decoration:none;
border-bottom: 1px dotted #660000;
}


#content a:hover{
color: #FF4246;
border-bottom: 1px dotted #FF4246;
}

#content a.IMGLink  , a:active.IMGLink {
text-decoration:none;
border-bottom:none;
}

#content h2{
font-family: "Times New Roman", Times, serif;
font-size: 24px;
color: #660000;
font-weight: lighter;
border-bottom:1px dotted #660000;
margin-bottom:10px;

}

#content h2 span{
font-family:"Lucida Grande", Geneva, Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}

#content h3{
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	color: #660000;
	font-weight: lighter;
}

#content h3 a, #content h3 a:active  {
color: #660000;
}

#content p{
margin:0px 0px 15px;
}

#content p#pieceBio {
float:left;
margin-top:-15px;
width:300px;
font-size:11px;
}

#content p#pieceSpecs {
float:right;
margin-top:-15px;
width:298px;
font-size:11px;
}

#content ul{
margin-bottom: 20px;
}

#content ul li{
margin:0px 2px 5px;
list-style:none;
padding-left: 20px;
background: url(images/img-bullet.gif) no-repeat 2px 4px;
}

#content ul.workLink{
	clear:both;
	margin-top: -10px;
}

#content ul.workLink  li a, li a:active{
color: #660000;
text-decoration:none;
border-bottom:none;
}

#content ul.workLink li a:hover{
color: #FF4246;
}

#content ul.Link-PortBio  li{
float: left;
width:150px;
}

#content ul.Link-PortBio  li a, li a:active{
float: left;
color: #660000;
text-decoration:none;
border-bottom:none;
}

#content ul.Link-PortBio li a:hover{
color: #FF4246;
}

#content p.postmetadata {
padding-bottom:10px;
border-bottom:1px dotted #660000;
}

.img-holder1{
padding:4px;
background-color:#D6C5AB;
border:1px solid #a59683;
}

div.img-holder1{
margin-bottom:10px;
}

/*******************************side bar styles**************************/
#sidebar{
position:relative;
margin-left: 25px;
float:right;
width: 282px;
}

#sidebar ul li{
width:210px;
list-style-type:none;
padding:0px 10px 20px 5px;

}

#sidebar ul li a, #sidebar ul li a:active{
color:#FFFFFF;
text-decoration:none;

}

#sidebar ul li a:hover{
color:#E9D514;
text-decoration:none;

}

.sidebar-RepBG{
position:relative;
background-image: url(images/sidebar-BGRepeat.gif);
background-repeat:repeat-y;
width:282px;
background-position:0px 300px;
}

.sidebar-TopBG{
position:relative;
top:-20px;
padding:50px 25px 25px;
background-image: url(images/sideBar-TopBG.gif);
background-repeat: no-repeat;
width:282px;
}

.sidebar-BottomBG{
background-image: url(images/sideBar-bottomBG.gif);
background-repeat:no-repeat;
width:282px;
height:6px;
}

#sidebar h2.cat1{
margin-left:-5px;
text-indent:-9999px;
background-image: url(images/h2-WorkPortfolio.gif);
width:230px;
height:38px;
}

#sidebar h2.cat2{
margin-left:-5px;
text-indent:-9999px;
background-image: url(images/h2-WebTutorials.gif);
width:230px;
height:38px;
}

#sidebar h2.cat3{
margin-left:-5px;
text-indent:-9999px;
background-image: url(images/h2-WebResources.gif);
width:230px;
height:38px;
}

#searchBox div{
margin: 10px 0 0;
padding: 0;
border: 0;
}

#searchBox form input{
font-size:14px;
padding:3px;
width:164px;
background-color: #EED0A4;
border: 2px inset #EED0A4;
}

#searchBox form input#searchsubmit {
color:#FFFFFF;
font-size:10px;
left:150px;
width:50px;
background-color:#820000;
border:solid 1px #E9D514;

}

#searchBox form input#searchsubmit:hover {
background-color: #CC0000;

}

/*****************Comment Form************************/

form.commentform{
height:400px;
}
.commentform textarea{
	width:480px; 
}

.commentform input {
	height:20px; 
}

.commentform input,
.commentform textarea,
.commentform select { 
	padding:3px;
	background:#660000;
	border: 1px inset #000000; 
	vertical-align:top;
	color:#FFFFFF;
}

.commentform input#author{
background-image: url(images/bg-contactForm.gif);
background-position: 0px 0px;
}

.commentform input#email{
background-image: url(images/bg-contactForm.gif);
background-position: 0px -32px;
}

.commentform input#url{
background-image: url(images/bg-contactForm.gif);
background-position: 0px -62px;
}
.commentform textarea#comment{
background-image: url(images/bg-contactForm.gif);
background-position: 0px -92px
}

.commentform input:hover,
.commentform textarea:hover,
.commentform select:hover,.commentform input#author:hover,.commentform input#email:hover,.commentform input#url:hover, .commentform textarea#comment:hover	{
	color:#000000;
	background:#FEF4EB; 
}

.commentform input:focus,
.commentform textarea:focus,
.commentform select:focus,.commentform input#author:focus,.commentform input#email:focus,.commentform input#url:focus, .commentform textarea#comment:focus	{ 
	color:#000000;
	background:#FFFFFF; 
}
/*   FORM submit button                               */

.commentform input#submit	{
position:relative;
	width:120px;
	height:37px;
	color:#FFFFFF;
	border:none!important;
	background: url(images/btn-send.gif);
	padding-bottom: 10px;
	padding-left: 1px;
}

.commentform input#submit:hover	{
	width:114px;
	height:30px;
	padding-bottom: 3px;
	top:5px;
	background-image: url(images/btn-send-roll.gif);
}

/*******************************footer styles**************************/

#footer {
clear:both;
background-color:#2C150F;
border-top:3px solid #E9D514;
background-image: url(images/BG_footer.jpg);
background-repeat: no-repeat;
}

#footer-content {min-height: 325px; height: 100%;}

#footerNav h2 {color:#ffffff}

.footcol { color: #ffffff; width: 195px; float: left; position: relative; top: 25px; height: 100%; margin: 0 0 10px 0px;}

.footcol1 { color: #ffffff; width: 195px; float: left;  position: relative; top: 25px; height: 100%; margin: 0 0 10px 57px;}

.footcol2 { color: #ffffff; width: 195px; float: left;  position: relative; top: 25px; height: 100%; margin: 0 0 10px 57px;}

.footcol3 { color: #ffffff; width: 195px; float: left;  position: relative; top: 25px; height: 100%; margin: 0 0 10px 57px;}

.footcol ul li{ list-style:none; border-bottom: 1px dotted #4F2700; width:185px; padding: 2px 5px;}

.footcol1 ul li{ list-style:none; border-bottom: 1px dotted #4F2700; width:185px; padding: 2px 5px; } 

.footcol2 ul li{ list-style:none; border-bottom: 1px dotted #4F2700; width:185px; padding: 2px 5px;}

.footcol3 ul li{ list-style:none; border-bottom: 1px dotted #4F2700; width:185px; padding: 2px 5px;}

.footcol ul li a, .footcol ul li a:link, .footcol ul li a:visited, .footcol1  ul li a, .footcol1 ul li a:link, .footcol1 ul li a:visited, .footcol2 ul li a, .footcol2 ul li a:link, .footcol2 ul li a:visited, .footcol3 ul li a, .footcol3 ul li a:link, .footcol3 ul li a:visited, .footer ul li a, .footer ul li a:link, .footer ul li a:visited { color: white; text-decoration: none;}

.footcol ul li a:hover, .footcol1 ul li a:hover, .footcol2 ul li a:hover, .footcol3 ul li a:hover, .footer ul li a:hover { color: #E9D514;}





/* End Various Tags & Classes*/

/* "Art for art's sake, with no purpose, for any purpose perverts art. But art achieves a purpose which is not its own." Benjamin Constant */