/*
	Astral 1.0 by HTML5 Up!
	html5up.net | @n33co
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

@charset 'UTF-8';

@font-face {
	font-family: 'OstrichSansBlack';
	src: url('fonts/ostrich-black-webfont.eot');
	src: url('fonts/ostrich-black-webfont.eot?#iefix') format('embedded-opentype'),  url('fonts/ostrich-black-webfont.woff') format('woff'),  url('fonts/ostrich-black-webfont.ttf') format('truetype'),  url('fonts/ostrich-black-webfont.svg#OstrichSansBlack') format('svg');
	font-weight: normal;
	font-style: normal;
}
/*********************************************************************************/
/* Basic                                                                         */
/*********************************************************************************/

	*
	{
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}





		body
		{
			
			background-repeat:no-repeat;
			 margin: 0; padding:0; 
			left: 0;
			top: 0;
		
			height: 100%;
			
           background: url('images/fondo.gif');
		    background-image: url('images/fondo.gif');
			/*z-index: -1;
			
			
				Default background is a weird gradient so I've set it to stretch to
				100% in both directions. If you replace it with a photo or something,
				set background-size to "cover".
			*/

			
			background-size:cover;
		}

		/*
			The pseudo element below applies a noise pattern to the background image. It's
			meant to help mask blurriness, but you can remove it if you don't like it.
		*/

	body, input, textarea
	{
		font-family: 'Source Sans Pro', sans-serif;
		font-weight: 400;
		color: #CCCCCC;
	}
	
	strong, b
	{
		font-weight: 500;
		color: #F3F18C;
	}

	h1, h2, h3, h4
	
	{
		font-weight: 500;
		color: #F3F18C;
	}
	
	
	h5, h6 
	{
	font-weight: 500;
		color: #FFFFFF;
	CCCCCC
	}
	
	
	blockquote
	{
		border-left: solid 0.5em #ddd;
		padding: 1em 0 1em 2em;
		font-style: italic;
	}
	
	em, i
	{
		font-style: italic;
	}
	
	hr
	{
		border: 0;
		border-top: solid 1px #ddd;
		padding: 1.5em 0 0 0;
		margin: 1.75em 0 0 0;
	}
	
	

		
	
	
	sub
	{
		position: relative;
		top: 0.5em;
		font-size: 0.8em;
	}
	
	sup
	{
		position: relative;
		top: -0.5em;
		font-size: 0.8em;
	}
	
	
	

	table.style1
	{
		width: 100%;
	}
	
		table.style1 tbody tr:nth-child(2n+2)
		{
			background: #240048;
		}
		
		table.style1 td
		{
			padding: 0.5em 1em 0.5em 1em;
		}
		
		table.style1 th
		{
			text-align: left;
			font-weight: 400;
			padding: 0.5em 1em 0.5em 1em;
		}
	
		table.style1 thead
		{
			background: #240048;
			color: #fff;
		}
		
		table.style1 tfoot
		{
			background: #eee;
		}
		
		table.style1 tbody
		{
		}
		
	
	form
	{
	padding: 0em 0em 0em 0em;
	}
	
	
	
	
	
		form input.text,
		form select,
		form textarea,
		form datalist
		{
			border: 0;
			background:  #24016B;
			padding: 0.65em;
			width: 45%;
			  -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    -khtml-border-radius: 7px;
    border-radius: 7px;
			
			
		}

		form input.button,
		form input.text,
		form input,
		form select,
		form textarea
		{
				  -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    -khtml-border-radius: 7px;
    border-radius: 7px;
			
		}
		
		
		form input:focus,
		form select:focus,
		form textarea:focus
		form datalist:focus
		{
			background: #24016B;
		}

		form ::-webkit-input-placeholder
		{
			color: #F76155;
		}

		form :-moz-placeholder
		{
			color: #24016B;
		}

		form ::-moz-placeholder
		{
			color: #24016B;
		}

		form :-ms-input-placeholder
		{
			color: #F76155;
		}		


	
	#container {
	

	margin-top:20px;
	margin-bottom:-6px;
	width: 100%;
}
#contact-us {
	
}
#contact-mid {

padding: 0 4px;
	font: normal 12px Tahoma, Verdana, Arial;
	letter-spacing: 0.1em;
	margin-bottom:-12px;
}
#your-name, #your-email2, #your-message {
	position: absolute;
	margin: 8px 0 0 6px;
	background: #24016B;
	
}

#response
	{   position:relative;
		font-weight: 800;
		font-size:large;
		text-align:right;
		color: #FF0000;
		margin: 0em 1 0em 1em;
	}
.input-box, .text-box {
	
	
	padding: 5px;
background: #24016B;
	border: none;
   letter-spacing: 0.1em;
}

.text-box {
	background: #24016B;
	
}
	
	
	
	
	
	
			

	br.clear
	{
		clear: both;
	}
	
	p, ul, ol, dl, table, blockquote
	{
		margin-bottom: 2em;
		letter-spacing:0.016em;
	}
	
	section,
	article
	{
		margin-bottom: 2em;
		
		
	}
	
	section > :last-child,
	article > :last-child
	{
		margin-bottom: 0;
	}

	section:last-child,
	article:last-child
	{
		margin-bottom: 0;
	}

	.image
	{
		display: inline-block;
	}
	
		.image img
		{
			display: block;
			width: 100%;
		}

	.image-full
	{
		display: block;
		width: 100%;
		margin: 0 0 2em 0;
	}
	
	.image-producto
	{
		float: left;
		margin: 0em 1.2em 0.5em 0em;
		border: #FFFFFF;
		border-width:3px;
		
		margin-top: 20px;
		margin-right: 10px;
	width:7em;
	    height:80px;
		
	}
	
	
		.image-left
	{
		float: left;
		margin: 0em 1em 0em 0.5em;
	
}


	.image-left1
	{
		float: left;
		margin: 0em 1em 0.3em 0.5em;
		height:32px;
	
}


.image-left2
	{
		float: left;
		left:2em;
		margin: 0em 4em 0em 0.5em;
	
}

		
	.image-punto
	{
	 float:none;
	 height:1.4em;
	 padding-top:0.3em;
	
		
	}
	
		.gender, .gender2, .gender3
	{
	 float:none;
	 height:2.7em;
	 width:2.5em;
	 
		
	}
	
	.image-banner1
	
	{
	background-image: URL("../images/banner3.png");
	
	 float:none;
	 display: inline;
	 width:45em;
	 height: auto;
		margin: -0.2em 0 0 0;
		-moz-border-radius: 5px;
 border-radius: 5px;
		
		
	}
	
	.image-centered
	{
		display: block;
		margin: 0 0 1em 0;
	}

		.image-centered img
		{
			margin: 0 auto;
			width: auto;
		}
		
	.button
	{
		display: inline-block;
		background-color: #30018F;
		color: #fff;
		border: 0;
		cursor: pointer;
		outline: 0;
		-moz-transition: background-color .25s ease-in-out;
		-webkit-transition: background-color .25s ease-in-out;
		-o-transition: background-color .25s ease-in-out;
		-ms-transition: background-color .25s ease-in-out;
		transition: background-color .25s ease-in-out;
	}

		.button:hover
		{
			background-color: #333333;
		}
		
		.button:active
		{
			background-color: #BFBFBF;
		}
	
		.button-alt
		{
			background-color: #777777;
		}

			.button-alt:hover
			{
				background-color: #888888;
			}
			
			.button-alt:active
			{
				background-color: #999999;
			}
	
		.button-small
		{
		}
		
		.button-big
		{
		}
		
		.button-huge
		{
		}

	ul.style1
	{
		list-style: disc;
		padding-left: 1em;
	}
	
		ul.style1 li
		{
			padding-left: 0.5em;
		}
	
	ul.links
	{
	}
	
		ul.links li
		{
			display: inline-block;
		}

			ul.links li:before
			{
				display: inline;
				content: '\2022';
				opacity: 0.5;
			}
		
			ul.links li:first-child:before
			{
				display: none;
			}
		
	ol.style1
	{
		list-style: decimal;
		padding-left: 1.25em;
	}

		ol.style1 li
		{
			padding-left: 0.25em;
		}

	.byline
	{
		display: block;
		color: #CCCCCC;
	}
	
	.byline_inline
	{
		display: inline;
		color: #CCCCCC;
	}
	
		.byline_comentario
	{
		display: block;
		color: #F76155;
	}
	
	.msgs
	{
		display: block;
		color:#FFFFFF;
	}
	
	.icon
	{
		text-decoration: none;
	}

		.icon:before
		{
			text-decoration: none;
			padding-right: 0.25em;
			font-family: 'OstrichSansBlack';
			-webkit-text-rendering: optimizeLegibility;
			-moz-text-rendering: optimizeLegibility;
			-ms-text-rendering: optimizeLegibility;
			-o-text-rendering: optimizeLegibility;
			text-rendering: optimizeLegibility;
			-webkit-font-smoothing: antialiased;
			-moz-font-smoothing: antialiased;
			-ms-font-smoothing: antialiased;
			-o-font-smoothing: antialiased;
			font-smoothing: antialiased;
			-webkit-font-feature-settings: "liga" 1, "dlig" 1;
			-moz-font-feature-settings: "liga=1, dlig=1";
			-ms-font-feature-settings: "liga" 1, "dlig" 1;
			-o-font-feature-settings: "liga" 1, "dlig" 1;
			font-feature-settings: "liga" 1, "dlig" 1;
		}

/*********************************************************************************/
/* Icons                                                                         */
/*********************************************************************************/

	/*
		These are powered by the kickass Ligature Symbols font by
		Kazuyuki Motoyama (@kudakurage). I've already added styles for
		a pretty good set of icons, but the font actually has WAYYYY
		more (including icons for many other accounts and services).
		To add them to Astral, go here to look up the unicode for
		the icon you want to use:
		
		http://kudakurage.com/ligature_symbols/
	
		Then simply add the CSS for it in this format:
		
		.icon-(name):before		{ content: '(unicode)'; }
	*/
	
	/*.icon-album:before			{ content: '\E002'; }
	.icon-book:before			{ content: '\E020'; }
	.icon-comment:before		{ content: '\E034'; }
	.icon-file:before			{ content: '\E048'; }
	.icon-folder:before			{ content: '\E04c'; }
	.icon-info:before			{ content: '\E094'; }
	.icon-mail:before			{ content: '\E08a'; }
	.icon-notify:before			{ content: '\E097'; }
	.icon-right:before			{ content: '\E112'; }
	.icon-share:before			{ content: '\E118'; }
	.icon-tilemenu:before		{ content: '\E12a'; }
	.icon-user:before			{ content: '\E137'; }
	.icon-book:before	    	{ content: '\E020'; }
	.icon-dribbble:before		{ content: '\E03f'; }
	.icon-facebook:before		{ content: '\E047'; }
	.icon-google:before			{ content: '\E05a'; }
	.icon-setting:before		{ content: '\E055'; }
	.icon-tumblr:before			{ content: '\E03f'; }
	.icon-twitter:before		{ content: '\E07f'; }
	.icon-arrowup:before		{ content: '\E00e'; }
	*/
	
		
/*********************************************************************************/
/* Nav                                                                           */
/*********************************************************************************/
	
	#nav
	{
	}
	
		#nav a
		{
			position: static;
			display: list-block;
			color: #CCCCCC;
			
			
			text-decoration:none;
			
		}

			#nav a.icon:before
			{
				padding-right: 0;
			}
		
/*********************************************************************************/
/* Panels                                                                        */
/*********************************************************************************/

	#main
	{
		position: relative;
		overflow: hidden;
		
	}

	.panel
	{
		position: relative;
		
		}



	/* Me */
	#me
	{
	}
		
	#me .pic
			{
				position: relative;
				display: block;

			}

				/*
					The pseudo element below applies a noise pattern to the "me" image. It's
					meant to help mask blurriness, but you can remove it if you don't like it.
				*/
			
				#me .pic:before
				{
					content: '';
					position: absolute;
					top: 0;
					left: 0;
					background: #240048;
					width: 100%;
					height: 100%;
					z-index: 1;
				}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/



.dhtmlgoodies_question,.dhtmlgoodies_question1{	cursor:pointer;

}


.dhtmlgoodies_answer,.dhtmlgoodies_answer1{	/* Parent box of slide down content */
	/* Start layout CSS */
	border:1px solid #400080;
	background-color: #0C0121;
	width:100%;
    padding:2px;

	/* End layout CSS */

	visibility:hidden;
	height:0px;
	overflow:hidden;
	position:relative;
	

}
.dhtmlgoodies_answer_content, .dhtmlgoodies_answer_content1{	/* Content that is slided down */
    padding:4px;
	font-size:0.9em;
	position:relative;
	color: #CCCCCC;
}	

.productos {
     margin-top:0.3em;
	
}	

.productos:hover{
   background-color: #333333;
  
   color: #CCCCCC;
   
}


.column_content{
margin-bottom:-1em;
}

		
  
.gotop:hover {
	color:#eee;
	opacity:1
}

a.gotop {
	text-decoration:none!important
}

#T_tags, #T2_tag2s, #T3_tag3s{
border: 0px solid #C0C0C0;
word-spacing:2px;
font-size:large;
}
#T_tags, #T2_tag2s, #T3_tag3s a{
color:#FFFF00;
}




.Estilo1 {
font-size: x-large
}

/* copiado de "validado por w3c.html"     */
 hr.c13 {text-align: right}
 a.c12 {text-decoration:none; color:#CCCCCC}
 div.c11 {margin-top:-2em; float:right;}
 img.c10 {margin-top: 10px; margin-right: 13px; border:#FFFFFF; border-style:solid; border-width:thick}
 div.c9 {display:none;opacity:0}
 div.c8 {display:table-row; cursor:pointer;text-align:center;}
 div.celldo  { border-top-style:none;
	
	 cursor:default;
		}
 span.c7 {text-align:center;}
 p.c6 {text-align: left}
 span.c5 {letter-spacing:0.05em; color: #8080FF}
 div.c4 {text-align: left}
 h1.c3 {color: #8080FF; text-align: left}
 span.c2, span.c2mas {color: #F76155}
 span.c2mas{ 
 float: left;
 color:  #CCCCCC;
		margin: 0em -2em 0em -0.5em;
		font-size: 24px;
 }
 span.gratis {
	font-family: Arial, sans-serif;
		height: 4.5em;
	letter-spacing:0.05em;
	color: #FF0000;
	display: marker;
	font-weight:bold;
	}
 div.c1 {display:table-cell;}



 span.fecha {
	
		height: 4.5em;
	display: block;
	float:right;
	

	}
	
/* hay que aplicar a la imagen izqu. margin-top: 2.5em;  y a p <p style="margin-top:-2em">   */
	
.nuevo {
	 width:78px;
	 background-color:transparent;
	 height: 54px;
	   float: right;
	  
	 
	   font-stretch:extra-condensed;
	   font-size:1.03em;
	   font-weight:bolder;
	   color: #8080FF;
	   font-stretch:narrower;
	 
	   padding-top:0.6em;
	   padding-left:0.06em;
	   margin-top: 4px;
	    margin-left: 0.15em;
		 margin-bottom: 0em;
		  
}

#nameerror{
padding:1.5em 0 0 0;
color:#FF0000;
}

#email2error, #messageerror{

color:#FF0000;
}


/*
#tooltip{
	position:absolute;
	border:1px solid #333;
	background:#f7f5d1;
	padding:2px 5px;
	color:#333;
	display:none;
	}	
	*/
.audioc{

 float:right
}	

.espacio-form{
height:5em;
}

.email
{
color:#F76155;
text-decoration:none;
}

.anuncio{
 float:right; 
 margin-right:-2.5em;
  margin-top:-0.5em;
}


#tooltip {
position:relative;
    padding: 6px ;
	color:#000000;
	
	
    background: #f9f9f9;
    border: 1px solid  #FF0000;
    text-align: center;
    font-size: smaller;
	line-height:0.9em;
	 -moz-border-radius: 0 15px 15px 15px;

    -webkit-border-radius:0 15px 15px 15px;

    -khtml-border-radius: 0 15px 15px 15px;

    border-radius: 0 15px 15px 15px; 
	z-index:900;
}

span.tip {
   
}