/* #region tipografias */

/* tipografias Monserrat */

@font-face {
	font-family: Montserrat;
	src: url(../fuentes/Montserrat/Montserrat-Regular.ttf);
	font-weight: normal;
}

@font-face {
	font-family: Montserrat;
	src: url(../fuentes/Montserrat/Montserrat-ExtraBold.ttf);
	font-weight: bold;
}

/* tipografias Dancing */

/* @font-face {
    font-family: Dancing;
    src: url(../fuentes/Dancing_Script/DancingScript-Regular.ttf);
    font-weight: normal;
} */

@font-face {
	font-family: Dancing;
	src: url(../fuentes/Dancing_Script/DancingScript-Bold.ttf);
	font-weight: bold;
}

/* tipografia pacifico */

@font-face {
	font-family: Pacifico;
	src: url(../fuentes/Pacifico/Pacifico-Regular.ttf);
	font-weight: normal;
}

/* #endregion tipografias */

body {
	background-color: #E5B3F2;
	background-image: url(../recursos/fondo.svg);
	background-repeat: repeat-y;
	background-size: 100%;
	margin: 0px;
}

/* #region ESTILOS PARRAFO GENERAL */

.text_normal {
	font: normal normal 16px/24px montserrat, sans-serif;
	color: black;
	text-align: left;
}

.text_normal_centrado {
	font: normal normal 16px/24px montserrat, sans-serif;
	color: black;
	text-align: center;
}

h2 {
	font: normal normal 30px/40px Pacifico;
	color: #A066F2;
	text-decoration: underline;
	/* text-shadow: 1px 1px ivory; */
}

/* #endregion ESTILOS PARRAFO */

/* #region WEB cabecera  */

div.separador {
	height: 15%;
}

.web_tittle {
	background-image: url(../recursos/foto_header.jpg);
	background-position-y: -150px;
	background-repeat: no-repeat;
	/* height: 380px; */
	background-attachment: fixed;
	margin-bottom: 20px;
	text-align: center;
	padding: 80px;
}

div.web_tittle h1 {
	width: 75%;
	margin: auto;
	padding: 40px;
	padding-left: 100px;
	padding-right: 100px;
	border-radius: 500px;
	min-width: 500px;
	max-width: 1000px;
	font: normal bold 130px/110px Dancing;
	text-align: center;
	color: #F7C818;
	text-shadow: 2px 2px rgb(206, 82, 0);
	background-color: rgba(255, 255, 255, 0.5);
	box-shadow: 0px 0px 30px 10px rgba(1, 33, 70, 0.5);
}



nav table.text_menu {
	border-collapse: collapse;
	margin-bottom: 50px;
}

.text_menu {
	margin: auto;
	margin-bottom: 20px;
}

.text_menu td {
	width: 140px;
	height: 40px;
	/* padding: 10 20 10 20; */
	background-color: #A066F2;
	text-align: center;
	/* border-left: 3px solid #E5B3F2;
    border-right: 3px solid #E5B3F2; */
	border: 5px solid #E5B3F2;
	/* border-radius: 20px; */
	margin-left: 10px;
}

.text_menu td a {
	font: normal normal 12px/14px Montserrat, sans-serif;
	color: seashell;
	text-decoration: none;
}

/* .text_menu td a:link {
    color: red;} */

/* .text_menu td a:visited {
    color: grey;} */

.text_menu td a:hover {
	color: #F7C818;
	font-size: 13px;
	font-weight: bold;
}

nav p.index_pag {
	font: normal bold 12px/14px Montserrat, sans-serif;
	color: ivory;
}

/* #endregion WEB cabecera */

/* #region WEB FOOTER */

.icon {
	font-size: 18px;
	margin-left: 20px;
}

footer {
	background-color: #95B5DE;
	margin-top: 60px;
}

table.text_footer a {
	text-decoration: none;
}

table.text_footer a:link {
	color: rgba(59, 19, 43, 1);
}

/* table.text_footer a:visited {
    color: red
} */

table.text_footer a:hover {
	color: #F7C818;
}

table.text_footer {
	margin: auto;
	margin-top: 20px;
	padding-top: 20px;
	padding-bottom: 30px;
}

/* table.text_footer {
    border-collapse: collapse;} */

table.text_footer th {
	font: normal bold 12px/14px Montserrat, sans-serif;
	text-align: left;
	background-color: rgb(65, 79, 97);
	color: blanchedalmond;
	width: 180px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
}

table.text_footer td {
	font: normal normal 11px/16px Montserrat;
	text-align: left;
	vertical-align: top;
}

table.text_footer td ul {
	list-style: none;
	text-indent: -20px;
}

figure.fig_footer {
	width: 250px;
	margin: auto;
	padding-bottom: 30px;
}

div.signature {
	text-align: center;
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
	color: whitesmoke;
	margin: auto;
	float: right;
	margin-top: -30px;
	margin-right: 50px;
}

div.signature img {
	transform: rotate(90deg);
	margin-top: -10px;
}

/* #endregion WEB FOOTER */

/* #region PAG INICIO: CONTENIDO */

section.inicio {
	margin: auto;
	width: 75%;
	height: 680px;
	background-size: cover;
	background-position: 0 center;
	background-image: url(../recursos/foto_index.jpg);
	/* border-radius: 30px; */
}

article.presentation_text {
	width: 30%;
	height: 650px;
	background-color: rgba(235, 112, 186, 0.5);
	padding-top: 30px;
	padding-left: 50px;
	padding-right: 50px;
	/* margin-top: 100px; */
	margin-left: 50px;
}

article.presentation_text h2 {
	font: normal normal 30px/32px Pacifico;
	color: #F7C818;
	text-shadow: 1px 1px rgb(206, 82, 0);
	/* text-decoration-line: overline;
    text-decoration-style: wavy;
    text-decoration-color: #F7C818; */
}

article.presentation_text p {
	font: normal normal 16px/24px montserrat, sans-serif;
	color: seashell;
}

/* #endregion PAG INICIO: SECCION */

/* #region PAG LOCALIZACION: CONTENIDO */

article.text-localizacion {
	width: 660px;
	margin: auto;
	margin-top: 60px;
	margin-bottom: 60px;
}

div.mapa {
	background-color: ivory;
	width: 740px;
	height: 520px;
	border-radius: 30px;
	margin: auto;
	box-shadow: 0px 0px 10px black inset;
}

div.mapa table {
	margin: auto;
	border-collapse: collapse;
}

div.mapa iframe {
	/*box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);*/
	margin-right: 10px;
	margin-left: 20px;
}

.col-map {
	width: 500px;
	height: 520px;
}

.col-icon {
	width: 160px;
	height: 250px;
	font-size: 40px;
	text-align: center;
}

.col-icon i {
	width: 80px;
}

.col-icon a {
	text-decoration: none;
	/*	text-shadow: 4px 4px 5px rgba(0, 0, 0, 0.7);
*/
	background-color: transparent;
	border: 2px solid rgb(244, 164, 96);
	padding: 20px 20px;
	border-radius: 300px;
}

.col-icon a:link {
	/*color: #E5B3F2;*/
	color: rgb(244, 164, 96);
}

.col-icon a:visited {
	/*color: #E5B3F2;*/
	color: rgb(244, 164, 96);
}

.col-icon a:hover {
	/*color: #D766D9;*/
	color: rgb(244, 164, 96);
	background-color: cornsilk;
	border-width: 4px;
	box-shadow: 0 0 10px sandybrown;
}

/* div.mapa table td {
    background-color: ivory;
} */

/*  #endregion PAG LOCALIZACION: CONTENIDO */

/* #region PAG PRODUCTOS CONTENIDO */

section.productos {
	width: 60%;
	margin: auto;
	/* background-color: khaki; */
}

section.productos article {
	/* background-color: rosybrown; */
	min-width: 400px;
	min-height: 740px;
}

div.div_iframe_ramos {
	width: 370px;
	height: 300px;
	background-color: ivory;
	margin-bottom: 10px;
	border-radius: 30px;
	box-shadow: 0px 0px 10px black inset;
	padding: 40px;
}

/* el estilo anterior coloca los visores de los iframe en linea con la sección, que es un 60% del html. 
Con la doble clase del estilo sigiuente consigo flotar el iframe de los ramos y que se desplace a la derecha */

div.div_iframe_ramos.alinear_der {
	float: right;
}

/* div.div_iframe_plantas {
	width: 370px;
	height: 300px;
	background-color: ivory;
	margin-bottom: 10px;
	border-radius: 30px;
	box-shadow: 0px 0px 10px black inset;
	padding: 40px;
	float: right;

} */

iframe.visor_iframe {
	width: 400px;
	height: 300px;
	/* background-color: cyan; */
	display: block;
	margin: auto;
}

div.contenedor_galeria {
	width: 100%;
	/* background-color: red; */
	float: left;
}

figure.fotos_galeria {
	margin: 0px;
	margin-bottom: 10px;
	margin-right: 10px;
	width: 150px;
	height: 150px;
	background-color: ivory;
	/* opacity: 0.5; */
	float: left;
	border-radius: 10px;
	border: 3px solid #A066F2;
}

/* En este caso el estilo anterior da formato a todas las fotos botones, y el estilo siguiente, 
usando una doble clase, cambia el float de únicamente las que interesa, pero teniendo en cuenta que 
ha de estar en este orden el el CSS. De esta manera evito dupilicar el estilos y variar solo un elemento */

div.contenedor_galeria figure.alinear_der {
	float: right;
}

figure.fotos_galeria img {
	border-radius: 7px;
	filter: grayscale(60%);
	/* filter: sepia(100%); */
	/* filter: blur(2px); */
	/* filter: brightness(80%); */
	/* filter: contrast(60%); */
	/* filter: saturate(80%); */
	/* filter: drop-shadow(20px 20px 1px black); */
}

figure.fotos_galeria img:hover {
	opacity: 1;
	filter: grayscale(0);
	filter: sepia(0%);
	filter: saturate(100%);
}

div.clear_both {
	clear: both;
}

/* #endregion PAG PRODUCTOS CONTENIDO */

/* #region PAG NOSOTROS CONTENIDO */

div.txt_nosotros {
	margin-left: 25%;
	margin-right: 25%;
	min-width: 300px;
}

video.nosotros {
	display: block;
	background-color: ivory;
	padding: 50px;
	margin: auto;
	margin-top: 60px;
	border-radius: 30px;
	box-shadow: 0px 0px 10px black inset;
}

/* #endregion PAG NOSOTROS CONTENIDO */

/* #region PAG CONTACTO CONTENIDO */

div.contacto {
	width: 50%;
	margin: auto;
}

div.formulario {
	width: 512px;
	/* height: 500px; */
	margin: auto;
	margin-top: 30px;
	background-color: ivory;
	border-radius: 30px;
	box-shadow: 0px 0px 10px black inset;
	padding: 50px;
	padding-bottom: 30px;
	overflow: hidden;
}

div.formulario input, div.formulario textarea {
	width: 500px;
	height: 20px;
	padding: 3px 5px;
	margin-bottom: 10px;
	/* position: relative;
	right: 350px; */
	background-color: #E5B3F2;
	border: 1px solid rgb(155, 55, 156);
	border-radius: 5px;
}

::placeholder {
	color: rgb(155, 55, 156);
	/* opacity: 1; Firefox  */
	font-style: italic;
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

div.formulario textarea {
	height: 100px;
	margin-bottom: 10px;
	margin-top: 10px;
}

div.formulario label {
	color: rgb(155, 55, 156);
	font-style: italic;
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	font-size: 12px;
}

div.formulario input.checkbox {
	margin-left: -240px;
	margin-right: -230px;
}

div.formulario input.submit {
	/* width: 40px; */
	width: 100px;
	height: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	float: right;
	background-color: transparent;
	border: 2px solid rgb(244, 164, 96);
	/* sandybrown */
	/* display: block;
	margin: auto; */
	border-radius: 50px;
	margin-top: 30px;
}

div.formulario input.submit:hover {
	background-color: cornsilk;
	border-width: 4px;
	width: 96px;
	padding-top: 8px;
	padding-bottom: 8px;
	/* outline: 4px solid black; */
	box-shadow: 0 0 10px sandybrown;
}

#doc {
	display: block;
}

/* #endregion PAG CONTACTO CONTENIDO */

/* Color Theme Swatches in Hex
.Floristeria-Flores-1-hex { color: #D766D9; }
.Floristeria-Flores-2-hex { color: #E5B3F2; }
.Floristeria-Flores-3-hex { color: #A066F2; }
.Floristeria-Flores-4-hex { color: #95B5DE; }
.Floristeria-Flores-5-hex { color: #F7C818; } */

/* Color Theme Swatches in RGBA
.Floristeria-Flores-1-rgba { color: rgba(215, 102, 217, 1); }
.Floristeria-Flores-2-rgba { color: rgba(229, 179, 242, 1); }
.Floristeria-Flores-3-rgba { color: rgba(160, 102, 242, 1); }
.Floristeria-Flores-4-rgba { color: rgba(149, 181, 222, 1); }
.Floristeria-Flores-5-rgba { color: rgba(247, 200, 24, 1); } */

/* Color Theme Swatches in HSLA
.Floristeria-Flores-1-hsla { color: hsla(298, 60, 62, 1); }
.Floristeria-Flores-2-hsla { color: hsla(287, 70, 82, 1); }
.Floristeria-Flores-3-hsla { color: hsla(264, 84, 67, 1); }
.Floristeria-Flores-4-hsla { color: hsla(213, 52, 72, 1); }
.Floristeria-Flores-5-hsla { color: hsla(47, 93, 53, 1); } */