/*	GENERAL	*/
/*			*/
/*			*/

* {
	padding:0;
	margin:0;
	box-sizing:border-box;
	text-decoration:none;
	list-style:none;
}

html {
	height:100%;
	font-size:100%;
}

@media screen and (max-width:800px) {
	html {
		font-size:80%;
	}
}

body {
	font-size:10px;
	height:100%;
}

html,
body,
section,
header,
footer {
	position:relative;
	display:block;
	width:100%;
}

img {
	display:block;
	border:none;
	vertical-align:top;
	max-width:100%;
	height:auto;
}

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
HEADER
–––––––––––––––––––––––––––––––––––––––––––––––––– */

header {
	position:relative;
	display:block;
	border:solid rgba(0,0,0,.15);
	border-width:0 0 1px 0;
}

.dataheader {
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:space-between;
	padding:18px;
	color:#FFF;
	font-family: 'Jura', sans-serif;
	background-color:#171717;
}

@media screen and (max-width:800px){
	.dataheader {
		color:#777;
		background-color:#EEE;
		background-image:url(../images/back-header.jpg);
		background-size:cover;
		background-position:center;
		background-repeat:no-repeat;
	}

	.dataheader .info {
		order:1;
	}

	.dataheader .search {
		order:3;
	}

	.dataheader .redes {
		order:2;
	}
}

.dataheader ul {
	display:flex;
	flex-wrap:wrap;
	align-items:center;
}

.dataheader ul li {
	font-size:0.9rem;
	margin-right:20px;
}

.dataheader ul li a {
	color:#FFF;
	font-weight:bold;
}

.dataheader i {
	font-size:0.8rem;
	margin-right:10px;
}

@media screen and (max-width:800px){
	.dataheader .info li {
		width:100%;
		margin-bottom:10px;
		margin-right:0;
		font-size:1.3rem;
		font-weight:bold;
		text-align:center;	
	}
	.dataheader .info i {
		color:#A8CF45;
		font-size:1.5rem;
	}

	.dataheader ul li a {
		color:#000;
	}
}

.dataheader .redes {
	display:flex;
	align-items:center;
}

.dataheader .redes a {
	display:flex;
	justify-content:flex-start;
	align-items:center;
	color:#FFF;
	margin-right:10px;
}

.dataheader .redes img {
	width:25px;
	margin-right:10px;
}


@media screen and (max-width:800px){

	.dataheader .redes {
		width:100%;
		justify-content:center;
		padding:20px 0 20px 0;
	}

	.dataheader .redes a{
		margin:0 10px 0 10px;
	}

	.dataheader .redes a i {
		color:#777;
		font-size:2.8rem;
	}

	.dataheader .redes a span {
		display:none;
	}

	.dataheader .redes img {
		width:60px;
		margin-right:0;
	}
}

.search form {
	display:flex;
	justify-content:flex-start;
	align-items:center;
}

.search input {
	padding:10px;
	color:#777;
	font-size:1rem;
	font-family: 'Jura', sans-serif;
	border:none;
	border-radius:5px 0 0 5px;
	outline:none;
}

.search button {
	width:50px;
	padding:8px;
	color:rgba(0,0,0,.5);
	border:none;
	outline:none;
	border-radius:0 5px 5px 0;
	background-color:#777;
}

.search button i {
	color:#FFF;
	font-size:1.4rem;
}

@media screen and (max-width:800px){
	.search {
		width:100%;
	}
	.search form {
		width:100%;
	}

	.search input {
		width:100%;
	}

	.search button {
		background-color:#A8CF45;
	}
}


/* menu */

.nav-main {
	position:relative;
	padding:15px 0 15px 0;
}

.nav-main input[type="checkbox"] {
	display:none;
}

.toggle-menu,
.toggle-menu-main {
	display:none;
}

.menu {
	position:absolute;
	left:0;
	width:400px;
	transition:all .15s ease;
	box-shadow:0 0 10px rgba(0,0,0,.15);
	background-color:#FFF;
	z-index:999;
}

.menu li {
	position:relative;
	border:solid rgba(0,0,0,.15);
	border-width:0 0 1px 0;
}

.menu li:last-child {
	border:none;
}

.menu > li {
	width:100%;
}

.menu li a {
	display:flex;
	align-items:center;
	justify-content:flex-start;
	padding:20px;
	color:#474747;
	font-size:1.1rem;
	font-family: 'Jura', sans-serif;
	transition:all .15s ease-in-out;
}

.menu li:hover > a {
	color:#FFF;
	padding-left:30px;
	background-color:#131313;
}

.menu .submenu {
	position:absolute;
	opacity:0;
	top:0;
	left:400px;
	width:400px;
	visibility:hidden;
	background-color:#FFF;
}

.menu li:hover .submenu {
	position:;
	opacity:1;
	visibility:visible;
}

.menu .submenu a {
	font-size:1rem;
}


.toggle-menu-main {
	position:relative;
	display:block;
	font-size:1.5rem;
	font-weight:400;
	text-transform:capitalize;
	font-family: 'Julius Sans One', sans-serif;
}


.toggle-menu-main span {
	display:flex;
	justify-content:flex-start;
	align-items:center;
	right:10px;
	top:10px;
	padding:10px;
}

.toggle-menu-main span i {
	padding:8px;
	color:#FFF;
	font-size:1.2rem;
	margin-left:10px;
	border-radius:5px;
	background-color:#A9DA30;
}

.toggle-menu {
	position:absolute;
	display:flex;
	justify-content:center;
	align-items:center;
	right:20px;
	width:30px;
	height:30px;
	font-size:1.2rem;
	border-radius:30px;
	transform:rotate(270deg);
}

#tm ~ .menu {display: none;transition:all .15s ease;} 
#tm:checked ~ .menu {display:block;
	align-items:center;transition:all .15s ease;}


@media screen and (max-width:800px){
	.menu {
		width:100%;
	}

	.menu .submenu {
		position:relative;
		width:100%;
		left:0;
		opacity:1;
		visibility:visible;
		background-color:#EDEDED;
	}

	.toggle-menu-main {
		justify-content:center;
	}

	.toggle-menu-main span {
		justify-content:center;
	}

	.toggle-menu {
		transform:rotate(0);
	}

	#sm1 ~ .submenu {display:none;}
	#sm1:checked ~ .submenu {display:block;}
	#sm2 ~ .submenu {display:none;}
	#sm2:checked ~ .submenu {display:block;}
}

.nav-main .logo img {
	max-width:250px;
	height:auto;
}

@media screen and (max-width:800px){
	.nav-main .logo {
		text-align:center;
	}
}

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
SECCIONES
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* title */

.title {
	font-family: 'Julius Sans One', sans-serif;
}

h1.title {
	padding:25px 0 15px 0;
	font-size:1.2rem;
}

h2.title {
	font-size:1.4rem;
	font-weight:bold;
	font-family: 'Julius Sans One', sans-serif;
}

span.subtitle {
	display:block;
	padding-bottom:5px;
	margin-bottom:15px;
	color:#777;
	font-size:.8rem;
	font-family: 'Julius Sans One', sans-serif;
	border:solid rgba(0,0,0,.15);
	border-width:0 0 1px 0;
}

/* item base */

.box-flex {
	display:flex;
	justify-content:space-between;
	align-items:center;
	width:95%;
	max-width:1420px;
	margin:auto;
}

@media screen and (max-width:800px){
	.box-flex {
		display:flex;
		flex-wrap:wrap;
	}
}

@media screen and (min-width:1200px){
	.box-flex {
		width:95%;
		max-width:1600px;
	}
}

.box-center {
	position:relative;
	display:block;
	margin:auto;
	width:95%;
	max-width:1420px;
	margin:auto;
}

.box-title {
	color:#000;
	font-size:2rem;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:300;
	text-align:center;
	margin-bottom:50px;
}

.main {
	align-items:flex-start;
	padding:20px 0 50px 0;
}

.main aside {
	flex:0 0 325px;
	background-color:#EDEDED;
}

@media screen and (max-width:800px){
	.main aside {
		flex:none;
		width:100%;
	}
}

.main aside > div {
	padding:30px;
	border:solid rgba(0,0,0,.15);
	border-width:0 0 1px 0;
}

.main aside > div:last-child {
	border:none;
}

.main aside ul {
	font-family: 'Jura', sans-serif;
}

.main aside ul li {
	display:block;
	padding-bottom:5px;
	margin-bottom:20px;
}

.main aside li a {
	color:#777;
	font-size:0.8rem;
	font-weight:bold;
}

.main > div {
	flex:1;
	padding-left:30px;
}

@media screen and (max-width:800px) {
	.main aside {
		order:2;
	}
	.main > div {
		order:1;
		padding-left:0;
	}
}

a.btn {
	display:inline-block;
	padding:10px 35px 10px 35px;
	margin:10px 0 25px 0;
	color:#FFF;
	font-size:1rem;
	font-weight:bold;
	font-family: 'Julius Sans One', sans-serif;
	border-radius:20px;
	background-color:#A9DA30;
}

button.btn {
	display:inline-block;
	padding:20px 45px 20px 45px;
	margin:10px 0 25px 0;
	color:#FFF;
	font-size:1.3rem;
	font-weight:bold;
	font-family: 'Julius Sans One', sans-serif;
	border:none;
	background-color:#A9DA30;
}

/* fotos dobles */

.foto {
	position:relative;
	display:block;
	width:100%;
	height:300px;
	background-position:center center;
	background-size:cover;
	background-repeat:no-repeat;
	transition:all .15s ease-in-out
}

@media screen and (min-width:1200px){
	.foto {
		height:400px;
	}
}

.foto_h {
	height:400px;
}

.foto a {
	width:100%;
	height:100%;
	display:block;
	opacity:0;
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	transition:all .15s ease-in;
	justify-content:space-between;
}

.foto:hover a {
	opacity:1;
}

/* items */

.item .info {
	text-align:center;
}

.item a {
	color:#474747;
}

.item .title {
	font-size:1rem;
	font-weight:700;
}

.item .price {
	color:#A9DA30;
	font-size:1rem;
	font-weight:bold;
	font-family: 'Julius Sans One', sans-serif;
}

/* redes compartir */

.main .redes {
	padding:25px 0 0 0;
}

.main .redes h5 {
	margin-bottom:25px;
	color:#474747;
	font-size:1.5rem;
	font-family: 'Josefin Sans', sans-serif;
}

.main .redes a {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	width:40px;
	height:40px;
	margin-right:10px;
	margin-bottom:10px;
	color:#FFF;
	font-size:1rem;
	font-weight:300;
	font-family: 'Josefin Sans', sans-serif;
}

@media screen and (max-width:800px){
	.main .redes a {
		font-size:1.3rem;
	}
}

.main .twitter {
	background-color:#0087BA;
}

.main .facebook {
	background-color:#3B5998;
}

.main .google {
	background-color:#C23321;
}

.main .whatsapp {
	display:none;
	background-color:#57BE6B;
}

@media screen and (max-width:800px){
	.main .whatsapp {
		display:inline-block;
	}
}


/*INDEX*/

.servi {
	width:90%;
	max-width:1000px;
	margin:auto;
	padding:50px 0 10px 0;
}

.servi .item .foto {
	border:solid 5px #a8cf45;
	transition:all .25s linear;
	transition-delay:.1s;
}

.servi .item:hover .foto {
	border:solid 5px #00ABF7;
}

.servi .item .info > a {
	display:flex;
	justify-content:center;
	align-items:center;
	width:90%;
	height:150px;
	margin:auto;
	background-image:url(../images/btn-green.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	transform:translateY(-100px);
	transition:all .15s ease-in-out;
}

/*
.servi .item:nth-child(even) .info > a {
	background-image:url(../images/btn-green.png);
}

.servi .item:nth-child(odd) .info > a {
	background-image:url(../images/btn-blue.png);
}
*/

.servi .item:nth-child(2n+1):hover .info > a {
	background-image:url(../images/btn-blue.png);
	transform:translateY(-80px);
}

.servi .item:nth-child(2n):hover .info > a {
	background-image:url(../images/btn-red.png);
}

.servi .item a .title {
	width:85%;
	font-size:1.2rem;
	font-weight:bold;
	transform:translateY(-10px);
}

.desta {
	width:90%;
	max-width:1000px;
	margin:auto;
	padding:10px 0 50px 0;
}

@media screen and (min-width:1200px){
	.desta {
		width:90%;
		max-width:1600px;
	}
	.servi {
		width:90%;
		max-width:1600px;
	}
}

.promo {
	width:90%;
	max-width:1000px;
}

@media screen and (min-width:1200px){
	.promo {
		width:90%;
		max-width:1600px;
	}
}

.promo > div {
	width:100%;
}

.promo > div .info {
	width:40%;
}

.promo .info .title {
	font-size:3rem;
	font-weight:bold;
}

.promo .info p {
	color:#777;
	font-size:1.8rem;
	font-family: 'Jura', sans-serif;
}

.promo > div .banner {
	width:60%;
}

@media screen and (max-width:800px){
	.promo > div .info {
		width:100%;
	}

	.promo > div .banner {
		width:100%;
	}
}

.back {
	display:block;
	width:100%;
	max-width:1900px;
	margin:auto;
}

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
CATALOGO
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.bar {
	display:flex;
	justify-content:flex-start;
	align-items:center;
	margin:10px 0 25px 0;
	font-family: 'Jura', sans-serif;
	background-color:#EDEDED;
}

.bar .btn {
	display:flex;
	background-color:#A9DA30;
}

.bar .btn a {
	padding:10px;
	color:#FFF;
	font-size:1rem;
	font-weight:bold;
}

.bar ul {
	display:flex;
	align-items:center;
	padding-left:20px;
}

.bar ul li {
	color:rgba(0,0,0,.45);
	font-size:1rem;
	margin-right:10px;
}

.catalogo {
	flex:1;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}

.catalogo > li {
	width:30%;
	margin-bottom:40px;
}

@media screen and (max-width:800px){
	.catalogo > li {
		width:100%;
	}
}

@media only screen and (min-width:801px) and (max-width:1024px){
	.catalogo > li {
		width:42%;
	}
}

.catalogo .price {
	display:block;
	margin:auto;
	color:#A9DA30;
	font-size:1rem;
	font-weight:bold;
	font-family: 'Jura', sans-serif;
	text-align:center;
}

.catalogo .item {
	text-align:center;
}

.catalogo .item .title {
	text-align:center;
	margin-bottom:0;
}

.producto {
	align-items:flex-start;
}

.producto .photo {
	flex:1;
}

.producto .info {
	flex:0 0 450px;
	border:solid rgba(0,0,,0.15);
	border-width:0 0 1px 0;
}

.producto .info .title {
	font-size:2rem;
	font-weight:700;
}

.producto .info .price {
	display:block;
	margin-bottom:25px;
	color:#A9DA30;
	font-size:2.5rem;
	font-weight:bold;
	font-family: 'Julius Sans One', sans-serif;
}

.producto .info .spec {
	font-size:0.9rem;
	font-family: 'Jura', sans-serif;
	line-height:18px;
}

.producto form {
	padding:10px 0 10px 0;
}

.producto input {
	width:100%;
	max-width:250px;
	padding:10px;
	border:solid 1px rgba(0,0,0,.15);
	border-radius:3px;
}

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
BUSCAR
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.lista .item {
	display:flex;
	justify-content:flex-start;
	align-items:flex-start;
	padding:20px;
	margin-bottom:10px;
	border:solid rgba(0,0,0,.05);
	border-width:0 0 1px 0;
	background-color:#FFF;
}

.lista .item > div {

}

.lista .item .foto {
	flex:0 0 150px;
	height:150px;
}

.lista .item .info {
	flex:1;
	padding-left:20px;
	text-align:left;
}

.lista .item .title {
	padding-top:0;
}

.lista .item .title:hover a {
	color:#A9DA30;
}

.lista .item .spec {
	display:block;
	margin-bottom:15px;
	width:70%;
	font-size:0.8rem;
	font-family: 'Jura', sans-serif;
	line-height:15px;
}

.lista .item .price {

}


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
ARTICULOS Y NOTICIAS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.servicio {
}

.servicio .info > h1 {
	padding-bottom:5px;
	margin-bottom:10px;
	font-size:3rem;
	border:solid rgba(0,0,0,.15);
	border-width:0 0 1px 0;
}

.servicio .info > h2 {
	color:#777;
	font-size:1rem;
}

.servicio h1,h2,h3 {
	font-family: 'Julius Sans One', sans-serif;
}

.servicio .spec > div {
	margin-top:20px;
	color:#474747;
	font-size:1rem;
	font-family: 'Jura', sans-serif;
}

.servicio .galeria {
	width:100%;
}

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
CONTACTOS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.contacto {
	padding:50px 0 50px 0;
	background-color:#FAFAFA;
	background-image:url(../images/form.jpg);
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
}

.contacto .title {
	text-align:center;
}

.contacto form {
	display:block;
	width:100%;
	max-width:500px;
	padding:20px;
	margin:auto;
	box-shadow:0 0 10px rgba(0,0,0,.15);
	background-color:rgba(255,255,255,.8);
}

.contacto input,
.contacto textarea {
	display:block;
	
	padding:10px;
	margin-bottom:10px;
	color:#777;
	font-size:1rem;
	font-family: 'Jura', sans-serif;
	border:solid 1px rgba(0,0,0,.15);
	border-radius:3px;
}

.contacto input {
	width:80%;
}

@media screen and (max-width:800px) {
	.contacto .input {
		width:100%;
	}
}

.contacto textarea {
	width:100%;
	height:250px;
	resize:none;
}

/* respuesta contacto */

.alert > div {
	display:flex;
	justify-content:center;
	align-items:center;
	padding:10px;
	margin-bottom:50px;
	font-size:1.4rem;
	font-weight:700;
	font-family: 'Karla', sans-serif;
}

.alert > div i {
	margin-right:20px;
}

.complete {
	color:#D1E6A7;
	background-color:#6EAA06;
}

.error {
	color:#FFF;
	background-color:#FF0000;
}


/* ––––––––––––––––––––––––––––––––––––––––––––––––––
FOOTER
–––––––––––––––––––––––––––––––––––––––––––––––––– */

footer {
	background-color:#FFF;
}

.datafooter {
	padding:50px 0 50px 0;
	align-items:flex-start;
}

.datafooter ul {
	width:22%;
}

@media screen and (max-width:800px){
	.datafooter ul {
		width:100%;
		margin-bottom:25px;
		text-align:center;
	}
}

.datafooter li {
	position:relative;
	display:block;
	margin-bottom:10px;
	color:#333;
	font-weight:bold;
	font-size:0.8rem;
	font-family: 'Jura', sans-serif;
	line-height:15px;
}

.datafooter li .title {
	padding-top:0;
	color:#000;
	font-size:1.4rem;
	font-weight:bold;
}

.datafooter li a {
	color:#A9DA30;
}

@media screen and (max-width:800px){
	.datafooter li img {
		margin:auto;
	}
}

/* CALL WHATSAPP */

.call {
	position:fixed;
	right:10px;
	top:50vh;
	margin-top:-60px;
	z-index:9999;
}

.call form button {
	display:flex;
	justify-content:center;
	align-items:center;
	width:120px;
	height:120px;
	color:#FFF;
	font-size:2.5rem;
	cursor:pointer;
	border:none;
	outline:none;
	border-radius:20px;
	transition:all .15s ease-in-out;
	background-color:transparent;
}

.call form button:hover {
	transform:translateX(-5px);
}

@media screen and (max-width:400px){
	.call form button {
		width:45px;
		height:45px;
		font-size:2rem;
	}
}

@media only screen and (min-width:401px) and (max-width:1100px){
	.call form button {
		width:90px;
		height:90px;
		font-size:2.1rem;
	}
}

.call button.whatsapp {
	margin-bottom:10px;
}



/* CANVAS */

.backcanvas {
	background-color:#171717;
}

.backcanvas > div {
	font-family: 'Jura', sans-serif;
}

.backcanvas .redes {
	display:flex;
	align-items:center;
}

.backcanvas .redes a {
	color:#FFF;
	margin-right:10px;
}

#canvas {
	display:flex;
	justify-content:center;
	align-items:center;
	padding:10px 0 10px 0;
	color:#FFF;
}

@media screen and (max-width:800px) {
	#canvas {
		padding:10px;
	}

	#canvas p {
		display:none;
	}

	.backcanvas .redes {
		display:none;
	}
}

/** boton arriba **/

.ir-arriba
{
padding:10px;
color:#16191D;
font-size:15px;
text-transform:uppercase;
cursor:pointer;
z-index:20;	
border-radius:2px;
background:#4C525B;
transition:all .1s ease-in-out .1s;
}

.ir-arriba:hover
{
color:#7CBA2B;
background-color:#A5CD39;
transition:all .1s ease-in-out .1s;
}

/* FIN */

.none {
	display:none;
}

.no {
	display:none;
}

.chat {
	position:fixed;
	right:0;
	bottom:0;
}