@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=SUSE:wght@100..800&display=swap');
* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
}
body {
   align-items: center;
   background: #FF8F60;
}
.portada {
   width: 340px;
   height: 220px;
   padding-left: 12px;
   padding-top: 16px;
   padding-bottom: 10px;
   margin: 0 auto;
   margin-top: 30px;
   margin-bottom: 16px;
   border-radius: 15px;
   background: #fff;
   border: 0px solid #df5c5c;
}
.portada img {
   width: 305px;
   margin: 0 auto;
   margin-left: 7px;
}
h1 {
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-weight: 700;
   font-size: 23px;
   margin: 0 auto;
   text-align: center;
}
article {
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
   font-size: 25px;
   font-weight: bold;
   margin-top: 20px;
   color: #60240C;
   text-align: center;
}
h2 {
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
   font-size: 20px;
   font-weight: bold;
   margin-top: 0px;
   margin-bottom: 10px;
   text-align: center;
}
.img1 {
   width: 330px;
   height: 476px;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
   justify-content: center;
   align-items: center;
   display: grid;
   border-radius: 15px;
   background: #bdbdbd;
}
.img2 {
   width: 330px;
   height: 215px;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
   justify-content: center;
   align-items: center;
   display: grid; /* con este selector se centro img */
   border-radius: 15px;
   background: #bdbdbd;
}
.img1 img {
   width: 310px;
   height: auto;
   margin-left: auto;
   margin-right: auto;
}
.img2 img {
   width: 310px;
   height: auto;
   margin-left: auto;
   margin-right: auto;
}
#img3 {
   width: 350px;
   height: auto; 
   margin-left: auto;
   margin-right: auto;
   background-image: url("../img/cartel 3.jpg");
}
.video {
   width: 260px;
   height: 450px;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
   justify-content: center;
   align-items: center;
   display: grid;
   border-radius: 15px;
   background: #bdbdbd;
}
video {
   border-radius: 10px;
}
h3 {
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-weight: 700;
   font-size: 19px;
   line-height: 24px;
   text-align: center;
   color: #3d3d3d;
}
h4 {
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-weight: 400;
   font-size: 17px;
   line-height: 24px;
   text-align: center;
   color: #2b2b2b;
}
.contact {
   width: 320px;
   padding: 27px 24px;
   background: #fff;
   margin-top: 20px;
   margin: 0 auto;
   font-size: 14px;
   font-weight: 400;
   line-height: 22px;
   font-family: "Roboto Condensed", sans-serif;
   justify-content: center;
   align-items: center;
   text-align: center;
   border-radius: 7px;
   border: 0px solid #7C3921;
   background-image: url('../img/fondo.jpg');
   /*box-shadow: 9px 9px 0px 0px rgb(217, 83, 36, 0.9); */
}
.contact h1 {
   margin-bottom: 10px;
   font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
   color: #0046a1;
   font-size: 24px;
   text-align: center;
   border: 0px solid #0280fe;
}
button {
   width: 175px;
   height: 45px;
   margin: 0 auto;
   padding: 0px 15px 0px 15px;
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-size: 18px;
   font-weight: 600;
   text-align: center;
   border-radius: 25px;
   cursor: pointer;
   background-color: #59e48c;
   border: 2px solid #397a47;
   box-shadow: 7px 8px 0px 0px rgba(124, 209, 145, 0.7);
}
button:hover a{
   color: #25D366;
   cursor: pointer;
   border: none;
}
button:hover {
   background-color: #ffffff;
   border: none;
   border: 2px solid #20b950;
}
button a {
   /* estas 2 lineas alinearon 
   icono con texto centrado */
   display: inline-flex;
   align-items: center;
   line-height: 5px;
   color: #185e18;
   text-decoration: none;
}
button .fa-whatsapp {
   margin-right: 5px;
   color: #00aa25;
   font-size: 28px;
}
section h2 {
   margin-top: 8px;
   text-align: center;
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-size: 16px;
   font-weight: 500;
   color: #004e11;
}
.frase {
   width: 330px;
   height: 315px;
   margin: 0 auto;
   border: 0px solid #0046a1;
   background-image: url('../img/Cristo\ Rey-07.webp');
   background-repeat: no-repeat;
   background-position: center;
   object-fit: cover;
}
.frase img {
   width: 190px;
   height: 190px;
   margin: 0 auto;
   opacity: 0.5;
   z-index: 1;
}

.frase h2 {
   color: #183824;
   font-size: 20px;
   font-family:'Times New Roman', Times, serif;
   font-weight: 400;
   text-align: center;
   line-height: 24px;
}
.frase h4 {
   color: #000000;
   font-size: 20px;
   font-family:'Times New Roman', Times, serif;
   font-weight: 400;
   text-align: center;
   line-height: 23px;
}
.frase h1 {
   font-family:'Times New Roman', Times, serif;
   font-size: 17px;
   font-weight: 600;
   color: #183824;
   text-align: center;
   
}
.fa-globe {
   margin-top: 0px;
   margin-bottom: 20px;
   text-decoration: none;
   color: #ffffff;
}
.fa-globe:hover {
   margin-top: 0px;
   text-decoration: none;
   color: #ffb798;
}
.fa-phone {
   margin-right: 19px;
   margin-top: 0px;
   margin-bottom: 20px;
   text-decoration: none;
   color: #ffffff;
}
.fa-square-share-nodes {
   margin-left: 19px;
   margin-top: 0px;
   margin-bottom: 20px;
   text-decoration: none;
   color: #ffffff;
   cursor: pointer;
}
.fa-square-share-nodes:hover {
   margin-top: 0px;
   text-decoration: none;
   color: #ffb798;
}
.desarrollo {
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   font-weight: lighter;
   line-height: 22px;
   margin-top: 0px;
   margin-bottom: 0px;
}
a:visited, a:active {
   color: #4451ff;
   text-decoration:none;
}
footer {
   width: 335px;
   height: 120px;
   border-top: 4px solid #7a1515;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
   padding-top: 15px;
   margin: 0 auto;
   margin-top: 20px;
   text-align: center;
   background: #d84f4f;
}
footer p a{
   color: #ffffff;
   font-size: 13px;
   font-family: sans-serif;
   font-weight: lighter;
   text-decoration: none;
}
footer {
   color: #ffffff;
   font-size: 13px;
   font-family: sans-serif;
   font-weight: lighter;
   text-decoration: none;
}
footer i {
   font-size: 13px;
}
footer a {
   font-size: 15px;
   color: #fff;
}
footer div a {
   margin-top: 30px;
   font-size: 15px;
   color: #fff;
}
footer p a {
   text-decoration: underline;
}
footer p a:hover {
   color: #6ca5ff;
   text-decoration: underline;
}