body {font-family: Arial, sans-serif; background-color: #c4c4c4;}
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;}
}
.formulario {text-align: center; padding-top: 20px;font-weight: 700;
             font-size: 20px; 
             color: black; font-family: arial;}
@media only screen and (max-width:480px) {
      .form-section input {width: 80%; padding: 10px; align-items: center; justify-content: center;}
      .form-section textarea {width: 80%; padding: 10px; align-items: center; justify-content: center;}
   }
.form textarea {min-height: 250px; resize:none}
.form {margin-top: 30px}
.form__input {
    width: 50%;
    height: 30px;
    padding: 5px;
    margin: 10px;
    font-size: 16px;
    border-top: 6px solid #189;
    border-radius: 5px;
    outline: none;
    transition: border-color 0.3s;
}
.enviar {width: 150px;height: 30px;border-radius: 10px; 
        padding-bottom:25px;}

.form__input:hover {
    border-color: #66afe9;
}

.form__input:focus {
    border-color: #66afe9;background-color: #e8e8f9;}

ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.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%}

