@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap');

html {
    box-sizing: border-box;
    font-size: 62.5%; /* 10px = 1rem! */
  }
*, *:before, *:after {
    box-sizing: inherit;
  }

body {
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: normal;
  margin: 0;
  background-color: #000;
  color: #FFF;
}

a {text-decoration: none;}

h1, h2, h3, p { margin: 0; padding: 0;}

.container { max-width: 98%;
             margin: 0 auto;
       padding: 1.5rem 0;
      }

header { padding: 1.5rem 0;}
header h1 { font-size: 3rem;
            text-align: center;
}

.img-responsive { max-width: 100%; }

/* ARCHIVO */

@media (min-width: 768px) { 
  .buscador-contenedor {  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 4rem;
  text-align: center;
  margin-bottom: 10px;}
}

.buscador-detalle p { text-align: center;}

.buscador-detalle input[type="text"] {  
                padding: 5px 10px;
              width: 200px;
}

.buscador-detalle select {   
     border: none;
     height: 28px;
     padding: 5px;
     width: 250px; }

.botones-buscador { margin-top: 10px;
            padding: 5px 10px;
          cursor: pointer;}
  
input {margin-top: .5rem;}    
      
/* Paginador */
.paginador { margin: 0 0 20px 0;}
.paginador p {text-align: center; margin: 10px 0 0; font-size: 12px; line-height: 8px; padding: 0;}

/* FOTOS */

.foto img { border: 2px solid #FFF; 
          }
.no_foto img { border: 0px;
             }

@media (min-width: 768px) { 
  .fotos {  display: grid;
       grid-template-columns: 1fr 7fr;
       column-gap: 1rem;}
}

.texto { text-align: left; }
.texto a { font-size: 1.2rem; margin: 0; font-weight: bold;}
.texto p { margin: 0; padding: 0;}
.texto span {font-weight: bold;}

hr { margin: 1rem 0;}

.detalle-foto { text-align: left;}
.detalle-foto h1 {color: #FFF; font-weight: bold; font-size: 18px;}
.detalle-foto span {font-weight: bold;}

.detalle-foto-listado { margin-top: 30px; text-align: center;}
.detalle-foto-listado h3 {font-size: 1.5rem; color:#FFF; margin-top: 1rem; font-weight: bold;}
.detalle-foto-listado p { font-size: 1.3rem; margin-top: .5rem;}
.detalle-foto-listado img {border: 2px solid #FFF;}

@media (min-width: 768px) { 
  .detalle-fotos-listado {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 2rem;
  }
}


@media (min-width: 1366px) { 
  .detalle-fotos-listado {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 2rem;
  }
}

.botones { display:block;
       background: rgb(246,138,5);
background: -moz-linear-gradient(180deg, rgba(246,138,5,1) 31%, rgba(36,36,36,1) 100%);
background: -webkit-linear-gradient(180deg, rgba(246,138,5,1) 31%, rgba(36,36,36,1) 100%);
background: linear-gradient(180deg, rgba(246,138,5,1) 31%, rgba(36,36,36,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f68a05",endColorstr="#242424",GradientType=1);
       color: #000;
       padding: 5px 0;
       width: 50%;
       margin: 1rem auto 0 auto;
       font-size: 16px;
       font-weight: bold;
       border-radius: 10px;
       border: 2px solid #74736E;
       transition: all .3s ease-in-out;}
.botones:hover {
  background-color:#F30; color: #FFF;
  border: 4px solid #74736E;}
.botones span {font-size: 12px; font-weight: normal; color:#FFF;}

#footer {
    text-align: center;
}

.column {
  float: left;
  padding: 10px;
}

.left {
  width: 20%;
}

.middle, .right {
  width: 40%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }
}