/*
font-family: 'Averia Serif Libre', cursive;
font-family: 'Red Hat Display', sans-serif;
*/
:root {
  --red: rgb(227,43,7);
  --green: rgb(1,146,69);
  --piel: rgb(252,240,231);
  --violeta: rgb(115,33,71);
  --azul: rgb(2,112,188);
}

img {max-width:100%;}
a {cursor:pointer;text-decoration:none;color:white;}
textarea:focus, input:focus, select:focus, button:focus {outline:none;outline:0;}
.center {text-align:center;}
* {box-sizing:border-box;}
body {color:#333;font-family:'Red Hat Display', sans-serif;font-size:20px;}

.bg-dark {background:var(--red)!important;}
.nav-link {color:white;text-transform:uppercase;}
.navbar {padding:0 10px;font-size:0.9em;}
.navbar-dark .navbar-nav .nav-link {color:white}
.navbar .diag {transform:skewX(330deg);padding:20px 30px}
.navbar .diag:hover, .navbar .diag:focus, .navbar .diag:hover, .navbar .activo {background:rgb(224,181,175);}
.navbar .diag:hover p, .navbar .diag:focus p, .navbar .activo p {color:black}
/*color:black; , .navbar .diag:focus p*/
.navbar .diag p {margin:0;transform:skewX(30deg);padding:0 20px;}
.dropdown-menu[data-bs-popper] {margin-top:0px;left:-20px}
.dropdown-menu {border-radius:0;border:0;padding:0}
.dropdown-item {padding:.5rem 1rem;border-bottom:1px solid var(--red);}
li:last-child .dropdown-item{border-bottom:0;}
.dropdown-item:hover, .dropdown-item.activo {background:var(--green);color:white}
.navbar-brand img {max-height:55px;}
.navbar-expand-lg .navbar-nav {width: 100%;justify-content: right;margin-left:25px;}

@media (max-width:1320px) {
	.navbar {padding:0 10px 0 10px;} 
	.navbar .diag p {padding:0 10px;}
}
@media (max-width:1250px) {
.navbar {padding:0 5px;}
}

@media (max-width:1200px) {
	body{font-size:18px;}	
	.navbar .diag p {padding:0 5px;}
	.navbar-brand img {max-height:45px;}
	nav .container-fluid {padding:0;}
}
@media (max-width:990px) {
	body{font-size:16px;}
	.navbar, .navbar > .container-fluid {padding:0;}
	.navbar-dark .navbar-toggler {color:rgb(255,255,255); border:0;}
	.navbar-toggler:focus {box-shadow: none;}
	.navbar .diag, .navbar .diag p {transform:none; padding:0;}
	.navbar .diag p {color:black;padding:5px 20px;border-bottom: 1px solid black}
	.navbar-collapse {background:var(--piel); padding:0 0;}
	.navbar li:last-child .diag p {border-bottom:0;}
	li:last-child .dropdown-item{border-bottom:1px solid black;}
	.dropdown-item {padding:5px 5px 5px 30px; border-bottom: 1px solid var(--red);}
	.navbar-brand img {margin:10px 20px; max-height:47px;}
	.navbar-expand-lg .navbar-nav {margin-left:0px;} 
}

.resto {padding-top:65px;}

header .carousel-caption {text-align:left;padding:0;right:10%;left:10%}
header .carousel-caption h1, header .carousel-caption p a {font-family:'Averia Serif Libre', sans-serif;}
header .carousel-caption h1 {color:var(--red);}
header .carousel-caption p {font-weight:500}
header .carousel-caption p:last-child {margin-top:1rem;}
header .carousel-caption p a {background-color:var(--red);border-color:var(--red); transform:skewX(350deg);}
header .carousel-caption p a:hover, header .carousel-caption p a:focus {color:black;background:white;border-color:black;}
header .carousel-caption img {margin-bottom:15px;}
header .carousel-caption .btn {border-radius:0;}
.carousel-indicators [data-bs-target] {box-sizing: content-box; -ms-flex: 0 1 auto; flex: 0 1 auto; width:16px; height:16px; line-height: 30px; border-radius: 50%; text-align: center; margin-right: 3px; margin-left: 3px; text-indent: unset; cursor: pointer; background-color:rgb(180,186,193); background-clip: unset; border: 1px solid white; opacity:1; }
header .carousel-indicators .active {background-color:var(--red);border-color:var(--red);}

@media (max-width:1200px) {
	.resto {padding-top:62px;}
}

@media (max-width:990px) {
	.carousel-control-prev, .carousel-control-next {display:none;}
	header .carousel-caption {left:20px;right:20px}
}
@media (max-width:780px) {
	header {font-size:14px;}
	header .carousel-caption img {display:none}
}
@media (max-width:760px) {
	header {font-size:12px;}
	.carousel-caption p {margin-bottom:5px;}
	.carousel-caption p:last-child {margin-bottom:0;}
}
@media (max-width:590px) {
	.navbar-brand {margin-right:0}
	.navbar-brand img {max-height:33px;margin:20px 10px}
	.resto {padding-top:69px;}
	header .carousel-caption p a {font-size:0.8em;}
	header .carousel-caption p:last-child {margin-top:0.5rem;}
}
@media (max-width:354px) {
	.navbar-brand img {max-height:29px;}
}
@media (max-width:320px) {
	.navbar-brand img {max-height:25px;}
	.resto {padding-top:55px;}
}

footer, .foot {background:var(--red);display:flex;justify-content:center;align-items:center; margin-top:1rem;padding:10px 20px}
footer div, footer img {padding:0 25px;}
footer div ul {list-style:none;padding:0;margin:0;color:white}
footer a:hover {color:white}
footer div li {font-size:0.9em;margin:0.5em 0;}
footer div:nth-child(2) li {font-size:1.3em;margin:0.5em 0;}
footer div:nth-child(2) li i {font-size:1.2em;}
footer div:nth-child(3) {padding-top: 16px}
footer div:nth-child(3) li {display:flex;align-items:center;}
footer div:nth-child(3) li {font-size:1.2em;margin:0.5em 0;}
footer div:nth-child(3) li i {font-size:1.4em;padding-right:0.5em;}
.foot {background:white;margin-top:0}
footer img {width:370px}
.foot img, .foot p {margin:0 10px;}
.foot img:first-child {width:70px;}
.foot p {font-size:0.8em;}
.elWhatsapp {position:fixed;bottom:90px;right:5px}

@media (max-width:1200px) {
	footer div, footer img {padding:0 15px;}
	footer img {width:110px;}
	.elWhatsapp img {width:75px;}
	.foot img:first-child {width:250px;}
	.foot img:nth-child(2) {width:50px;}
}
@media (max-width:990px) {
	footer img {width:95px;}
	.foot p {max-width:400px;font-size:0.7em;}
	.elWhatsapp img {width:60px;}
	.elWhatsapp {bottom:90px;right:5px}
}
@media (max-width:875px) {	
	footer div, footer img {padding:0 10px;}
	footer img {width:85px;}
	footer div:nth-child(3) li {font-size:1.1em;margin:0.5em 0;}
	footer div:nth-child(3) li i {font-size:1.2em;}
}

@media (max-width:760px) {
	footer, .foot {display:block;text-align:center;}
	footer div {padding:0;width:219px; margin:0 auto;text-align: left;}
	footer .dire {display:none;}
	footer img {display:none;}	
	footer div:nth-child(2) li, footer div:nth-child(3) li, footer div:nth-child(4) li {font-size: 0.9em; margin: 0.5em 0;}
	.foot img:nth-child(2) {width:70px;}
	.foot p {margin:20px auto 0;}
}

@media (max-width:590px) {
	.foot img:nth-child(1) {width:180px;}
	.foot img:nth-child(2) {width:50px;}
	.carousel-indicators {margin-bottom:5px;}
	.carousel-indicators [data-bs-target] {width:10px;height:10px;}
	footer {padding:10px;margin-top:0}
	.foot p {margin:10px auto 0;font-size:0.7em;}
}


/************* ********************/
.circulos {display:flex;align-items:center;justify-content:space-between;padding:1rem 3rem;}
.circulos div:first-child img:last-child {display:none}
.circulos div:first-child {width:60%;padding:20px 80px;}
.circulos div:last-child {width:40%;text-align:center;}
.circulos div p {font-size:1.3em;line-height:2em;max-width:500px;margin:1em auto 0;}

@media (max-width:1500px) {
	.circulos div:first-child {padding:20px 10px;}
	.circulos div p {font-size:1.2em;line-height:1.8em;max-width:400px;}
}
@media (max-width:1200px) {
	.circulos {padding:1rem;}
	.circulos div:first-child {padding:0;width:65%;}
	.circulos div:last-child {padding:0 30px;width:35%;}
	.circulos div:last-child img {width:80%;}
	.circulos div p {font-size:1.1em;line-height:1.7em;}
}
@media (max-width:990px) {
	.circulos {flex-direction:column-reverse;flex-wrap:wrap;padding:1em 0;}
	.circulos div {width:100%!important;text-align:center;}
	.circulos div:first-child img:last-child {display:block}
	.circulos div:first-child img:first-child {display:none}	
	.circulos div:last-child img {display:none}
	.circulos div p {margin-bottom:2em;max-width:90%;}
	.circulos div:last-child {padding:0;}
}
@media (max-width:540px) {
	.circulos div p {margin-bottom:1.5em;font-size:1em;line-height:1.5em;}
}

.barras {background:url(../../img/bg-barras.jpg) no-repeat; background-size:cover; display:flex;justify-content:center;}
.barras > div, .barras div.back {width:300px;height:650px;}
.barras > div {margin:40px 20px;position:relative;}
.barras div a {color:white}
.barras div a.front {position:absolute;top:0;bottom:0;left:0;right:0;display:flex;align-items:flex-end;background-size:cover; background-repeat:no-repeat; background-image:url(../../img/barra1.jpg);transition:opacity 0.5s ease;}
.barras div a.front:hover {opacity:0;}
.barras div div.back {background:rgba(255,255,255,0.7);text-align:center;display:flex;align-items:center;}
.barras div:nth-child(2) a.front {background-image:url(../../img/barra2.jpg);}
.barras div:nth-child(3) a.front {background-image:url(../../img/barra3.jpg);}
.barras div:nth-child(4) a.front {background-image:url(../../img/barra4.jpg);}
.barras .recuadro p {padding:0;margin:0;}
.barras div a.front > div {width: 100%; margin:0 30px 0; text-align:center;font-family:'Averia Serif Libre', cursive;font-size:1.3em;line-height:1.2em;}
.barras div a.front div div {background:rgba(160,0,0,0.7);margin-bottom:30px;padding:5px 10px;height:140px;display:flex;align-items:center;justify-content:center;}
.barras div a.front div div:last-child {display:none;}

.barras div div.back p:first-child, .barras div div.back p:nth-child(3){padding:0px 20px;}
.barras div div.back p:first-child {font-weight:bold;}
.barras div div.back p:nth-child(2) {background:white;font-weight:bold;padding:10px 40px;margin:20px 0;border-top:1px solid black;border-bottom:1px solid black}
.barras div div.back p:nth-child(3) {font-size:0.8em;}
.barras div div.back img {width:140px;margin-top:20px}

@media (max-width:1360px) {
	.barras > div, .barras div.back {width:260px;height:550px;}
	.barras div div.back p {font-size:0.9em;}
	.barras div div.back p:nth-child(3) {font-size:0.7em;}
	.barras div div.back img {width:100px;margin-top:10px}
	.barras div a.front > div {font-size:1.2em;}
}

@media (max-width:1200px) {
	.barras > div {margin:30px 10px;}
	.barras > div, .barras div.back {width:220px;height:530px;}
	.barras div a.front div div {margin-bottom:20px;}
	.barras div a.front > div {margin:0 20px;}
}

@media (max-width:990px) {
	.barras {flex-wrap:wrap;padding:15px 5%;}
	.barras > div {margin:15px;}
	.barras > div, .barras div.back {width:300px;height:550px;}
	.barras div a.front div div:first-child {height:120px;}
	.barras div a.front div div:last-child {display:block;height:auto;}
	.barras div a.front > div {font-size:1.7em;}
}

@media (max-width:780px) {
	.barras {flex-wrap:wrap;padding:15px;}
	.barras div div.back { display:none; }
	.barras div a.front:hover {opacity:1;}
}
@media (max-width:690px) {
	.barras > div, .barras div.back {width:45%;height:550px;}
	.barras div a.front > div {font-size:1.4em;}
}
@media (max-width:690px) {
	.barras {padding:15px 5px;}
	.barras > div {margin:5px;}
}
@media (max-width:530px) {
	.barras div a.front > div {margin:0 10px;}
	.barras div a.front div div {margin-bottom:10px;}
	.barras > div, .barras div.back {height:450px;}
	.barras div a.front > div {font-size:1.2em;}
}
@media (max-width:430px) {
	.barras > div, .barras div.back {height:400px;}
	.barras div a.front > div {font-size:1em;}
	.barras div a.front div div:first-child {height:100px;}
}
@media (max-width:375px) {
	.barras {padding:10px 0px;}
	.barras div a.front div div:first-child {height:80px;}
	.barras > div, .barras div.back {height:350px;}
	.barras div a.front > div {font-size:0.9em;}
}

.banners {}
.banners div {background:url(../../img/banner1.jpg) no-repeat; background-size:cover; background-position:center left;font-family: 'Averia Serif Libre', cursive;border-top:10px solid white}
.banners div:nth-child(2) {background-image:url(../../img/banner2.jpg);border-bottom:10px var(--violeta) solid;border-color:var(--violeta)}
.banners h3 {width:400px;padding:60px 0 30px 50px;font-size:1.5em;color:white;}
.banners div:first-child h3 {font-size:1.8em;}
.banners a {transform: skewX(350deg);padding:5px 10px;border:1px solid white;margin-left:60px;margin-bottom:50px;display:inline-block;transition:all ease 0.5s;}
.banners a:hover {background-color:rgba(255,255,255,0.5);color:white}
.banners p {margin:0; transform: skewX(10deg); padding:0 20px;}

@media (max-width:1200px) {
	.banners h3 {width:315px;padding:30px 0 15px 30px;}
	.banners a {margin-left:40px;margin-bottom:30px;}
}
@media (max-width:990px) {
	.banners div {border-width:5px !important;}
	.banners h3 {width:310px;}
}
@media (max-width:780px) {
	.banners div {background-image:url(../../img/banner1cel.jpg);}
	.banners div:nth-child(2) {background-image:url(../../img/banner2cel.jpg);}
}

.testimonios, .clientes, .servicios, .blanco-productos {background-image:url(../../img/testimonios.jpg);background-size:cover;background-repeat: no-repeat;color:var(--red);padding:50px 100px;font-family: 'Averia Serif Libre', cursive;}
.testimonios div {text-align:center;}
.testimonios img {width:24%;margin:0;}
.testimonios h3, .nosotros h3, .clientes h3, .servicios h3 {font-size:2.2em;margin:0 auto 30px;text-align:center;}

@media (max-width:1400px) {
	.testimonios {padding:40px 20px;}
}

@media (max-width:1200px) {
	.testimonios h3, .nosotros h3, .clientes h3, .servicios h3 {font-size:2em;}
	.testimonios {padding:40px 100px;}
	.testimonios img {width:40%;}
}
@media (max-width:990px) {
	.testimonios {padding:30px 50px;}
	.testimonios img {width:45%;}
}
@media (max-width:780px) {
	.testimonios {padding:30px 0;}
	.testimonios h3, .nosotros h3, .clientes h3, .servicios h3 {margin-bottom:15px; font-size:1.8em;}
}
@media (max-width:600px) {
	.testimonios {padding:20px 0;}
	.testimonios h3, .nosotros h3, .clientes h3, .servicios h3 {font-size:1.5em;padding:0 30px}
	.testimonios img {width:60%;margin:0px;}	
	.testimonios div {margin-left:-5%;}
}

.form {padding:30px 50px 0;}
.form .tit {text-align:center;font-family: 'Averia Serif Libre', cursive;margin-bottom:12px;color:var(--violeta);font-size:1.4em}
.form .contForm {display:flex;justify-content:center;font-size:0.7em}
.form .contForm > div {width:350px;padding:10px;}
.form textarea, .form input {width:100%;background:rgb(237,237,237);padding:5px 10px;margin-bottom:10px;border:0;font-size:1em;font-family:'Red Hat Display', sans-serif;}
.form textarea {height:179px;margin-bottom:10px;}
.form .contForm p {margin-bottom:3px;}
.form .btn {padding:5px 10px;background:var(--violeta);color:white;font-size:1em;border-radius:0;border:0;}
@media (max-width:1200px) {
	.form textarea {height:103px;}
	.form .tit {font-size:1.5em}
	.form .contForm > div {width:320px;}
}
@media (max-width:990px) {
	.form {padding:20px 30px 0;}
	.form .tit {font-size:1.3em}
	.form textarea {height:107px;}
	.form .contForm {font-size:0.8em}
	.form .contForm > div {width:300px;}
}
@media (max-width:780px) {
	.form .tit {font-size:1.1em}
	.form .contForm > div {width:300px;max-width:40%;}
}
@media (max-width:618px) {
	.form textarea {height:88px;}
}
@media (max-width:480px) {
	.form .contForm > div {max-width:50%;}
}
@media (max-width:375px) {
	.form {padding:0;}
	.form .tit {padding:0 5px;}
	.form .contForm > div {padding:5px;}
}

.modal-content, .modal-header {border-radius:0!important; text-align:center;}
.modal-header {background-color:var(--red);text-align:center;}
.modal-header img {width:400px;margin: 0 auto}
.modal-footer {justify-content:center;}
.modal-footer .btn-primary {color: #fff; background-color:var(--violeta);border:0;border-radius:0;font-size:0.8em;}