html * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}

html, body {
  height:100vh;
  min-height: 100vh;
  background-color: white;
  scroll-behavior: smooth;
  display:flex;
  flex-direction:column;
  scrollbar-color:#aba093 #E2E0DF;
}

body {
  font-family: "Inter Tight", sans-serif;
  font-size:1rem;
  font-optical-sizing: auto;
  font-style: normal;
  color:black;
  margin: 0;
  font-weight:400;
  padding:0;
  position:relative;
  overflow-x:hidden;
  scroll-behavior: smooth;
}

::before, ::after {box-sizing: border-box;}

:root {
  --animate-delay: 0.5s;
  --select-border: blue;
  --select-focus:blue;
}




a {font-family: 'DIN', sans-serif;}

.negro {color:#252923 !important;}
.blanco {color:white !important;}
.gradiente {background:linear-gradient(0deg, rgba(37,41,35,0) 0%, rgba(37,41,35,0.6) 100%);}
.gradiente2 {background:linear-gradient(180deg, rgba(37,41,35,0) 0%, rgba(37,41,35,0.8) 100%);}
.solido {background-color:#F1F1F2 !important;}
.fblack {fill:black !important;}
.fder {float:right;}
.derecha {padding-left:10rem;}
.no-mostrar {display:none !important;}


#loader {position:absolute; width:100%; height:100%; background-color:white; left:0px; top:0px; z-index: 9999999999;}
#logotipo {position:relative; width:320px; height:100px; top:50%; left:50%; margin-left:-160px; margin-top:-50px; opacity:0;}

.aviso { display:none !important; width:100%;  height:100%; max-width:100%; min-height:100vh; padding: 0; margin:0; position:absolute;  z-index:99999999999; background-color:black;}
.aviso h1 {font-size:1.5rem; font-weight:600; color:white; width:600px; height:100vh; margin: 0 auto; display:flex; flex-direction:column; justify-content:center; align-items:center;}

.container { width:100%;  height:100%;  display:flex; flex-direction:column; justify-content:center;  padding: 0; margin:0; position:absolute; top:0; left:0;  z-index:0;}

header {width:100%; height:130px; position:fixed !important; top:0; left:0; display:flex; flex-direction:row; justify-content:space-between; margin:auto 0; padding:0; z-index:500;}


.contenido { width:100%;   min-height:100%; padding:0; margin:0; display:flex; flex-direction:column; justify-content:center; z-index:100; position:absolute; top:0; left:0; }
.burger {cursor: pointer; display:none; border: 0; width:50px; height:auto; padding: 0;  background: url("../images/menu.svg") no-repeat bottom; transition: opacity 250ms ease; position: absolute; top:1.5rem; z-index:99999;}
.mobile-nav-toggle { cursor: pointer; display:none; border: 0; width:130px; height:40px; padding: 0; color:black; background: url("../images/logo_grajales.svg") no-repeat center; transition: opacity 250ms ease; position: absolute; top:1.5rem; z-index:99999;}


.pleca {width:3%; min-width:min-content; height:94svh; position:fixed; top:0; left:0; display:flex; flex-direction:column; justify-content:space-between; margin:0; padding:3vh 1.5vw; background:white; z-index:300;}

.logo {width:auto; height:auto; display:block;  margin:0; padding:0;}
.logo img {width:auto; height:50px;  margin:0; padding:0; }

.primary-navigation {width:auto; height:auto;  display:flex; flex-direction:column; justify-content:space-between;  z-index:9999; margin:0; padding:0;}
.primary-navigation a{ text-decoration:none; font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; width:auto; padding:0; margin:0 0 0.5rem 0; color:#666;}
.primary-navigation a:last-child {margin:0;}
.primary-navigation a:hover, .primary-navigation a.active {font-size:0.8rem; color:black !important; font-weight:300;}



.filtros {width:auto; height:auto; display:flex; flex-direction:column; justify-content:start; position:absolute; top: 15%; margin:0; padding:0;}
.filtros a {text-decoration:none; font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; width:auto; padding:0; margin:0 0 0.5rem 0; color:#666;}
.filtros a:hover, .filtros a.active {color:black;}

.base {min-width:auto; height:auto; margin-right:16%; padding:0;}

.idiomab {width:auto; height:auto; display:flex; flex-direction:row; justify-content:space-between; position:absolute; right:1.5%; top:6%; z-index:9999; margin:0; padding:0;}
.idiomab a{ text-decoration:none; font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; width:auto; padding:0; margin:0; color:white; opacity:0.7; }
.idiomab a:hover, .idiomab a.active {color:white; opacity:1;}
.idiomab a:nth-child(2){margin-left:1.5rem;}
.idioma, .opciones {width:auto; height:auto; display:flex; flex-direction:row; justify-content:space-between;  z-index:9999; margin:0; padding:0;}
.idioma a, .opciones a{ text-decoration:none; font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; width:auto; padding:0; margin:0; color:#666;}
.idioma a:hover, .idioma a.active, .opciones a:hover, .opciones a.active{color:black;}
.idioma a:nth-child(2){margin-left:1.5rem;}


.proyectos {width:calc(97% - 218px); height:auto; display:grid; grid-template-columns: 1fr 1fr 1fr; gap:6vw; align-items:center;  margin:0 0 3rem 0; padding:1.5%; position:absolute; top: 12%; left:218px;}
.proyectos a {text-decoration:none; font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; color:#666; margin:0; padding:0;}
.proyectos a p {width:auto; height:auto; margin:0; padding:0; color:black;}
.proyectos a span {width:auto; height:auto; color:#666; margin:0; padding:0;}
.proyectos a img:hover {opacity:0.6;}
.proyectos img {width:100%; height:auto; margin:0; padding:0;}

.listado {width:calc(97% - 218px); height:auto; display:flex; flex-direction:column; justify-content:start;  margin:0; padding:0 1.5%; position:absolute; top: 13vh; left:218px;}
.table {width:75%; height:auto; display:flex; flex-direction:column; justify-content:start; margin:0 0 2rem 0; padding:0;}
.table h1 {font-family: "Inter Tight", sans-serif; font-size:1rem; font-weight:400; color:black; margin:0 0 1rem 0 !important; padding:0; text-decoration:underline;}
.row {min-width:100%; height:auto; display:flex; flex-direction:row; justify-content:start; margin:0 0 0.5rem 0; padding:0; text-decoration:none;}
p {width:auto; height:auto; font-family: "Inter Tight", sans-serif; font-size:0.9rem; font-weight:300; color:black; margin:0 1rem 0 0 !important; padding:0;  text-decoration:none;}
.row p:first-child {width:19vw;}
.row p:nth-child(2) {width:16vw;}
.row p:nth-child(3) {width:10vw;}
.row p:last-child {width:8vw;}
.foto {width:20%; height:auto; margin:0; padding:0; position:fixed; top:13vh; right:1.5%;}
.foto img {width:100%; height:auto; margin:0; padding:0;}

.portada {width:88%; height:100%; margin:0; padding:0; position:absolute; top:0; left:12%; overflow:hidden;}
.portada img {width:100%; height:auto; margin:0; padding:0; object-fit:contain;}

.info {width:60%; height:auto; margin:0 0 3rem 0; padding:0; position:absolute; top:102vh; left:26%;}
.info h1 {width:auto; height:auto; font-family: "Inter Tight", sans-serif; font-size:1.2rem; font-weight:400; margin:0; padding:0;}
.info span {width:auto; height:auto; font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; color:#999; margin:0; padding:0;}
.descripcion {width:100%; height:auto; column-count:2; column-gap:3rem; margin:4rem 0; padding:0; }
.descripcion p {width:100%; height:auto; font-family: "Inter Tight", sans-serif; font-size:0.8rem; line-height:1.4rem; font-weight:300; margin:0 0 2rem 0 !important; padding:0; text-align:justify;}
.galeria {width:100%; height:auto; display:flex; flex-direction:column; align-items:center; margin:0; padding:0;}
.galeria img {max-height:90vh; max-width:100vw; margin:0 0 5rem 0; padding:0;}

.datos {width:100%; height:auto; display:flex; justify-content:space-between; margin:0 0 5rem 0; padding:0;}
.creditos {width:48%; height:auto; margin:0; padding:0;}
.premiosd {width:48%; height:auto; margin:0; padding:0;}
.premiosd h1, .creditos h1 {margin:0 0 1.5rem 0;}
.creditos p, .premiosd p, .premiosd a {font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; color:#999; line-height:1.4rem; margin:0 0 1rem 0 !important; padding:0;}
.creditos strong, .premiosd strong {color:black; font-weight:300; margin:0;}
.premiosd a:hover {color:black; font-weight:300;}

.footer {width:90%; height:auto; display:flex; justify-content:space-between; margin:0 auto; padding:2rem 0; }
.footer a {width:auto; height:auto; font-family: "Inter Tight", sans-serif; font-size:0.8rem; color:black; line-height:1.4rem; font-weight:300; text-decoration:none;}
.footer a:hover {color:black; text-decoration:underline;}

@media (max-width:35em) {
  #loader {position:absolute; width:100%; height:100%; background-color:white; left:0px; top:0px; z-index: 9999999999;}
  #logotipo {position:relative; width:180px; height:56px; top:50%; left:50%; margin-left:-90px; margin-top:-28px; opacity:0;}
  
  .pleca {width:94%; min-width:min-content; height:auto; position:fixed; top:0; left:0; display:flex; flex-direction:row; justify-content:space-evently; margin:0; padding:3vh 3%; background:white; z-index:300;}
	
  .portada {width:100%; height:100%; margin:0; padding:0; position:absolute; top:20%; left:0; }
  .portada img {width:100%; height:auto;   margin:0; padding:0;}
  
  .idiomab {display:none;}

  .info {width:94%; height:auto; margin:0 0 3rem 0; padding:0 3%; position:absolute; top:58vh; left:0;}
  .info h1 {width:auto; height:auto; font-family: "Inter Tight", sans-serif; font-size:1.2rem; font-weight:400; margin:0; padding:0;}
  .info span {width:auto; height:auto; font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; color:#999; margin:0; padding:0;}
  .descripcion {width:100%; height:auto; column-count:1; column-gap:3rem; margin:4rem 0; padding:0; }
  .descripcion p {width:100%; height:auto; font-family: "Inter Tight", sans-serif; font-size:0.8rem; line-height:1.4rem; font-weight:300; margin:0 0 1rem 0 !important; padding:0; text-align:justify;}
  .galeria {width:100%; height:auto; display:flex; flex-direction:column; align-items:center; margin:0; padding:0;}
  .galeria img {width:100%; height:auto; margin:0 0 3rem 0; padding:0;}

.datos {width:100%; height:auto; display:flex; flex-direction:column; justify-content:start; margin:0 0 5rem 0; padding:0;}
.creditos {width:100%; height:auto; margin:0 0 3rem 0; padding:0;}
.premiosd {width:auto; height:auto; margin:0; padding:0;}
.premiosd h1, .creditos h1 {margin:0 0 1.5rem 0;}
.creditos p, .premiosd p {font-family: "Inter Tight", sans-serif; font-size:0.8rem; font-weight:300; color:#999; line-height:1.4rem; margin:0 0 1rem 0 !important; padding:0;}
.creditos strong, .premiosd strong {color:black; font-weight:300; margin:0;}

.footer {width:90%; height:auto; display:flex; justify-content:space-between; margin:0 auto; padding:2rem 0; }
.footer a {width:auto; height:auto; font-family: "Inter Tight", sans-serif; font-size:0.8rem; color:black; line-height:1.4rem; font-weight:300; text-decoration:none;}
.footer a:hover {color:black; text-decoration:underline;}
 

 
  
 
 

 
}




@media only screen and (orientation:landscape) and (max-width:992px){.aviso {display:block !important; width:100%; height:100% !important;} .container {display:none;}}