body {font-family: Arial, sans-serif; background-color: #567f7f;}
a { text-decoration: none;}
a:visited {color:#000;}
a:link {color:#000;}

.encabezado{ background-color:#ec7754; height:30px; align-items: start; display:block;}

.enc__titulo {font-size: 0.98em;font-family: 'arvo', sans-serif; height: 30px; color: white;display:inline-block; 
   line-height: 1.8; position:relative; left:20px;font-family:arial;font-weight: 400;}

.enc__redes{float:right;height:30px;display:flex;
         position:relative; top:7.5px; right:20px;font-size: 20px;}

.enc__redes a{padding-right: 10px; margin-top:-3px;}

header {position:sticky;top:-5px; box-sizing:border-box;border-bottom:4px solid #C14811;
      height: auto ;background-color: #2e4e4e;z-index: 1; text-align: center;}

.logo {height:auto;width:5vw;top:10%;left:2.5%;position:absolute;
      filter: drop-shadow(4px 2px 2px #535353);transition: all 0.2s;}
.logo:hover{scale: 1.12;}

.logo img{height: 100%; width:100%;border-radius:60px;}

.nav__ul {display:flex; justify-content: center;}
.nav__li{display: inline; padding-left:5px; padding-right: 5px; margin-right: 5px; margin-left: 5px;}
.nav__li a{outline: none;display: inline-block; padding:10px; text-align: center; transition:all .5s;font-weight: 400;line-height: 1.4;font-size:18px;}
.nav__li a:visited {color:#fff;}
.nav__li a:link {color:#fff;}
.nav__li:hover{background-color: #113434;}


.navresp__ul {display:none;}

@media only screen and (max-width:480px) {
   .nav__ul {display: inline;}
   .navresp__ul { display: block; width:100%;height:100%;}
   .logo {position: absolute; left: 10px; top: 40px; height: 50px; width: 50px;}
   .encabezado {display: block; text-align: center; align-items: center; height: auto; padding: 4px;}
   .enc__titulo {position: static; line-height: 1.1;}
   .enc__redes {position: static; float: none; align-items: center; justify-content: center;}
   .enc__redes a {padding: 0 8px;}
   .nav__li {display: block; padding: 2px 0;}
   header {position:static; top: 0;}
}

ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
.galeria-proyectos {color: white; font-size: 1.2em; font-weight: 700; margin-top: 10px;}
.galeria {background-color: #3c5353;display: flex; flex-wrap: wrap; justify-content:space-evenly; padding: 20px; margin-bottom: 20px; }
.container { width:30%;  overflow: hidden; }
.container video { width: 100%; max-height: 800px;}
.proyecto__video { border-radius: 20px; }
.proyecto__img1 { width: 100%;object-fit: cover; border-radius: 20px;}
.proyecto__img2 { width: 100%;object-fit: cover; border-radius: 20px;}

@media only screen and (max-width: 480px){
   .galeria {display:inline-block; align-items: center;}
   .container {width: 100%; max-width: 400px;}
   .proyecto__img1 .proyecto__img2 .proyecto__video {display:block;}
   
}

.aside {display:flex; justify-content: center;
         background-color:#567f7f;width:100%}
.aside li {display:inline;}

.aside a{outline: none;
  display: inline-block;width: 100%;
  text-align: center;line-height: 2;
  color: white;transition: all .4s; padding: 10px}
.aside a:hover{background-color:#619191;}


footer {padding:20px;background-color: #3c5353;text-align: center; color: white; display: flex; flex-wrap: wrap; justify-content: space-around;
         font-weight:50; align-items: start;}

.mediosdepago {padding:10px;}
.mediosdepago img {height: 60px; width: auto; margin-top: 10px;}
.contacto {padding:10px;text-align: left;}
.contacto p {font-size: 1.2em; padding-top: 4px;}
.contacto i {margin-right: 10px; color: white;}
.redes {padding:10px; text-align: center;}
.redes i{font-size: 1.6em; color: white; padding-top: 10px; padding-right: 5px; padding-left: 5px;}
.copyright {font-size: 0.8em; color: white; margin-top: 20px;}
.botonwhatsapp { height: 40px; width: 40px; position: fixed; bottom: 40px ; right: 20px; font-size: 50px; z-index: 1000; background-color: #ffffff; border-radius: 10%; padding: 10px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); transition: all 0.3s ease-in-out; align-items: center; display: flex; justify-content: center;}
.botonwhatsapp:hover {background-color: #e0e0e0; transform: scale(1.1);}
.botonwhatsapp a{color: rgb(38, 234, 81); border-radius:50%}