/*-----------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*---------------------------------- CSS PRODUCTO - ESTILO VINILO  ------------------------------*/
/*---------------------------- por Ignacio Ricci (www.ignacioricci.com) -------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/

/*- Informacion de la Seccion ----------------------------------------------*/	

		
		/*- ID PARA EL BODY -*/
		#pageProduct {}
		
			/*- Link a la Home - Override -*/
			#homeLinK {margin:0 0 10px 0; top:auto;}
			.likeIt{position:absolute;right:10px;width:52px !important;}
			/*- Contenedor de Productos -*/
			#pageProduct #sectionContent {width:830px; padding:10px 10px 20px 10px; border:1px solid #CCC; float:right; font-size:0.9em;position:relative;}
			
				#pageProduct #sectionContent input {padding:0; margin:0 3px 0 0; vertical-align:bottom;}
			
				#productImgAndInfo {}
				
					#productImgAndInfo label {text-transform:lowercase;}
				
					/*- Imagen del Producto -*/
					#productImg {width:343px; height:343px; padding:6px; border:1px solid #CCC; background:#FFF; float:left;}
						#productImg img {display:block; height:100%; width:100%;}
					
					
					/*- Informacion del Producto -*/
					#productInfo {}
					
						/*- Sub-titulos = Nombre, Descripción, etc -*/
						#sectionContent h4 {display:block; color:#666; padding:10px 0 5px;}
							#productInfo h4 strong {color:#BCBCBC; font-weight:bold; text-transform:uppercase;}
							
							
						#sectionContent p {padding:0 0 3px 0; line-height:140%;}
							
							
						/*- Tabla de Medidas + Precios -*/
						#productSizes {margin-top:10px; color:#666;}
							#productSizes td#productSizesTitle {
								border: none;
								text-align: left;
								color: black;
								padding-left: 0;
							}
							#productSizes th {font-weight:normal; text-align:left; padding:5px 0;}
								#productSizes th h4 {padding:0;}
							
							#productSizes td {border-right:1px dotted #CCC; padding:5px 10px;}

							/*- Clase para celdas de la columna medida -*/
							#productSizes .colMedida {width:100px; padding-left:0;}
							
							/*- Clase para celdas de la columna precio y cantidad -*/
							#productSizes .colPrecio,
							#productSizes .colCantidad {text-align:center;}
								#productSizes .colCantidad label {position:absolute; top:0; left:-32697px;}
								
							
							/*- Celdas de informacion extra -*/
							#info_medida1 td,
							#info_medida2 td,
							#info_medida3 td,
							#info_medida4 td,
							#info_medida5 td {color:#CC0000; padding:0 0 5px 0; border:none;}
										
				#simulatorAndProductImg {
					background: #DEEECA;
					padding: 5px 0 10px 40px;
					overflow: hidden;
					height: 1%;
				}
				#simulatorTitle,
				#proposalTitle {
					width: 356px;
					text-align:center;
					float: left;
					font-weight: bold;
					font-size: 12px;
					color: #666;
					margin-bottom: 3px;
					margin-right: 35px;
				}
							
				/*- Simulador y sus opciones -*/
				#simulatorAndOptions {clear:both; padding-top:20px}
			
					/*- Simulador -*/
					#simulator {
						background:none repeat scroll 0 0 #FFFFFF;
						border:1px solid #CCCCCC;
						float:left;
						height:343px;
						margin-left:35px;
						padding:6px;
						width:343px;
					}
				
					/*- Opciones -*/
					#options {}
				
						/*- Contenedor de colores -*/
						.colorContainers {padding:5px 5px 0 5px; border: 1px solid #ccc; overflow: hidden;
							height: 1%;
						}
						
							/*- Cada color es un elemento de lista -*/
							.colorContainers ul li {float:left; margin:0 5px 3px 0; padding-bottom: 7px; 
							position: relative;
									z-index: 1000;
							}
							.colorContainers ul li div {width:20px; height:20px;  border:1px solid #CCC; cursor:pointer; 
							
							}
								/*- Mascara circular del color -*/
								.colorContainers ul li div.bg {
									border-radius: 11px;
									-moz-border-radius:11px;
									-webkit-border-radius:11px;
									behavior:url(/styles/border-radius.htc);

								}

								.colorContainers ul li div a {display:block; width:100%; height:100%; font-size:0px; text-indent:-9999em;}

								.colorContainers ul li.selected {
									background: url("/images/shared/selectedColor.png") bottom center no-repeat;
								}
								
						/*- Colores varios del vinilo -*/
						#productColorsWrapper p.clearThis {padding-top:10px;}
						#productColorsWrapper .colorContainers {width:auto;}	
						
					
						#options .clearThis {padding-top:5px;}
						
						#options img {vertical-align:middle;}
						
						.tab {
							float: left;
							border-radius-topleft: 5px;
							-moz-border-radius-topleft: 5px;
							-webkit-border-radius-topleft:5px;
							border-radius-topright: 5px;
							-moz-border-radius-topright: 5px;
							-webkit-border-radius-topright:5px;
							border: 1px solid #ccc;
							border-bottom: none;
							width: auto;
							padding: 5px 10px;
							color: #666;
							margin-right: 4px;
							cursor: pointer;
						}

						.tab.selected {
							font-weight: bold;
							background: #94BF65;
						}

						/*- Flecha titulo colores -*/
						.colorTitleDetail {width:11px; height:10px; background:url(../images/simulator/colorTitleSprite.gif) no-repeat -1px -1px; margin-top:-2px;}
						
						/*- Espejado -*/
						.swapSprite {width:17px; height:17px; background:url(../images/simulator/espejadoSprite.gif) no-repeat -1px -1px;}
						.swapSprite.right {background-position:-19px -1px;}
						
						/*- Labels de direccion (alineacion sprite) -*/
					    #options .direccionNormalLabel {padding-right:10px;}
						#options .direccionInvertidaLabel {padding-right:50px;}
						
				/*- Contenedor botones -*/
				#pageProduct .buttonContainer {width:850px; float:right;}
				
				/*- Informacion acerca de enviar foto -*/
				#infoEnviarFoto {padding-right:150px; font-size:0.9em; color:#666; padding-top:5px;}	
				
				/*- Enviar foto -*/
				#sendPhoto {clear:both; width:616px; padding-top:10px; float:right; margin-top:20px; border-top:1px dotted #CCC; font-size:0.9em; color:#666;}
				
					#sendPhoto p {padding-bottom:25px;}
					#sendPhoto form p {margin:0; padding:0;}
					
					#sendPhoto input,
					#sendPhoto label {float:left;}
					
					#sendPhoto input {background:#FFF; border:1px solid #CCC; margin-bottom:10px; color:#000; text-transform:lowercase;}
					
						#nombreEnviarFoto,
						#emailEnviarFoto {width:222px;}
					
					#sendPhoto label {padding-top:3px; margin:0 5px 0 145px; min-width:60px;}	
					
			
				/*-  Mensaje de enviado -*/
				#respuestaEnvioFoto {color:#647F47;}				
						
			
/*- Fin de Informacion de la Seccion ---------------------------------------*/	

/*-----------------------------------------------------------------------------------------------*/	

/*- IE 6 + IE 7 Fixes ------------------------------------------------------*/

		/*- 6 -*/
		* html #pageProduct #sectionContent input {vertical-align:middle;}
		* html #simulatorAndOptions {padding-top:5px}
		* html #sendOrBuy button {padding-right:5px;}
		* html #sendPhoto label {width:60px;}	
		/*- 7 -*/
		*+ html #pageProduct #sectionContent input {vertical-align:middle;}
		*+ html #simulatorAndOptions {padding-top:5px}
		*+ html #sendOrBuy button {padding-right:5px;}

/*- Fin IE 6 + IE 7 Fixes --------------------------------------------------*/	

/*-----------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*---------------------------------- FIN CSS PRODUCTO - TU VINILO  ------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/