/*!
 * Start Bootstrap - Heroic Features (https://startbootstrap.com/template-overviews/heroic-features)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-heroic-features/blob/master/LICENSE)
 * Modificaciones realizadas por Fernando Palarea para TenerifeBodas.
 */

@import url('https://fonts.googleapis.com/css?family=Nothing+You+Could+Do');

body {
  padding-top: 56px;
}

/* Para futuros cambios en el diseño se ha creado esta clase para la cabecera donde está la frase
mensaje{
 
}

*/

h1.titulo {
  margin: 0 auto;
  margin-left: 22%;
  padding: 40px;
  font-size:36px;
  font-weight: 600;
  color:black;
  width: 80%;
  font-family: 'Nothing You Could Do', cursive;
}


h2.titulo {
  font-size:22px;
  font-weight: 600;
  color:#e59de4;
  font-family: 'Nothing You Could Do', cursive;
}

div#banner{
	width: 100%;
	margin-top: 20px;
	padding: 20px;
}

label.etiqueta{
	width: 6em;
}

.centrado{
	width: 100%;
	text-align: center;
}

.justificado{
	text-align: justify;	
}

#banner{
	background-image: url('../images/banner_libros.jpg');
	min-height: 128px;
}

.msjOculto{
    visibility: hidden;
}

.msjError{
    visibility: visible;
    color: red;
    text-align: center;
}

.txtIntereses{
    width: 100%;
    resize: none;
}

.mensaje{
    padding-bottom: 20px;
}

.msjNoLeido{
    font-weight: bold;
}

.msjTexto{
    background-color: aliceblue;
}

.txtArea{
    /*-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;*/
    width: 100%;
    resize: none;
}

.flotante{
    width: 40%;
    z-index: 1000;
    padding-left: 20px;
}  

.maquetado {
	margin: 0 auto;
  padding: 40px;
  font-size:16px;
  color:black;
  width: 100%;
  font-family: Cambria, 'Hoefler Text', 'Liberation Serif', Times, 'Times New Roman', 'serif'cursive;
	
}

.maquetado2 {
	padding:20px;
}

/*Estilos formulario*/
#textoContacto {
	width: 500px;
	position: relative;
}

#textoContacto h3 {
	font-size: 3.5em;
	font-family: Helvetica, arial;
	font-weight: 100;
	-webkit-transform: rotate(-90deg); 
	-moz-transform: rotate(-90deg);
	
	color:#d3e11d;
	
	position: absolute;
	top: 200px;
	left: -80px;
}
#formulario {
    width:435px;
    margin:auto;

    font-family: Helvetica, Verdana, Geneva, sans-serif;
    font-size: .8em;
    
    padding:15px;
    
    padding-bottom: 50px;
    padding-left:90px;
    position: relative;
    
    background: url(images/content/contactoBG2.png) no-repeat left;
}
#formulario label{
	display: block;
	float:left;
	width:175px;
    font-weight:bold;
    font-size:12px;
    
    padding-top:5px;
    
    position: relative;
}

label.error { 
	width:175px;
	margin-top:-17px;
	
	color:#ff0000;
	
	float: left;
	
	font-size:1em;
}

#formulario input{
	display: block;
	float:left;
	width:250px;
	margin-bottom: 7px;
}

#formulario textarea{
	display: block;
	float:left;
	width:254px;
	height: 200px;
	margin-bottom: 5px;
	
	resize: none;
}

#formulario .botonAcceder{
	width: 175px;
	height: 30px;
	background: #d3e11d;
	border:none;
	margin:auto;
	
	position: absolute;
	right: 0;
	left: 0;
	bottom: 10px;
	
	color:#535353;
}

#formulario .botonAcceder:hover{
	background: #535353;
	color:#d3e11d;
}

#formulario #aster {
	color:#ff0000;
}

#textoContacto {
	color:#535353;
}

.thanks{
	color:red;
	text-align:center;
	height:220px;
	
	margin-top: 100px;
	font-size:1em;
}




$primaryColor: #cb06c4
$secondaryColor: #000000


*
margin: 0px
padding: 0px
font-family: 'Raleway', sans-serif

formulario{
	bl
	font-family: 'Raleway', sans-serif;
	margin: 0px;
	padding: 0px;
}



background-color: $backgroundColor
main
display: flex
flex-direction: column
justify-content: center
align-items: center
min-height: 100vh
h1
	padding: 20px
	font-weight: bold
	font-size: 2.7rem
	color: #fff
	text-align: center
form
	display: flex
	flex-direction: column
	justify-content: center
	align-items: center
	padding: 40px
	background-color: $secondaryColor
	width: 45%
	border-radius: 4px
	box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.45)
	input
		border-width: 0px
		border-radius: 2px
		outline: none
		padding: 5px
		min-height: 30px
		background-color: $primaryColor
		font-size: 1.1rem
		text-align: center
		color: #fff
	::placeholder
		color: #fff
	input[type=submit]
		background-color: #fff
		color: $primaryColor
		min-height: 42px
		width: 100px
		font-weight: bold
	span
		color: #FFEE58
		padding: 15px
		font-weight: bold
		text-align: center
	.dosColumnasInput
		display: flex
		flex-direction: row
		justify-content: center
		align-items: center
		div
			display: flex
			flex-direction: column
			justify-content: center
			align-items: center
			padding: 10px
			min-height: 100px
			width: 350px
			input
				width: 230px
  .unaColumnaInput
		div
			display: flex
			flex-direction: column
			justify-content: center
			align-items: center
			padding: 10px
			input
				width: 600px