@import "fuentes.css";
@import "colores.css";
@import "hover.css";

/* ==============================================================
/*	MENU
/* ============================================================== */
	#rieggo-navegacion {
		font-family: 'rotoplas-regular';
		background: rgb(255, 255, 255);
		transition: all ease .3s;
		padding: 0 3rem;
		padding-top: .5rem !important;
		/* padding-bottom: .5rem !important; */
		/* box-shadow: 0px 0px 12px 0px rgb(0 0 0 / 50%); */
	}

	#navegacion-logo {
		width: 120px;
	}

	#navegacion-logo-rotoplas {
		width: 100px;
	}

	.navegacion-contactos {
		color: #49c0b1;
		transition: all ease .3s;
	}
	.navegacion-contactos svg {
		fill: #49c0b1;
		transition: all ease .3s;
	}
	.navegacion-contactos:hover {
		color: #277067;
	}
	.navegacion-contactos:hover svg {
		fill: #277067;
	}

	#navegacion-contacto {
		background: #49c0b1;
		color: #fff;
		border-radius: 2rem;
		padding: 0.25rem 2rem;
		transition: all ease .3s;
	}
	#navegacion-contacto:hover {
		background: #277067;
	}

	#toggleMobileMenu {
		transition: all ease .5s;
	}

	.dropdown-toggle::after {
		color: #49c0b1;
	}

	#icono-telefono {
		display: inline-block;
		width: 16px;
		height: 16px;
		background-color: #49c0b1;
		-webkit-mask: url(/images/phone-flip-solid.svg) no-repeat center;
		mask: url(/images/phone-flip-solid.svg) no-repeat center;
	}

	#icono-whatsapp {
		display: inline-block;
		width: 20px;
		height: 20px;
		background-color: #49c0b1;
		-webkit-mask: url(/images/whatsapp.svg) no-repeat center;
		mask: url(/images/whatsapp.svg) no-repeat center;
	}

	.rieggo-btn {
		background-color: #49c0b1;
		color: #fff;
		border-radius: 2rem;
		transition: all ease .3s;
	}
	.rieggo-btn:hover {
		background-color: #277067;
		color: #fff;
	}

	.dropdown:hover .dropdown-menu {
		display: block;
		margin-top: 0; /*remove the gap so it doesn't close*/
	}

	@media only screen and (max-width: 768px) {
		#rieggo-navegacion {
			padding: 0 1rem;
		}
	}
	@media only screen and (max-width: 767px) {
		#rieggo-navegacion {
			padding-bottom: .5rem !important;
		}
	}
/* menu */

h2 {
	color: #49c0b1;
	margin: 0;
	font-family: 'rotoplas-light';
}

.linea {
	display: inline-block;
	width: 50px;
	height: 2px;
	background: #49c0b1;
}

/* ==============================================================
/*	FOOTER
/* ============================================================== */
	footer {
		background: #002554;
		color: #fff;
		padding: 2rem 3rem;
	}

	footer h2 {
		font-size: 20px;
		color: #fff;
	}
	
	#footer-logo-rotoplas {
		width: 131px;
	}

	.footer-btn {
		text-decoration: none;
		padding: .25rem;
		margin: .25rem 0;
		color:#fff;
		transition: all ease .3s;
	}
	.footer-btn:hover {
		color:#009cde;
		font-family: rotoplas-regular;
	}

	.footer-btn img {
		margin-right: .5rem;
		vertical-align: middle;
	}
	.footer-btn span {
		vertical-align: top;
		display: inline-block;
		width: 85%;
	}

	#footer-aviso {
		color: #009cde;
	}
	#footer-aviso a {
		color: #009cde;
	}
	#footer-aviso a:hover {
		color: #fff;
		font-family: rotoplas-regular;
	}

	@media only screen and (max-width: 768px) {
		footer {
			padding: 2rem 1rem;
		}
	}
/* footer */


#form input,
#form select {
	width: 100%;
	border-style: none;
	padding: 9px 12px;
}
#form input {
	background: transparent;
    border-color: rgb(245, 245, 245);
}
#form input:focus-visible,
#form select:focus-visible {
	outline: none;
	color: rgba(0,0,0,.87);
}
#form select {
	background-color: rgb(245, 245, 245);
	height: 38px;
	border-radius: 10px;
}
#form button {
    background-color: #00c7b1;
    color: #fff;
    border-radius: 28px;
    width: auto;
    padding: 0 20px;
    border-style: none;
    height: 42px;
    line-height: 1;
}
#form textarea {
    background: transparent;
    border: none;
    width: 100%;
    padding: 9px 12px;
}
.error--text {
    color: #ff5722 !important;
    caret-color: #ff5722 !important;
}