/* CSS Document */
/*Author:Jorge Luis Gurrola*/
/* Date of Creation: 7/09/09*/


/*Reset- These are my reset rules, some are acquired and some from Meyers and YUI*/
* {margin:0;padding:0;} /*The mother of all resets.*/
img {border:none;} 

/*this is from YUI - i like it looks clean*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}


/*this is from meyers*/

 div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {

	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}



/* from blueprint*/
 div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}










/*from this kid in england*/

/* RESET */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {  
	margin:0; 
	padding:0; 
} 
table { 
	border-collapse:collapse; 
	border-spacing:0; 
} 
fieldset,img {  
	border:0; 
} 
address,caption,cite,code,dfn,em,strong,th,var { 
	font-style:normal; 
	font-weight:normal; 
} 
ol,ul { 
	list-style:none; 
} 
caption,th { 
	text-align:left; 
} 
h1,h2,h3,h4,h5,h6 { 
	font-size:100%; 
	font-weight:normal; 
} 
q:before,q:after { 
	content:''; 
} 
abbr,acronym {
	border:0; 
}






/*aight these are all the most popular resets-- if you look closely they pretty much look the same across, some are more robust than others, and some conflict-after this line i wil sort the ones that conflict and i feel are more relevent, the cascade will fix the overrides-*/


















/***** Global Classes *****/
 
.clear         { clear:both; }
 
.float-left    { float:left; }
.float-right   { float:right; }
 
.text-left     { text-align:left; }
.text-right    { text-align:right; }
.text-center   { text-align:center; }
.text-justify  { text-align:justify; }
 
.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
 
.wrap          { width:960px;margin:0 auto; }
 
.img-left      { float:left;margin:4px 10px 4px 0; }
.img-right     { float:right;margin:4px 0 4px 10px; }
.img-middle {vertical-align:middle;} /* Vertically align icon with text line */
 
.nopadding     { padding:0; }
.noindent      { margin-left:0;padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }
.nounderline { text-decoration: underline; }
.error {color:#cc0000;}
.padder {
padding:  10px;
}


.gutter {
margin-right:20px;
}



















/*the most important part- typography*/


html{ }
 
body {font:62.5%/1.5em Verdana, Arial, Helvetica, sans-serif; color:#000000;
   }
 
h1{	 font-family: "trebuchet ms",Georgia, "Times New Roman", Times, serif;
font-size:1.75em;
line-height:.6em;
font-weight:bold;
color:#cc0000;

}
h2{	

font-weight:bold;
text-transform:capitalize;
 
 }
h3{	 }
h4{	 }
h5{	 }
h6{	 }
.tagline {
text-transform:uppercase;
font-size:7px;
margin:0;
padding:0;
font-weight:bold;
}

p {

}

/*LINKS
-------------------------------------------------------- */
a {
text-decoration:none;
color:#000000;
}

a:hover {
color:#FF0000;
}


p a{
	color:#000;
}
p a:hover{
	text-decoration:none;
}

h1 a{
	color:#000;
}

h1 a:hover{
	text-decoration:none;
}

li a{
	color:#000;
}

li a:hover{
	text-decoration:none;
}


#cool-background {
background-color:#FF0000;
 
}

#document-container {
width:460px;
margin:0 auto; 
background-color:#efefef;




 
 


	
 

}

#body-wrapper {

}



 

#navigation,#top,#body,#bottom {

background-color:#FFFFFF;
}

.nav-padder{
border-bottom:2px solid #333333;

}

#navigation ul{
display:block;


 

 
}
#top {
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
border-top:1px solid #cccccc;
}

#navigation {

border-top:1px solid #cccccc;
}

#body {
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
border-top:1px solid #cccccc;
border-bottom:1px solid #cccccc;
height:88px;


}

#content {
height:88px;
overflow: hidden;



}


#bottom {
border-left:1px solid #cccccc;
border-right:2px solid #cccccc;
border-bottom:1px solid #cccccc;
}



#navigation ul li {
list-style:none;
float:left;
margin-right:10px;

}

#navigation a:hover {
border-bottom:4px solid #cc0000;
color:#cc0000;
}


.select{
border-bottom:4px solid #cc0000;
color:#cc0000;
}


#version {
font-size:10px;
margin-bottom:3px;
color:#666666;
padding-right:10px;
text-align:right;
}

#content {
/*border:1px solid #cccccc;
padding:10px;*/

}


#my-picture {
border-right:1px solid #cc0000;
padding-right:5px;
display:inline-block;
float:left;
}

#right-content {
border-right:1px solid #cc0000;
float:left;
display:inline-block;
width:295px;
height:90px;
margin-left:5px;
}




#version a {
color:#000000;
}

#version a:hover {
color:#FF0000;
}

#logo {
width:300px;
float:left;
background:url(../images/side_logo_combine.gif) no-repeat 0 0;
padding-left:30px;
height:24px;
}


#logo:hover {
background:url(../images/side_logo_combine.gif) no-repeat 0 -24px;
}




#download-vcard {
float:right;
}

#cool-background {
border-top:1px solid #cccccc;
border-bottom:1px solid #cccccc;
background-color:#FFFFFF;
padding: 5px 0px;

}

#stripes {
background:url(../images/tile_bg.gif) repeat;
}

#padding-horizontal {
margin:0 auto;
background-color:#FFFFFF;
width:480px;
}


span.link-icon a{
display:inline;
background:url(../images/link_icon.jpg) no-repeat 0 0px   ;
padding-left:28px;
height:12px;
line-height:1em;
}

span.link-icon a:hover{
background:url(../images/link_icon.jpg) no-repeat 0 -12px   ;
color:#FF0000;
}

.light-top-bar {
border-top:1px solid #cccccc;
}

.download-v-icon a{
width:28px;
height:20px;
display:inline-block;
background:url(../images/download_v_combined.gif) no-repeat 0 0;
text-indent:-9000px;
}

.download-v-icon a:hover{
 
background:url(../images/download_v_combined.gif) no-repeat 0 -20px;
}

.designer-amp {
font-family:  "georgia","Times New Roman", Times, serif;
font-style:italic;
font-size:12px;
}


#definition-component, #networks-component, #about-component, #contact-component {
height:90px;
margin-bottom:10px;


}

#about-component-section, #networks-component-section {
height:90px;
margin-bottom:10px;
overflow: hidden;
}

#bio-section {
height:90px;
margin-bottom:10px;
}

#resume-section {
height:90px;
margin-bottom:10px;
}

#hobbies-section {
height:90px;
margin-bottom:10px;
}


.component-menu-section {
width:80px;
height:90px;
padding:0 5px;
border-right:1px #cc0000 solid;
float:left;
}


.component-content-section {
float:right;
width:340px;
border-right:1px solid #cc0000;height:90px;
overflow: hidden;
height:90px;
margin-bottom:10px;
}

.individual-section {
height:90px;margin-bottom:10px;
}

 
 #sub-individual-container {
height:90px;
margin-bottom:10px;
overflow: hidden;
}

#sub-individual-container-resume {
height:90px;
margin-bottom:10px;
overflow: hidden;
}


#inner-region {
height:70px;
margin-bottom:10px;
overflow: hidden;
}


 .sub-individual-section {
 
 height:90px;margin-bottom:10px;
 }

.mountain-dew {
background:url(../images/mountain_dew.jpg) no-repeat right 50%;
padding-right:30px;
}

.img-container {
border:1px solid #cccccc;
padding:5px;
width:109px;
height:73px;

}





#my-picture a {
display:inline-block;
width:110px;
height:73px;

background:url(../images/jorgeluisgurrola_combined.gif) no-repeat 0 0px;
}

#my-picture a:hover {
background:url(../images/jorgeluisgurrola_combined.gif) no-repeat 0 -73px;
}

#my-picture a img {
display:none;
}


span.link-bullet a {
display:inline;
background:url(../images/link_bullet.gif) no-repeat 0 0px   ;
padding-left:15px;
height:14px;
line-height:1em;
}

span.link-bullet a:hover {
background:url(../images/link_bullet.gif) no-repeat 0 -14px   ;
}

.pad-left {
margin-left:20px;
}


.gs-60 {width:40px;height:90px;border-right:1px solid #cc0000;float:left;margin-bottom:10px;}
.gs-100 {width:60px;height:90px;border-right:1px solid #cc0000;float:left;margin-bottom:10px;}
.gs-100a {width:40px;height:90px;border-right:1px solid #cc0000;float:left;margin-bottom:10px;padding-left:10px;}
.gs-80 {padding:0 10px;width:120px;height:90px;float:left;}
.gs-200{width:200px;float:left;}
.gs60 {width:10px;float:left;}
.gs140 {width:140px;}
.gs-160 {float:right;width:150px;}
.gs-180 {float:right;width:335px;}
.gs-200a{width:226px;float:left;}
.gs-content {
margin-left:10px;
float:left;
width:260px;
}



.twitter-link a{display:inline-block;background:url(../images/twitter.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.flickr-link a{display:inline-block;background:url(../images/flickr.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.linkedin-link a{display:inline-block;background:url(../images/linkedin.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.facebook-link a{display:inline-block;background:url(../images/facebook.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.readernaut-link a{display:inline-block;background:url(../images/reddit.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.vimeo-link a{display:inline-block;background:url(../images/vimeo.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.delicious-link a{display:inline-block;background:url(../images/delicious.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.technorati-link a{display:inline-block;background:url(../images/technorati.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}

.problog-link a{display:inline-block;background:url(../images/problog.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.smashing-link a{display:inline-block;background:url(../images/smashing_magazine.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.elated-link a{display:inline-block;background:url(../images/elated.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.grid-link a{display:inline-block;background:url(../images/gs.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}
.dwalsh-link a{display:inline-block;background:url(../images/walsh.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}

.aisleone-link a{display:inline-block;background:url(../images/aisleone.png) no-repeat 0 0;padding-left:20px;height:16px;margin-bottom:3px;}



.tb-row {
padding-left:10px;
margin-bottom:5px;
}

.tb-item {
float:left;
padding:1px;
margin-right:5px;
border:1px solid #CCCCCC;
width:62px;
height:31px;
}

.tb-item:hover {
 
border:1px solid #cc0000;
 
}


.last-tb-row {
margin-bottom:5px;
}



.more-section {
text-align:center;
padding:0 10px;
}

.more-section a {
display:inline-block;
height:3px;
width:208px;
background:url(../images/more_bar.gif) no-repeat 0 0;
text-indent:-9000px;
}

.more-section a:hover {
 
background:url(../images/more_bar.gif) no-repeat 0 -3px;
 
}



#scroll-region {
height:90px;
margin-bottom:10px;
overflow: hidden;
}

#download-pdf a{
display:block;
height:40px;
width:240px;
padding:10px;
padding-top:40px;
background-color:#CCCCCC;
text-align:center;
}

#download-pdf a:hover {
background-color:#cc0000;
color:#FFFFFF;
}


#download-doc a{
display:block;
height:40px;
width:240px;
padding:10px;
padding-top:40px;
background-color:#CCCCCC;
text-align:center;
}

#download-doc a:hover {
background-color:#cc0000;
color:#FFFFFF;
}