body,h1,h2,h3,h4,h5 {font-family: "Raleway", sans-serif}
.w3-half img{margin-bottom: -6px; cursor: pointer}

.w3-third img{margin-bottom: -6px; cursor: pointer}

.w3-quarter img{margin-bottom: -6px; margin: 1px; padding:1px;}


body, html {height: 100%; width: auto;}
img {
  width: 100%; 
  
}
#img01 {
    height: auto;
    width: 100%;  
}

#mySidebar {
    z-index:3;width:250px;font-weight:bold;display:none;right:0;    
}

.texto{  
  padding: 22px;
}


@media screen and (orientation: landscape)and (max-width:650px) {
  #img01 {
    height: auto;
    width: 30%;
    margin-top: -40px;
    margin-bottom: -30px;
  }
}

@media screen and (orientation: landscape) and (min-width:651px) and (max-width:740px) {
  #img01 {
    height: auto;
    width: 40%;
    margin-top: -40px;
    margin-bottom: -30px;
  }
}
@media screen and (orientation: landscape) and (min-width:741px) and (max-width:799px) {
  #img01 {
    height: auto;
    width: 40%;
  }
}

@media screen and (orientation: landscape) and (min-width:800px) and (max-width:850px) {
  #img01 {
    height: auto;
    width: 38%;
    margin-top: -50px;
    margin-bottom: -50px;
  }
}
@media screen and (orientation: landscape) and (min-width:851px) and (max-width:1280px) {
  #img01 {
    height: auto;
    width: 60%;
    margin-top: -40px;
    margin-bottom: -30px;
  }
}

@media screen and (orientation: landscape) and (min-width:1280px){
  #img01 {
    height: auto;
    width: 40%;
  }
}