@charset "utf-8";
/* CSS Document */



html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0px;
    padding: 0px;
    border: 0px none;
    font-style: inherit;
    line-height: inherit;
    font-size-adjust: inherit;
    font-stretch: inherit;
    font-feature-settings: inherit;
    font-language-override: inherit;
    font-kerning: inherit;
    font-synthesis: inherit;
    font-variant: inherit;
    font-size: 100%;
    font-weight: 200;
    color: #333;
    vertical-align: baseline;
    /*transition: all 0.2s ease 0s;*/


	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:14px;
	
 -webkit-transition:all .2s ease 0s;
 -moz-transition:all .2s ease 0s;
 -o-transition:all .2s ease 0s;
 -ms-transition:all .2s ease 0s;	
}

body{

}


#fondo {
	padding: 0;
	margin-top:30px;
	padding-bottom:100px;
	height: 600px;
	width: 100%;
	z-index: 1;
	position: absolute;
	background-color: #FFF;
		}

.fdo_2 {
	width: 100%;
	background-color:red;
	margin-top:820px;
	position: absolute;		
}

.capa_centrada{
	width: 1000px;
	max-width:100%;
	margin: 0 auto;
	/*background-color:red;	*/
	margin-bottom: 20px;
}
#capturar_bici{
	width: 1000px;
	max-width:100%;
	height: 700px;
	margin: 0 auto;
	margin-top: 50px;
	/*background-color:red;	*/	
}

@media (max-width: 800px) and (min-width: 701px) {
#capturar_bici{
	width:100%;
	max-width:100%;
	height: 580px;
	margin-top: 0px;
}	
}

@media (max-width: 700px) and (min-width: 601px) {
#capturar_bici{
	width:100%;
	max-width:100%;
	height: 480px;
	margin-top: 0px;
}	
}
@media (max-width: 600px) and (min-width: 501px) {
#capturar_bici{
	width:100%;
	max-width:100%;
	height: 380px;
	margin-top: 0px;
}	
}
@media (max-width: 500px) and (min-width: 401px) {
#capturar_bici{
	width:100%;
	max-width:100%;
	height: 330px;
	margin-top: 0px;	
}	
}
@media (max-width: 400px) and (min-width: 321px)  {
#capturar_bici{
	width:100%;
	max-width:100%;
	height: 240px;
	margin-top: 0px;
}	
}

@media (max-width: 320px) {
#capturar_bici{
	width:100%;
	max-width:100%;
	height: 200px;
	margin-top: 0px;
}	
}

.capa_centrada div{
	position: absolute;
}		
.capa_centrada img{
	width: 100%;
	height: auto;
}	
	

/*FORMULARIO*/

.capa_form{
	margin:0 auto;
	overflow: visible;

}

.campo_entrada_form_basico{
	padding-top:9px;
	padding-left:10px;
	padding-right:10px;	
	height:30px;
	font-size:14px;
	font-weight:bold;
	color:#666;	
	background-color:#EBEBEB;	
	border:1px solid #EBEBEB;	
	margin-bottom:10px;	

}

.campo_entrada_form_basico input{
	font-weight:bold;
	color:#666;	
	background-color:#EBEBEB;
	border:1px solid #EBEBEB;
	background-image:none;
	text-align:center;
	

}

.campo_entrada_form_basico:focus, .campo_entrada_form_basico:hover{
	border:1px solid #CCC;
	

}

.campo_entrada_form_basico input:focus, .campo_entrada_form_basico input:hover{
	background-image:none;
	
}


.txtarea_entrada_form_basico{
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;		
	height:60px;
	font-size:14px;
	font-weight:bold;
	color:#666;	
	background-color:#EBEBEB;	
	margin-bottom:10px;	
}

.txtarea_entrada_form_basico textarea{
	padding-left:5%;
	width:90%;
	margin:0 auto;
	background-color:#EBEBEB;
	color:#666;	
	border:none;
}
.txtarea_entrada_form_basico textarea:focus, .txtarea_entrada_form_basico textarea:hover{

}

.boton_submit_form_basico{
	margin-top:0px;
	margin-bottom: 20px;
	background-color:#000; 
	padding: 10px;
	height:40px;
	text-align:center;
	color:#F9F9F9;
	font-size:16px;
	font-weight:bold;	
	border:none;

	/*Cambio gradual del color*/	

 -webkit-transition:all .2s ease-in-out;
 -moz-transition:all .2s ease-in-out;
 -o-transition:all .2s ease-in-out;
 -ms-transition:all .2s ease-in-out;		

	
}

.boton_submit_form_basico:hover{
	background-color:#A99401; /* #A99401 */
	color:#FFF;
	cursor:pointer;
}

.boton_submit_form_basico:active{
	background-color:#413901;
	color:#FFF;	
}
.capa_form{
	margin-top: 20px;
}

#componente_valor,
#select_color,
#cuadro_valor,
#manillar_valor{
	height: 30px;
	padding-left: 10px;
	padding-right: 10px;
	color:#666;	
	background-color:#FCFCFC;
	border:1px solid #EBEBEB;
	margin-bottom: 14px;
}
#componente_valor option:nth-child(2){

	font-weight: bold;
}

.errores{
            -webkit-boxshadow: 0 0 10px rgba(0, 0, 0, 0.3);
            -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
            -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
            background: red;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
            color: #fff;
            display: none;
            font-size: 14px;
            margin-top: -45px;
            margin-left: 80px;
            padding: 12px;
            position: absolute;
        }
		
.form_ok{
           -webkit-boxshadow: 0 0 10px rgba(0, 0, 0, 0.3);
           -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
           -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
	        background: #9CF;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
            color: #fff;
            display: none;
            font-size: 14px;
            margin-top: 56px;
            padding: 12px;
            position: absolute;
			z-index: 1000;
        }
.form_ok span{		
	text-align: center;
	width: 100%;	
}
.form_ok a{		
	color: #06C;
	text-decoration: none;
}
.form_ok a:hover{		
	color: #000;
	text-decoration: none;
}

@media (min-width: 400px) {
	.capa_form{
		width: 400px;
	}
	.campo_entrada_form_basico{
		width:378px;
	}
	.campo_entrada_form_basico input{
		width:376px;
	}
	.txtarea_entrada_form_basico{
		width:380px;
	}
	.boton_submit_form_basico{
		width:400px;
	}
	
	#componente_valor,
	#select_color,
	#cuadro_valor,
	#manillar_valor{
		width:400px;
	}
	
	.form_ok{
		width: 376px;
	}
}
@media (max-width: 400px) {
	.capa_form{
		width: 300px;
	}
	.campo_entrada_form_basico{
		width:278px;
	}
	.campo_entrada_form_basico input{
		width:276px;
	}
	.txtarea_entrada_form_basico{
		width:280px;
	}
	.boton_submit_form_basico{
		width:300px;
	}
	
	#componente_valor,
	#select_color,
	#cuadro_valor,
	#manillar_valor{
		width:300px;
	}
	.form_ok{
		width: 276px;
	}	
}

.capa_ventana_color:hover{
	z-index: 10000;
}

.capa_ventana_color:hover .capa_cuadro_color{
	display: block;
}

.capa_centrada div.capa_ventana_color{
	position:absolute;
	width: auto;
}
.capa_centrada div.nombre_componente{
	position:relative;
	width: 120px;
	text-align: center;
	padding-bottom: 10px;
}

.capa_centrada div.nombre_componente span{
	width: 100%;
}
.capa_centrada div.nombre_componente .fa{
	width: 100%;
	color: #CCC;
}
.capa_centrada div.nombre_componente .fa-gear{
	color: #999;
}
.capa_centrada div.nombre_componente .fa:hover{
	width: 100%;
	color: #333;
}

.capa_centrada .capa_tipo_cuadro{
	position: relative;
	min-height: 90px;
}

.capa_centrada .capa_tipo_cuadro > span,
.capa_centrada .capa_tipo_manillar > span,
.capa_centrada .capa_colores > span{
	display:block;
	margin-bottom:10px;
}

.capa_centrada div.capa_tipo_manillar{
	position: relative;
	min-height: 90px;
}

.capa_centrada .capa_colores{
	position: relative;
}


#sel{
	display: none;
}
.ver_marcadores{
	position:relative;
	width: 60px;
	margin-top: -28px;
	text-align: center;
	padding-bottom: 10px;
	margin-left: 70px;
	z-index: 11000;
}
.ver_marcadores .fa{
	color: #999;
}
.ver_marcadores .fa:hover{
	color: #333;
	cursor: pointer;
}
.ver_marcadores .fa.mostrar{
	display: none;
}
.capa_centrada div.capa_cuadro_color{
	display: none;
	position:relative;
	width: auto;
	width: 290px;
	max-width: 290px;
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	padding: 10px;
	background: #F8F8F8;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}
.ml_100{
	margin-left: -220px;
}
.ml_30_mas{
	margin-left: 30px;
}
.ml_20_mas{
	margin-left: 20px;
}
.ml_80{
	margin-left: -140px;
}
.ml_60{
	margin-left: -60px;
}

.margen-mujer-16{
	margin-top: 190px !important;
}
.margen-mujer-9{
	margin-top: 240px !important;
}

.capa_centrada div.capa_manillar_color{
	display: block;
	width: 100%;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
	padding-left: 6px;
}

.capa_centrada div.manillar_color{
	position:relative;
	float:left;
	width: 40%;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
	padding-left: 5%;
}
.capa_centrada div.manillar_color p{
	text-align:center;
	padding:10px;
	color: #FFF;
	background-color: #09F;
	border-radius: 6px 6px 6px 6px;
	-moz-border-radius: 6px 6px 6px 6px;
	-webkit-border-radius: 6px 6px 6px 6px;
}
.capa_centrada div.manillar_color p:hover{
	color: #FF0;
	background-color: #093;
}

.capa_centrada div.capa_cuadro_color.filas_1{
	height: 102px;
}
.capa_centrada div.capa_cuadro_color.filas_12{
	height: 192px;
}
.capa_centrada div.capa_cuadro_color.filas_2{
	height:148px;
}
.capa_centrada div.capa_cuadro_color.filas_3{
	height:204px;
}
.capa_centrada div.capa_cuadro_color.filas_4{
	height:240px;
}
.capa_centrada div.capa_cuadro_color.filas_5{
	height:470px;
}

.capa_centrada #capa-select-componente-12 div.capa_cuadro_color.filas_2{
	height:260px;
} 


.fa-male,
.fa-female{
	margin-top: 10px;
}

.capa_centrada div.cuadro_color{
	position: relative;
	text-align: center;
	float: left;
	width: 50px;
	height: 50px;
	margin-right: 6px;
	margin-bottom: 6px;
	border:1px solid #DDD;
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	/*border: 1px solid #EEE;*/
	-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.65);
	-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.65);
	box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.65);

}

.capa_centrada div.cuadro_color:hover{
	border:1px solid #333;
	/*border:1px solid #333;*/
	-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.95);
	-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.95);
	box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.95);
}

.plata{
	background: rgba(255,255,255,1);
	background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
	background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -o-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -ms-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=1 );
}
.oro{
	background: rgba(237,255,97,1);
	background: -moz-linear-gradient(left, rgba(237,255,97,1) 0%, rgba(255,221,0,1) 100%);
	background: -webkit-gradient(left top, right top, color-stop(0%, rgba(237,255,97,1)), color-stop(100%, rgba(255,221,0,1)));
	background: -webkit-linear-gradient(left, rgba(237,255,97,1) 0%, rgba(255,221,0,1) 100%);
	background: -o-linear-gradient(left, rgba(237,255,97,1) 0%, rgba(255,221,0,1) 100%);
	background: -ms-linear-gradient(left, rgba(237,255,97,1) 0%, rgba(255,221,0,1) 100%);
	background: linear-gradient(to right, rgba(237,255,97,1) 0%, rgba(255,221,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#edff61', endColorstr='#ffdd00', GradientType=1 );
}
.cobre{
	background: rgba(184,104,84,1);
	background: -moz-linear-gradient(left, rgba(184,104,84,1) 0%, rgba(201,137,26,1) 100%);
	background: -webkit-gradient(left top, right top, color-stop(0%, rgba(184,104,84,1)), color-stop(100%, rgba(201,137,26,1)));
	background: -webkit-linear-gradient(left, rgba(184,104,84,1) 0%, rgba(201,137,26,1) 100%);
	background: -o-linear-gradient(left, rgba(184,104,84,1) 0%, rgba(201,137,26,1) 100%);
	background: -ms-linear-gradient(left, rgba(184,104,84,1) 0%, rgba(201,137,26,1) 100%);
	background: linear-gradient(to right, rgba(184,104,84,1) 0%, rgba(201,137,26,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b86854', endColorstr='#c9891a', GradientType=1 );
}
.flor_blanca{
	background-image: url('flor-blanca.png');
}
.flor_fucsia{
	background-image: url('flor-fucsia.png');
}
.remache_marron{
	background-image: url('remache-marron.png');
}
.remache_negro{
	background-image: url('remache-negro.png');
}
.cuadro_color:hover,
.capa_centrada div.nombre_componente .fa:hover{
	cursor: pointer;
}
.precreditos{
	width: 100%;
	text-align: center;
	margin-bottom: 30px;
}
.creditos{
	width: 100%;
	text-align: center;
	margin-bottom: 30px;
	padding-bottom:40px;
}
.precreditos strong, .creditos strong{
	font-weight: bold;
}
.precreditos a,.creditos a{
	color: #06F;
	text-decoration: none;
}
.precreditos a:hover,.creditos a:hover{
	color: #039;
}

@media (max-width: 999px) {
	.capa_ventana_color,
	.ver_marcadores,
	.fa-map-marker{
		display: none !important;
	}
	#sel{
		display: block !important;
	}
}