/********************************************
* Joe Ray
*
* Created 3/15/2010- Estudio Ray
*
* General Style Definitions
********************************************/

/*******************************************
* Browser Reset - Created by Eric Meyer
*******************************************/

html, body, 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: Verdana, Helvetica, Arial, sans-serif;
	vertical-align: baseline;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

a img { border: none; }


/*******************************************
* Typography - Pulled from BlueprintCSS
*******************************************/


/* Text Elements
-----------------------------*/

h1,h5,h6 { 
    color: #333; 
    font-family: Verdana, Helvetica, Arial, sans-serif;    
}

h1,h2,h3,h4,h5,h6 { font-weight: bold; }

h1 { font-size: 14px; line-height: 14px; margin-top: 10px; margin-bottom: -7px; }
h2 { font-size: 14px; margin-bottom: 5px; margin-top: 0.75em; color: #333; }
h3 { font-size: 12px; margin-bottom: 5px; margin-top: 0.75em; color: #333; }
h4 { font-size: 1.05em; line-height: 1.25; margin-bottom: 1.25em; color: #005b6b; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

p           { margin: 0 0 1em; font-size: 12px; line-height: 1.2em;}
p.last      { margin-bottom: 0; }
p img       { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.top   { margin-top: 0; } /* Use this if the image is at the top of the <p>. */
img         { margin: 0 0 0 0; }

a:focus, 
a:hover     { color: #cb2000; text-decoration: none; }
a           { color: #cb2000; outline: none; }

ul, ol      { margin:0 1.5em 1.5em 2.5em; color: #333; font-size: 12px; }
ul          { list-style-type: square; }
ol          { list-style-type: decimal; }
dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

/*********************************
* Layout Definitions
*********************************/

.header {
    height: 82px;
    margin: 0 auto;
    background: url(../images/nav_bg.jpg) top center repeat-x;
}

#container {
    margin: auto;
    width: 900px;
	width/**/:/**/ 710px;
	overflow: hidden;
    color: #333;
	padding: 0 95px 0 95px;
}
#container2 {
	margin: auto;
    
    width: 900px;
	width/**/:/**/ 710px;
	overflow: hidden;
    color: #333;
	padding: 0 80px 0 115px;
}

a#logo img {
    width: 370px;
    height: 137px;
    display: block;
	float: left;
	padding-left: 113px;
	overflow: hidden;
}

.content-main {
    float: left;
    clear: left;
    width/**/:/**/ 622px;
	width: 606px;
    padding: 0 52px 0 52px;
}

.content-main {
    font-size: 18px;
}

.copy {
    float: left;
	clear: left;
	width: 475px;
	margin-top: 15px;
	margin-bottom: 25px;
	margin-left: 115px;
}

.content {
    margin: 0 auto;
    width: 710px;
	overflow: hidden;
    color: #333;
	text-align: center;
	float: left;
	clear: left;
}


.image {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.slide {
    width: 710px;
	margin: 0 auto;
	height: 410px;
	display: block;
	overflow: hidden;
}

.icons {
	display: block;
	float: left;
	clear: both;
	width: 700px; 
	margin-left: 50px;
	margin-top: 50px;
}

.notecards {
    float: left;
	margin-left: 50px;
	width: 198px;
}

.notecards a, .wallpaper a, .contact a {
    font-size: 12px;
}

.wallpaper {
    float: left;
	width: 210px;
}

.contact {
    float: left;
	width: 198px;
}

.left-button {
    float: left;
	display: block;
	margin-top: 110px;
	margin-right: 25px;
}

.right-button {
    float: left;
	display: block;
	margin-top: 110px;
	margin-left: 25px;
}

.left-button2 {
    float: left;
	display: block;
	margin-top: 175px;
	margin-right: 25px;
}

.right-button2 {
    float: left;
	display: block;
	margin-top: 175px;
	margin-left: -7px;

}
.right-button-wide {
    float: left;
	display: block;
	margin-top: 110px;
	margin-left: 0px;
}

.photo {
 	display: block;
	overflow: hidden;
	float: left;
	margin-right:30px;
}


.photo2 {
 	display: block;
	overflow: hidden;
	float: left;
	margin-right:50px;
	
}
.button {
 	display: block;
	overflow: hidden;
	float: left;
	clear: left;
	padding-left: 300px;
}

.copy-images {
	width: 700px;
	display: block;
    float: left;
}

.copy-images-thin {
	width: 700px;
	display: block;
    float: left;
	margin-left: 200px;
}.copy-images-bigg {
	width: 700px;
	display: block;
    float: left;
	margin-left: 38px;
}

.copy-images-narrow {
	width: 700px;
	display: block;
    float: left;
	margin-left: 169px;
}
.copy-images-narrow11 {
	width: 700px;
	display: block;
    float: left;
	margin-left: 228px;
}

.copy-images-narrow2 {
	width: 700px;
	display: block;
    float: left;
	margin-left: 97px;
}
.copy-images-narrow3 {
	width: 700px;
	display: block;
    float: left;
	margin-left: 70px;
}

.copy-images-square {
	width: 700px;
	display: block;
    float: left;
	margin-left: 125px;
}

.copy-images-wide {
	width: 700px;
	display: block;
    float: left;
	margin-left: 100px;
}

.copy-images-narrow4 {
	width: 700px;
	display: block;
    float: left;
	margin-left: 155px;
}

.numbering {
    background: url(../images/scribble.gif) top center no-repeat;
	display: block;
	width: 461px;
	height: 72px;
	margin-top: 0px;
	margin-bottom: 0px;
	float: left; 
	clear: both;
	margin-left: 125px;
	margin-right: 125px;	
}

.numbering p {
    margin-top: 30px;
	color: #cb2000;
}

.numbering p a {
    margin-top: 30px;
	color: #444444;
	text-decoration: none;
}

.selected {
    text-decoration: underline;
}

.paper {
    background: url(../images/paper.gif) top center no-repeat;
	display: block;
	width: 363px;
	height: 128px;
	margin-top: 0px;
	margin-bottom: 0px;
	float: left; 
	clear: left;
	margin-left: 175px	
}

.paper p {
 margin-top: 15px;
}

.paper2 {
	display: block;
	width: 363px;
	height: 128px;
	margin-top: 0px;
	margin-bottom: 0px;
	float: left; 
	clear: left;
	margin-left: 175px	
}

.paper2 p {
 margin-top: 15px;
}

.xico {
    margin-top: -100px;
	margin-right: 0px;
	float: right;
	display: block;
    padding: 0;
	float: right;
}




/*********************************
* Lists
*********************************/

.content-main ul { 
    margin: 0 0 10px 1px;
    padding-left: 15px;
}

.content-main ul li {
    background: url(../images/bullet.gif) 0 8px no-repeat;
    padding-left: 15px;
    padding-top: 3px;
    color: #333;
    font-size: 16px;	
}

/*********************************
* Footer Definitions
*********************************/

.footer {
    margin: 0 auto;
	width: 710px;
	display: block;
	overflow: hidden;
	padding-bottom: 30px;
	float: left;
	clear: left;
	width: 710px;
}

.footer p {
    margin-top: 15px;
	color: #333;
	font-size: 11px;
}

.footer p a {
	color: #333;
	font-size: 11px;
	text-decoration: none;
}

/*********************************
* Main Navigation
*********************************/

#nav {
    width: 710px;
    height: 28px;
	margin: 0 auto;
	padding-top: 16px;
}

#nav li {
    display: inline;
    list-style: none;
    float: left;
}

#nav a {
    display: block;
    text-indent: -9999px;
    height: 28px;
    overflow: hidden;
}

a#home {
    background:  url(../images/nav_home.jpg) top right no-repeat;
    width: 68px;
}
a#el-artist {
    background:  url(../images/nav_el_artist.jpg) top right no-repeat;
    width: 101px;
}
a#galleries {
    background:  url(../images/nav_galleries.jpg) top right no-repeat;
    width: 95px;
}
a#contacto {
    background:  url(../images/nav_contacto.jpg) top right no-repeat;
    width: 100px;
}
a#nuevo-show {
    background:  url(../images/nav_nuevo_show.jpg) top right no-repeat;
    width: 123px;
}
a#blog {
    background:  url(../images/nav_blog.jpg) top right no-repeat;
    width: 116px;
}
a#news {
    background:  url(../images/nav_news.jpg) top right no-repeat;
    width: 107px;
}

a:hover#home, body#home-on #home,
a:hover#el-artist, body#el-artist-on #el-artist,
a:hover#galleries, body#galleries-on #galleries,
a:hover#contacto, body#contacto-on #contacto,
a:hover#nuevo-show, body#nuevo-show-on #nuevo-show,
a:hover#blog, body#blog-on #blog,
a:hover#news, body#news-on #news {
    background-position: bottom right;
}

/*********************************
* Secondary Navigation
*********************************/

#subnav {
    height: 21px;
	width: 710px;
	margin: 0 auto;
	padding-top: 16px;
	float: left;
	clear: left;
	margin-bottom: 45px;
	margin-left: 40px;
}

#subnav li {
    display: inline;
    list-style: none;
    float: left;
	padding: 0;
}

#subnav a {
    display: block;
    text-indent: -9999px;
    height: 21px;
    overflow: hidden;
}

/*********************************
* JavaScript
*********************************/

#main {
    background-image:url(i/wrapper_background.jpg);
    background-repeat:repeat-y;
    padding-left:45px;
    padding-bottom:25px;
}

.thumb {
    width:179px;
    height:108px;
    background-color:#e5e3db;
    margin: 0px 5px 14px 14px;
    float:left;
    display:inline;
    border: 2px solid #cba85e;
}
	
.thumb_container {
    width:620px;
    padding-top:5px;
}

/*******************************************
* Titles & Headers
*******************************************/


#ttl-nuevo-show {
    width: 223px;
    height: 73px;
    text-indent: -9999px;
    margin-bottom: 30px;
	margin-top: 5px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/ttl_nuevo_show.gif) top left no-repeat;
}

#ttl-wallpaper {
    width: 258px;
    height: 75px;
    text-indent: -9999px;
    margin-bottom: 0px;
	margin-top: 50px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/ttl_wallpaper.gif) top left no-repeat;
}

#ttl-news-events {
    width: 225px;
    height: 64px;
    text-indent: -9999px;
    margin-bottom: 30px;
	margin-top: 50px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/ttl_news_events.gif) top left no-repeat;
}

#ttl-galleries {
    width: 157px;
    height: 58px;
    text-indent: -9999px;
	margin-top: 15px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/ttl_galleries.gif) top left no-repeat;
}

#ttl-notecards {
    width: 176px;
    height: 65px;
    text-indent: -9999px;
    margin-bottom: 0px;
	margin-top: 45px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/ttl_notecards.gif) top left no-repeat;
}

#ttl-blog {
    width: 174px;
    height: 61px;
    text-indent: -9999px;
    margin-bottom: 0px;
	margin-top: 45px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/ttl_blog.gif) top left no-repeat;
}

#ttl-de-norte-a-sur {
    width: 494px;
    height: 59px;
    text-indent: -9999px;
    margin-bottom: 0px;
	margin-top: 45px;
	display: block;
    margin-left: auto;
    margin-right: auto;
    background: url(../images/ttl_de_norte_a_sur.jpg) top left no-repeat;
}

/*********************************
* Secondary Navigation
*********************************/

a#corazones {
    background:  url(../images/subnav_corazones.gif) top right no-repeat;
    width: 120px;
}
a#sirenas {
    background:  url(../images/subnav_sirenas.gif) top right no-repeat;
    width: 102px;
}
a#angeles {
    background:  url(../images/subnav_angeles.gif) top right no-repeat;
    width: 99px;
}
a#grandes {
    background:  url(../images/subnav_grandes.gif) top right no-repeat;
    width: 105px;
}
a#romanticos {
    background:  url(../images/subnav_romanticos.gif) top right no-repeat;
    width: 134px;
}
a#pepe {
    background:  url(../images/subnav_pepe.gif) top right no-repeat;
    width: 51px;
}
a#luchadores {
    background:  url(../images/subnav_luchadores.gif) top right no-repeat;
    width: 129px;
}
a#los-beaches {
    background:  url(../images/subnav_los_beaches.gif) top right no-repeat;
    width: 143px;
}
a#suenos {
    background:  url(../images/subnav_suenos.gif) top right no-repeat;
    width: 101px;
}
a#vino {
    background:  url(../images/subnav_vino.gif) top right no-repeat;
    width: 75px;
}
a#birds {
    background:  url(../images/subnav_birds.gif) top right no-repeat;
    width: 85px;
}
a#otros {
    background:  url(../images/subnav_otros.gif) top right no-repeat;
    width: 78px;
}
a#muertos {
    background:  url(../images/subnav_muertos.gif) top right no-repeat;
    width: 99px;
}


a:hover#corazones, body.corazones-on #corazones,
a:hover#sirenas, body.sirenas-on #sirenas,
a:hover#angeles, body.angeles-on #angeles,
a:hover#grandes, body.grandes-on #grandes,
a:hover#romanticos, body.romanticos-on #romanticos,
a:hover#pepe, body.pepe-on #pepe,
a:hover#luchadores, body.luchadores-on #luchadores,
a:hover#los-beaches, body.los-beaches-on #los-beaches,
a:hover#suenos, body.suenos-on #suenos,
a:hover#vino, body.vino-on #vino,
a:hover#birds, body.birds-on #birds,
a:hover#otros, body.otros-on #otros,
a:hover#muertos, body.muertos-on #muertos {
    background-position: bottom right;
}