.mat-toolbar{
font-family: Arial, Helvetica, sans-serif;
color:black;
font-size: 0.9rem;
width: 100vw;
height: 100px;
}
.mat-toolbar a{
margin-inline: 16px;
font-size: 1rem;
}
.logo{
height: 10vh;
width: 7rem;
vertical-align: middle; 
}
.vspc{
  a:link {
    color: black;
    background-color: transparent;
    text-decoration: none;
  }
  a:visited {
    color: black;
    background-color: transparent;
    font-weight: bold;
  }
  a:hover {
    color: black;
    background-color: transparent;
    border-bottom: 1px solid rgb(185, 63, 40);
    text-decoration: none;
  }
  a:active {
    color: black;
    background-color: transparent;
    text-decoration: none;
  }

}
  .vsandroid{
    a:link {
      color: black;
      background-color: transparent;
      font-size: 1rem;
      text-decoration: none;
    }
    a:visited {
      color: black;
      background-color: transparent;
      font-weight: bold;
    }
    a:hover {
      color: black;
      background-color: rgba(0, 0, 0, 0.296);
      
      text-decoration: none;
    }
    a:active {
      color: black;
      background-color: transparent;
      text-decoration: none;
    }
  }
.dropdown {
position: relative;
display: inline-block;
}
.dropbtn {
background-color: rgb(185, 63, 40);
color: white;
padding: 10px 20px;
font-size: 16px;
border: none;
cursor: pointer;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 120px;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-content a:hover {
background-color: #ddd;
}
.dropdown:hover .dropdown-content {
display: block;
}
.dropdown:hover .dropbtn {
background-color: rgb(195, 91, 71);
}
.dropdown-content a {
color: black;
text-decoration: none;
display: block;
}
  /*Responsive*/
  /* Telefonos red navbar|listo    footer|listo*/
@media only screen and (max-width: 570px/*Aqui va la medida del menu verde*/) {/*reed*/
.mat-toolbar{
font-size:0.5rem; 
height: 10vh; 
height: 100px
}
.vspc{
display: none;
}
.logo{
margin-inline-start: 1vw;
margin-right: 5vw;
height: 9vh;
width: 20vw;
}
      /* .vsandroid a{
      margin-top: 4px;
      }  *//*quitar el comentado aqui */
  }
  /*Telefonos  green mas grandes*/
  @media only screen and (min-width:570px){/*verde*/
  .mat-toolbar{
    font-size:0.5rem; 
    height: 100px; 
    width: 100vw;
  }
  .logo{
    margin-inline-start: 2vw;
    margin-right: 5vw;
    height: 9vh;
    width: 14vw;
   }
  .vspc{
    display: none;
  }
  .vsandroid{
    display:flex;
  }
  }
  /* Tablet landscape blue   navbar|listo    footer|listo*/
  @media only screen and (min-width: 760px) {/*Azul*/
  .mat-toolbar{
   width: 100vw;
   height: 100px;
  }
  .mat-toolbar a{
   font-size: 0.9rem;
   font-family: Arial, Helvetica, sans-serif; 
   margin-inline: 5px;
   margin-top: 80px; 
  }
  .logo{
  height: 80px;
  width: 85px;
  margin-inline-start: 14vw;
  margin-right: 8vw;
  }
  .vsandroid{
  display: none;
  }
  .vspc{
  display: flex;
  }  
  .letrasnavbar{
    margin-top: 80px;
    margin-inline: 4px;
    vertical-align:bottom;
    }
  }

  /* Laptops y monitores pequeños orange*/
  @media only screen and (min-width: 851px) {/*Naranja*/
    .mat-toolbar{
      height: 100px;
    }
    .mat-toolbar a{
    margin-top: 80px;  
    }
    .vsandroid{
    display: none;
    }
    /* .a{
      margin-top: 5.5vh;
      margin-right: 0px;
    } */
    .logo{
      height: 80px;
      width: 65px;
      margin-right: 19vw;
      margin-inline-start: 12vw;
    }
    .letrasnavbar{
      margin-top: 80px;
      margin-inline: 4px;
      }
  } 
  /* Monitores promedio white*/
  @media only screen and (min-width: 1200px) {/*Blanco*/
    .mat-toolbar{ 
      width: 100vw;
      height: 100px;
    } 
    .mat-toolbar a{
      margin-top: 80px; 
      margin-right: 10px;
    }
    .logo{
      margin-inline-start: 18.5vw;
      width: 85px;
      margin-right: 25vw;
  }
  .vsandroid{
    display: none;
  } 
  .letrasnavbar{
    margin-top: 80px;
    margin-inline: 4px;
    }
  }