body{
  font-family: 'Baloo Bhaina 2', cursive;
  
}
.padre{

  border: 0px;
  margin: 105px 0px 0px 0px;


}
  .padre a{
    text-decoration: none;
  }

  .menu{


    display:flex;
    flex-flow: nowrap;
    background: white;
    max-width: 100%;
    
  }
    .barra{
        background: rgba(0, 0, 0, 0.99);
        position: fixed;
        display: flex;
        flex-flow: nowrap;
        height: auto;
        width: 100%;
        align-items: center;
        text-align:center;
        top: 0;
        z-index: 1;

    }
      .menuOculto{
        display:none;
      }
      .logo{

          flex:1 1 auto;
          width:auto;
          }
          .logo img{
            padding-left: 10px;
            padding-right: 10px;
            width: auto;
            height: 100px;
          }
          .logo:hover{
            transform: scale(1.05);
            cursor:pointer;
            transition: 100ms;
          }
      .navegador{

        flex: 5 1 auto;
        width: 100%;
      }
      .navegador a{
          font-family: 'Baloo Bhaina 2', cursive;
          color: white;
          padding: 15px;
          width: 100%;

      }
      .navegador a:hover{
        color: #fbe555;
        transition: 500ms;
      }
      .redes{
        color:white;
        flex: 1 1 auto;
        text-align: center;
        display:inline-block;



      }
      .redes a{
          font-family: 'Baloo Bhaina 2', cursive;
          color: white;
          padding: 15px;
          font-size: 20px;



        }
        .redes a:hover{
          color: #fbe555;
        }
    .presentacion{

      background: url(../imagenes/fondo.jpg);
      background-position: center;
      background-size: cover;
      background-attachment: contain;

    }

.imagen{
  padding: 5px ;
}

.desaparece{
  display: none;
}
.marcoHistoria{
  display:flex;
   flex-direction: row;

  margin: 0;
  height: auto;


}
  .mapita{
    
    width:50%;
    margin: 20px;
    height:95%;
    display: flex;


  }
  .mapita img{
   
    max-width: 90%;
    margin: auto;
    border-radius: 10px;
  }
  .contenedorHistoria{

    margin: 2rem;
   
    text-align: justify;
    width: 45%;
    display: flex;
    flex-flow: column; 
    overflow: hidden;
    
    

  }
      .contenedorHistoriaImagen{
        height: 70%;
        width: auto;
      }
      
      .historia{
        width: 100%;
        height:auto;
      }
  .sinMargen{
    margin: 0;
    text-align: center;
  }

  .pie{
    margin: 40px 0 0 0px;
    display: flex;
    flex-flow: column;
    text-align: center;
    line-height: 0px;
    background: black;
    color: white;

  }
  .iconowha{
    margin:0;
    z-index: 1;
    position: fixed;
    top:90%;
    width: 50px;
    height: 50px;
    right: 2%;


  }

    .wha{
      width: 80%;
      height: 80%;
      float: right;
    }
    .wha:hover{
      width: 100%;
      height: 100%;
      transition: 0.5s;
    }

@media (max-width: 800px){
  .menuOculto{
    display:inline-block;
    }
    .ocultar{
      display:none;
    }
    .barra{
      flex-flow: column;
      position: static;
    }
    .navegador a{
      padding: 15px 0px;

    }
    .logo img{
      
         height: 80px;
        
    }

    .navegador{
      display: flex;
      flex-direction: column;
    }
    .marcoHistoria{
      flex-direction: column;
    }
    .mapita img{
      width: 90%;
      
    }
    .mapita{
      width: 80%;
      margin: auto;
    }
    .contenedorHistoria{
      width: auto;
    }
    .contenedor{

      margin: 180px 0px 0px 0px;
      width: 100%;
      align-content: center;
    }
    .wha{

      float: right;


    }
  
    .pie{
        line-height: 20px;
      }

    .padre{

      border: 0px;
      margin: 0px 0px 0px 0px;


     }
}