@import "https://unpkg.com/normalize.css@8.0.1/normalize.css";
/* BÁSICO */
/**
 * isaac-font.css
 *
 * INFORMACION
 * Importa a tipografia Isaac.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/* Isaac Display Bold */
@font-face {
  font-family: "IsaacDisplay";
  src: url("/site/fonts/IsaacDisplayBold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
/* Isaac Light */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacLight.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}
/* Isaac Light Italic */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacLightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
}
/* Isaac Book */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacBook.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
/* Isaac Book Italic */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacBookItalic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
}
/* Isaac Regular */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacRegular.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
/* Isaac Regular Italic */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacRegularItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
}
/* Isaac Normal */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacNormal.woff") format("woff");
  font-weight: 600;
  font-style: normal;
}
/* Isaac Normal Italic */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacNormalItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
}
/* Isaac Bold */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacBold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
/* Isaac Bold Italic */
@font-face {
  font-family: "Isaac";
  src: url("/site/fonts/IsaacBoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
}
:root {
	--ia16-start: 1px;
	--ia16-end: 15px;
	--ia16-center: 8px;
	--ia16-align-start: 3px;
	--ia16-align-end: 13px;

	--ia16-horizontal-center: translate(var(--ia16-start), var(--ia16-center));
	--ia16-horizontal-top: translate(var(--ia16-start), var(--ia16-align-start));
	--ia16-horizontal-bottom: translate(var(--ia16-start), var(--ia16-align-end));
	--ia16-vertical-center: translate(var(--ia16-center), var(--ia16-start)) rotate(90deg);
	--ia16-vertical-left: translate(var(--ia16-align-start), var(--ia16-start)) rotate(90deg);
	--ia16-vertical-right: translate(var(--ia16-align-end), var(--ia16-start)) rotate(90deg);
}
/*
================================
Aspect ratio
================================

Convert videos, iframes, images, etc to be elastic keeping the aspect ratio
Example:

<div class="aspect-ratio aspect-ratio-16-9">
	<iframe src="https://www.youtube.com/embed/hsnBK90QGzo" frameborder="0" allowfullscreen></iframe>
</div>
*/
/* Some predefined aspect ratios: */
/**
 * social-font.css
 *
 * INFORMACION
 * Importa iconas de twitter, google+ e facebook.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/* Social font */
.ico-twitter, .ico-facebook, .ico-instagram, .ico-youtube {
  & svg {
    width: 20px;
    height: 20px;
    display: block;
  }
  & path {
    fill: currentColor;
  }
}
/**
 * variables.css
 *
 * INFORMACION
 * Variables xenericas para usar na web - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
:root {
  --color-error: #e60016;
  /* cor dag principal */
  --color-main: #363636;

  --color-dark: #5e5e5e;

  /* cor dag gris medio */
  --color-medium: #757575;

  /* cor dag light */
  --color-light: #36363633;
  --color-15: #e1e1e1;

  --black-10a: #36363622;
  --black-10: #eaeaea;
  --black-8: #efefef;
  --black-5: #f5f5f5;
  --black-5a: #36363611;

  /* cor dag */
  --color-dag: var(--color-main);

  /* font-size */
  --fs-14: 0.875rem;
  --fs-16: 1rem;
  --fs-18: 1.2rem;
  --fs-26: 1.625rem;
  --fs-32: 2rem;
  --fs-48: 3rem;
  --fs-60: 3.8rem;

  /* font-weight */
  --fw-black: 700;
  --fw-bold: 600;
  --fw-normal: 500;
  --fw-light: 400;

  /* font-family */
  --ff-normal: Isaac, Helvetica, Arial, sans-serif;
  --ff-display: IsaacDisplay, Helvetica, Arial, sans-serif;

  /* font-feature-settings */
  --ffs-alt: "kern" 1, "ss01" 1, "ss02" 1, "ss03" 1, "ss04" 1;

  /* font-icons */
  --ico-right: "\25b6";
  --ico-left: "\25c0";
  --ico-up: "\25b2";
  --ico-down: "\25bc";
}
/* Custom medias */
/**
 * common.css
 *
 * INFORMACION
 * Estilos xenericos para usar na web - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Contido xeral
 * -----------------------------------------------------------------------------
 */
html {
  font-family: var(--ff-normal);
  background-color: var(--black-8);
  color: var(--color-main);
  padding-top: 58px;
  scroll-padding-top: 5rem;
}
figure {
  margin-left: 0;
  margin-right: 0;
}
strong {
  font-weight: var(--fw-bold);
}
.ia-16 {
  width: 32px;
  height: 32px;
  display: block;
  vertical-align: middle;

  & line,
  & circle {
    stroke: var(--color-main);
    fill: none;
    vector-effect: non-scaling-stroke;
    transition: all 0.5s;
    stroke-width: 4px;
    stroke-linecap: round;
  }
}
/* LAYOUTS */
/**
 * wrappers.css
 *
 * INFORMACION
 * Disposicion xeral dos contenedores - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/* Contenedor básico */
.wrapper,
.wrapper-normal,
.wrapper-narrow {
  padding-left: 4vw;
  padding-right: 4vw;
  display: block;
  margin: 0 auto;
}
/* Contenedor comun cun tamaño máximo */
.wrapper-normal {
  max-width: 1200px;
}
/* Contenedor comun mini */
.wrapper-narrow {
  max-width: 740px;
}
/**
 * layouts/grid.css
 *
 * INFORMACION
 * Construcción de grids baseado no plugin de salvattore - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.ly-grid[data-columns] {
  display: flex;
  justify-content: center;

  & > :not(.column) {
    visibility: hidden;
  }

  & > .column {
    width: 100%;
    max-width: 530px;
    box-sizing: border-box;
  }

  &::before {
    color: transparent;
    position: absolute;
  }

  /* 1 columna */
  @media (max-width: 899px) {
    &::before {
      content: "1 .column";
    }
  }

  /* 2 columnas */
  @media (min-width: 900px) {
    & > .column {
      width: 50%;
      padding: 1em 0;

      & > * {
        padding: 0 2em;
      }

      &:nth-child(1) {
        border-right: solid 8px rgba(0, 0, 0, 0.05);
      }
    }
  }

  @media (min-width: 900px) and (max-width: 1499px) {
    &::before {
      content: "2 .column";
    }
  }

  /* 3 columnas */
  @media (min-width: 1500px) {
    &::before {
      content: "3 .column";
    }

    & > .column {
      width: 33.33%;

      &:nth-child(2) {
        border-right: solid 8px rgba(0, 0, 0, 0.05);
      }
    }
  }
}
/**
 * 2cols.css
 *
 * INFORMACION
 * Contenedor con dúas columnas, unha principal e outra de navegación secundaria - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/* Contenedor básico */
.ly-with-navigation {
  padding-bottom: 2rem;

  & > nav {
    border-left: solid 8px var(--black-5);
    box-sizing: border-box;
    margin-top: 2rem;
  }

  @media (min-width: 756px) {
    display: flex;
    justify-content: center;
    padding-top: 2rem;
    padding-bottom: 4rem;

    & .wrapper-narrow {
      padding-left: 0;
      padding-right: 0;
    }

    & > * {
      flex-grow: 1;
      max-width: calc(100% - 17rem);
    }

    & > nav {
      width: 15rem;
      flex-shrink: 0;
      flex-grow: 0;
      margin-left: 2rem;
    }
  }

  @media (min-width: 1024px) {
    & > nav {
      margin-left: 4rem;
    }
  }
}
/**
 * columns.css
 *
 * INFORMACION
 * Contenedor con columnas - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/* 1, 2 e tres columnas */
.ly-1-2-3 {
  & > article {
    box-sizing: border-box;
  }

  @media (min-width: 480px) {
    display: flex;
    flex-wrap: wrap;

    & > article {
      width: 50%;
    }
  }

  @media (min-width: 756px) {
    & > article {
      width: 33.33%;
    }
  }
}
/* columnas propias de css, fluídas */
.ly-cols {
  column-width: 20rem;
  column-gap: 1rem;

  & > * {
    margin: 0 0 1rem 0;
  }

  /* Para evitar cousas raras cos tweets */
  & iframe {
    display: block !important;
    margin: 0 !important;
  }
}
/**
 * groups.css
 *
 * INFORMACION
 * Estilos de layout para grupos de elementos - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.ly-group {
  padding-top: 1rem;

  & > h1 {
    margin: 0;
    padding: 0.5rem 0;
    font-size: var(--fs-48);
    letter-spacing: -0.03em;
    font-weight: var(--fw-light);
    line-height: 1;
  }
  & > div {
    display: flex;
    flex-wrap: wrap;

    & > article {
      padding-bottom: 1rem;
      width: 100%;
      box-sizing: border-box;
      max-width: 420px;
    }
  }

  @media (min-width: 756px) {
    padding-top: 2rem;

    & > div {
      margin-right: -1rem;

      & article {
        padding-right: 1rem;
        width: 50%;
      }
    }
  }

  @media (min-width: 1024px) {
    display: flex;
    padding-top: 1rem;

    & > :first-child {
      width: 3em;
      flex-shrink: 0;
    }

    & > div {
      flex-grow: 1;
    }
  }
}
.ly-group + .ly-group {
  border-top: solid 1px var(--black-8);
}
/* MÓDULOS */
/* Generic button */
/*
Forms made button:

<form class="button" method="post">
	<input type="submit" value="send">
</form>
*/
form%csans-button {
	padding: 0;

	& fieldset {
		display:inline;
		margin:0;
		border:0
	}

	& button,
	& input[type="submit"] {
		background: none;
		border: 0;
		padding: 0.3em 1em;
		margin: 0;
		font-size: inherit;
		font-family: inherit;
		font-weight: inherit;
		line-height: inherit;
		color: inherit;
	}
}
/*
Buttons containing file inputs:

<label class="button">
	Upload a file
	<input type="file">
</label>
*/
/* Buttons with select */
select%csans-button {
	line-height: 1;
	padding-right: 0.7em;
	padding-left: 0.7em;
	outline: none;

	& option {
		padding: 0 0.5em;
	}
}
/* Disabled button */
/* CTA Unirme á DAG */
.cta-join {
	display: block;
	background: var(--black-5);
	margin-top: -2rem;
	top: 0;
	text-align: center;
	padding: .5em 1em;
}
.cta-join a {
		display: inline-flex;
		align-items: center;
		padding: .5em 1em;
		font-weight: var(--fw-normal);
		font-size: var(--fs-16);
		text-decoration: none;
		color: inherit;
	}
.cta-join a:hover {
			text-decoration: underline;
		}
.cta-join a:hover svg {
				animation: cta;
				animation-duration: 500ms;
				animation-iteration-count: infinite;
			}
.cta-join a svg circle {
		opacity: 0;
	}
.cta-join a svg line:nth-child(1) {
			opacity: 1;
			transform: var(--ia16-horizontal-center);
		}
.cta-join a svg line:nth-child(2) {
			opacity: 1;
			transform: translate(var(--ia16-end), var(--ia16-center)) rotate(225deg);
		}
.cta-join a svg line:nth-child(3) {
			opacity: 1;
			transform: translate(var(--ia16-end), var(--ia16-center)) rotate(135deg);
		}
.cta-join a svg {
			width: 12px;
			margin-left: .5em;
		}
.cta-join a svg line {
				stroke-width: 2px;
			}
/* boton básico */
.button {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
}
.button input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
.button[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
}
/* boton negativo principal */
.button-normal {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
}
.button-normal input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
.button-normal[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
}
.button-normal {

	background-color: var(--color-main);
  	color: white;
	border-radius: 2px;
	box-shadow: 0 2px 1px 0 var(--color-light);
	padding: .5em 2em;
	text-transform: uppercase;
	font-weight: var(--fw-normal);
	font-size: var(--fs-16);
}
.button-normal:hover {
		background-color:var(--color-medium);
	}
/* boton secundario */
.button-secondary {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
}
.button-secondary input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
.button-secondary[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
}
.button-secondary {
	background-color: white;
	border: solid 1px var(--color-light);
  	color: var(--color-medium);
	border-radius: 2px;
	padding: .4em 1em .3em 1em;
	font-weight: var(--fw-normal);
}
.button-secondary svg {
		display: inline-block;
		margin-right: .5rem;
}
.button-secondary svg line {
			stroke: var(--color-medium);
}
.button-secondary:hover {
		color: var(--color-main);
		background-color:var(--color-15);
}
.button-secondary:hover svg line {
				stroke: var(--color-main);
}
/* boton para descarga */
.button-download {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
}
.button-download input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
.button-download[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
}
.button-download {
	background-color: white;
	border: solid 1px var(--color-light);
  	color: var(--color-medium);
	border-radius: 2px;
	padding: .4em 1em .3em 1em;
	font-weight: var(--fw-normal);
}
.button-download svg {
		display: inline-block;
		margin-right: .5rem;
}
.button-download svg line {
			stroke: var(--color-medium);
}
.button-download:hover {
		color: var(--color-main);
		background-color:var(--color-15);
}
.button-download:hover svg line {
				stroke: var(--color-main);
}
.button-download svg {
		@extend %ia16-plus;
		width: 24px;
	}
.button-download svg line {
			stroke-width: 2px;
		}
.button-download:hover svg {
			@extend %ia16-bottom;
		}
/* boton para ir a unha url */
.button-go {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
}
.button-go input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
.button-go[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
}
.button-go {
	background-color: white;
	border: solid 1px var(--color-light);
  	color: var(--color-medium);
	border-radius: 2px;
	padding: .4em 1em .3em 1em;
	font-weight: var(--fw-normal);
}
.button-go svg {
		display: inline-block;
		margin-right: .5rem;
}
.button-go svg line {
			stroke: var(--color-medium);
}
.button-go:hover {
		color: var(--color-main);
		background-color:var(--color-15);
}
.button-go:hover svg line {
				stroke: var(--color-main);
}
.button-go svg {
		@extend %ia16-plus;
		width: 24px;
	}
.button-go svg line {
			stroke-width: 2px;
		}
.button-go:hover svg {
			@extend %ia16-right;
		}
/* botóns modo tabs */
.buttons-tabs {
	display: flex;
	padding: 2rem 0;
}
.buttons-tabs .button {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
	}
.buttons-tabs .button input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
	}
.buttons-tabs .button[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
	}
.buttons-tabs .button {
		border: solid 1px var(--color-15);
		padding: .8em 1em;
		margin-bottom: -1px;
		background: none;
		color: var(--color-medium);
	}
.buttons-tabs .button:first-child {
			border-radius: 2px 0 0 2px;
		}
.buttons-tabs .button:last-child {
			border-radius: 0 2px 2px 0;
		}
.buttons-tabs .button + .button {
			border-left: none;
		}
.buttons-tabs .button:hover {
			text-decoration: underline;
		}
.buttons-tabs .button.is-selected {
			background: var(--color-main);
			color: white;
			border-color: var(--color-main);
			text-decoration: none;
		}
.has-page-content-bar .buttons-tabs .button.is-selected {
		background: var(--black-5);
}
.buttons-tabs.is-inverted .button {
			border-color: var(--color-dark);
			color: var(--color-medium);
		}
.buttons-tabs.is-inverted .button:hover {
				color: white;
			}
.buttons-tabs.is-inverted .button.is-selected {
				background: white;
				border-color: white;
				color: var(--color-main);
			}
/* botóns para tags */
.buttons-tags {
	margin: 0;
	padding: 2em 0;

	& li {
		font-size: var(--fs-16);
		display: inline-block;
		margin: 0 1em 0.3em 0;

		&.is-selected a {
			color: white;
			background: var(--color-main);
			border-radius: 2px;
			padding: 0.4em 0.6em;
		}
	}

	& a {
		color: var(--color-medium);
		text-decoration: none;
		display: block;
		white-space: nowrap;
		text-transform: uppercase;
		font-size: var(--fs-14);
		padding: 0.4em 0;

		&:hover{
			color: var(--color-main);
			text-decoration: underline;
		}
	}

	&.is-inverted {
		& li {
			&.is-selected a {
				background: white;
				color: var(--color-main);
			}
		}
		& a {
			&:hover {
				color: white;
			}
		}
	}
}
.buttons-tabs + .buttons-tags {
	padding-top: 0;
}
@keyframes cta {
	0% {
		transform: translateX(0);
	}
	50% {
		transform: translateX(50%);
	}
	100% {
		transform: translateX(0);
	}
}
/* @import "css/modules/image-viewer.css"; */
/**
 * page-header.css
 *
 * INFORMACION
 * Estilos para a cabeceira comun - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.page-header {
  background-color: white;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
  box-sizing: border-box;
  color: var(--color-main);
}
/* Logo da dag */
.page-logo {
  text-decoration: none;
  color: inherit;
  display: block;
  margin: 0;
  margin-right: 1em;
  font-size: 0.8rem;
  line-height: 1.2;
  font-weight: var(--fw-light);
  max-width: 10em;

  /* Letras */
  & span {
    display: block;
    margin-top: 0.5em;
  }

  /* Svg coas siglas DAG */
  & svg {
    display: block;
    margin-right: 0.5em;
    flex-shrink: 0;

    & path {
      fill: var(--color-main);
    }
  }
}
/* Menú principal */
.page-menu > .page-menu-button {
    background: none;
    border: none;
    display: block;
    padding: 0.8rem 1rem;
    position: relative;
    right: -1rem;
    cursor: pointer;
  }
.page-menu > .page-menu-button svg circle {
		opacity: 0;
	}
.page-menu > .page-menu-button svg line:nth-child(1) {
			opacity: 1;
			transform: var(--ia16-horizontal-top);
		}
.page-menu > .page-menu-button svg line:nth-child(2) {
			opacity: 1;
			transform: var(--ia16-horizontal-center);
		}
.page-menu > .page-menu-button svg line:nth-child(3) {
			opacity: 1;
			transform: var(--ia16-horizontal-bottom);
		}
.page-menu > .page-menu-button svg {
      width: 32px;
      height: 32px;
    }
.page-menu > .page-menu-button line {
      stroke-width: 3px;
      stroke-linecap: unset;
    }
@media (min-width: 756px) {
  .page-menu > .page-menu-button {
      display: none;
  }
    }
.page-menu > ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-transform: uppercase;
    font-size: 0.9rem;
  }
.page-menu > ul > li {
      margin: 0;
    }
/* menu mobil */
@media (max-width: 755px) {
  .page-menu > ul {
      position: fixed;
      right: -240px;
      top: 0;
      width: 100%;
      height: 100vh;
      max-width: 240px;
      background: var(--color-main);
      color: white;
      padding: 1rem 0;
      box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
  }

      .page-menu > ul a {
        border-left: solid 6px transparent;
        padding: 1.3rem 0.3em 1rem 1.3em;
      }

        .page-menu > ul a:hover {
          border-color: white;
          background: black;
        }

      .page-menu > ul .is-selected a {
        border-color: white;
      }
      .page-menu > ul .show-mobil {
        display: block;
      }
    }
/* menu normal */
@media (min-width: 756px) {
  .page-menu > ul {
      display: flex;
  }

      .page-menu > ul a {
        border-bottom: solid 6px transparent;
        padding: 1.3rem 0.3em 1rem 0.3em;
        white-space: nowrap;
      }

        .page-menu > ul a:hover {
          border-color: var(--black-5a);
        }

      .page-menu > ul > li {
        padding: 0 0.5rem;
      }
    }
.page-menu a {
    color: inherit;
    text-decoration: none;
    display: block;

    transition: border-color 0.3s;
    margin-bottom: -1px;
  }
.page-menu .is-selected a {
    border-color: var(--color-main);
    font-weight: var(--fw-bold);
  }
/* Estado para mostrar so no menu mobil*/
.page-menu .show-mobil {
    display: none;
  }
/* Idiomas coa lista */
.page-menu .page-menu-lang ul {
      border-left: 1px solid var(--color-light);
      border-right: 1px solid var(--color-light);
      padding: 0 5px;
    }
.page-menu .page-menu-lang li {
      display: none;
      margin: 0;
    }
.page-menu .page-menu-lang .is-active {
      display: block;
    }
.page-menu .page-menu-lang .is-active a::after {
        content: "▼";
        font-size: 0.8em;
        margin-left: 0.5rem;
      }
.page-menu .page-menu-lang.is-opened {
      position: relative;
      width: 59px;
    }
.page-menu .page-menu-lang.is-opened ul {
        background-color: white;
        position: absolute;
        border-bottom: 1px solid var(--color-light);
      }
.page-menu .page-menu-lang.is-opened ul a {
          color: var(--color-main);
        }
.page-menu .page-menu-lang.is-opened .is-active a::after {
          visibility: hidden;
        }
.page-menu .page-menu-lang.is-opened li {
        display: block;
      }
/* idiomas mobil */
@media (max-width: 749px) {
      .page-menu .page-menu-lang ul {
        border: none;
        border-top: 1px solid black;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
      }
        .page-menu .page-menu-lang ul li {
          border-bottom: 1px solid black;
        }

      /* aliña a frecha a dereita */
        .page-menu .page-menu-lang .is-active a::after {
          content: "▼";
          position: absolute;
          right: 1.5em;
        }
      .page-menu .page-menu-lang.is-opened {
        width: 100%;
      }
        .page-menu .page-menu-lang.is-opened ul {
          background-color: transparent;
        }

          .page-menu .page-menu-lang.is-opened ul a {
            color: white;
          }
    }
@media (max-width: 749px) {
  .page-header,
  .page-content,
  .page-footer {
    transition: transform 0.5s;
  }
    .has-menu-opened .page-header,
    .has-menu-opened .page-content,
    .has-menu-opened .page-footer {
      transform: translateX(-240px);
    }
      .has-menu-opened .page-menu > ul {
        display: block;
        padding-top: 3.6rem;
      }
    .has-menu-opened .page-menu-button {
      background: var(--color-main);
    }

      .has-menu-opened .page-menu-button line {
        stroke: white;
      }
	.has-menu-opened .page-menu-button svg circle {
		opacity: 0;
	}
		.has-menu-opened .page-menu-button svg line:nth-child(1) {
			opacity: 1;
			transform: translate(var(--ia16-align-end), var(--ia16-align-start)) rotate(135deg);
		}

		.has-menu-opened .page-menu-button svg line:nth-child(2) {
			opacity: 1;
			transform: translate(var(--ia16-align-start), var(--ia16-align-start)) rotate(45deg);
		}

		.has-menu-opened .page-menu-button svg line:nth-child(3) {
			opacity: 0;
		}

      @media (min-width: 480px) {
    .has-menu-opened .page-menu-button {
        right: -2em;
    }
      }
}
/**
 * page-content.css
 *
 * INFORMACION
 * Disposicion xeral dos contenedores - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 Contido da paxina comun. REVISAR - Pode ser comun o page-content?
*/
.page-content {
  padding-top: 2rem;
  background-color: white;
}
/* Barra superior */
.page-content-bar {
  border-bottom: solid 1px var(--black-8);
}
/* Paxinación na parte inferior */
.page-content-pagination {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
/**
 * page-footer.css
 *
 * INFORMACION
 * Estilos para o footer comun - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.page-footer {
  font-size: var(--fs-14);
  font-weight: var(--fw-light);
  color: var(--color-medium);
  padding-top: 3em;
  padding-bottom: 3em;
  max-width: 1060px;

  & ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  & p {
    margin-top: 0;
  }

  & address {
    font-style: normal;
  }

  & a {
    color: var(--color-medium);

    &:hover {
      color: var(--color-main);
    }
  }

  & h4 {
    color: var(--color-main);
    font-size: var(--fs-16);
    font-weight: var(--fw-normal);
    margin-top: 0;
    margin-bottom: 0.4em;
  }
  & h5 {
    font-size: var(--fs-14);
    font-weight: var(--fw-light);
    margin: 0em;
  }
}
.page-footer-content {
  display: grid;
  column-gap: 1em;
  row-gap: 1em;
  justify-content: center;
  grid-template-areas: "logo" "info" "contact";

  @media (min-width: 600px) {
    justify-content: space-between;
    grid-template-areas: "logo contact" "info contact";
  }

  @media (min-width: 756px) {
    grid-template-areas: "logo info contact";
  }
}
.footer-logo {
  color: var(--color-main);
  margin-bottom: 1em;
  grid-area: logo;
}
.footer-info {
  grid-area: info;
}
.footer-contact {
  grid-area: contact;
}
.social li {
    display: inline-block;
  }
.social .button {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
  }
.social .button input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
  }
.social .button[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
  }
.social .button {

    background-color: transparent;
    font-size: var(--fs-16);
    padding: 0.5em;
    border-radius: 3px;
  }
.social .button::before {
      width: 38px;
    }
.social .button:hover {
      background-color: var(--color-light);
    }
.social .button span {
      display: none;
    }
.footer-read {
  margin-top: 1rem;

  & svg {
    display: block;
    width: 140px;
    height: auto;
  }
  & path,
  & rect,
  & polygon {
    fill: var(--color-main);
  }

  & a {
    display: block;
    text-decoration: none;
    color: var(--color-main);
  }
}
.page-footer-menu {
  margin-top: 2em;
  padding-top: 2em;
  width: 100%;
  border-top: solid 1px var(--color-light);
  text-align: center;

  & a {
    margin-right: 1em;
  }
  @media (min-width: 600px) {
    text-align: left;
  }
}
/**
 * share.css
 *
 * INFORMACION
 * Estilos para botóns de compartir - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.share a {
	box-sizing: border-box;
	display: inline-block;
	padding: 0.3em 1em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid transparent;
	text-decoration: none;
	font-style: normal;
	white-space: nowrap;
	margin: 0;
	position: relative;
	overflow: hidden;
	background: #ccc;
	color: black;
	font-size: 1em;
	line-height: 1.25;
	max-width: 100%;
	text-overflow: ellipsis;
  }
.share a input[type="file"] {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
  }
.share a[disabled] {
	cursor: default;
	opacity: 0.5;
	pointer-events: none;
  }
.share a {
    background: white;
    border-radius: 2px;
    padding: 0.5em;
  }
.share a svg {
      display: inline-block;
      vertical-align: middle;
    }
.share a span {
      display: none;
    }
@media (min-width: 480px) {
  .share a {
      padding: 0.5em 1em 0.4em 1em;
  }

      .share a span {
        display: inline;
        padding-left: 0.3em;
      }
    }
.share a.share-twitter:hover, .share a.share-facebook:hover, .share a.share-gplus:hover {
        color: white;
      }
.share a.share-twitter {
      border-color: #55acee;
      color: #55acee;
    }
.share a.share-twitter:hover {
        background-color: #55acee;
      }
.share a.share-facebook {
      border-color: #3b5998;
      color: #3b5998;
    }
.share a.share-facebook:hover {
        background-color: #3b5998;
      }
.share a.share-gplus {
      border-color: #dc4a38;
      color: #dc4a38;
    }
.share a.share-gplus:hover {
        background-color: #dc4a38;
      }
/**
 * promo.css
 *
 * INFORMACION
 * Estilos para a promo.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.promo {
  margin-top: -60px;

  & .page-header {
    transition: all 0.5s;

    &:not(.is-sticky) {
      color: inherit;
      background: none;
    }
  }
}
/**
 * carousel.css
 *
 * INFORMACION
 * Estilos para carruseles - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.carousel {
  box-sizing: border-box;
  width: 100%;
  overflow: hidden;
  position: relative;
}
.carousel .carousel-tray {
    display: flex;
    transition: transform 1s;
  }
.carousel .carousel-tray > * {
      flex: 0 0 auto;
    }
.carousel .carousel-prev,
  .carousel .carousel-next {
    position: absolute;
    top: 50%;
    margin-top: -35px;
    background: rgba(255, 255, 255, 0.5);
    padding: 12px;
    cursor: pointer;
    transition: background 0.3s;
  }
.carousel .carousel-prev:hover, .carousel .carousel-next:hover {
      background: white;
    }
.carousel .carousel-prev {
    left: 0;
    border-radius: 0 3px 3px 0;
  }
.carousel .carousel-prev svg circle {
		opacity: 0;
	}
.carousel .carousel-prev svg line:nth-child(1) {
			opacity: 1;
			transform: var(--ia16-horizontal-center);
		}
.carousel .carousel-prev svg line:nth-child(2) {
			opacity: 1;
			transform: translate(var(--ia16-start), var(--ia16-center)) rotate(-45deg);
		}
.carousel .carousel-prev svg line:nth-child(3) {
			opacity: 1;
			transform: translate(var(--ia16-start), var(--ia16-center)) rotate(45deg);
		}
.carousel .carousel-next {
    right: 0;
    border-radius: 3px 0 0 3px;
  }
.carousel .carousel-next svg {
      @extend %ia16-right;
    }
/**
 * sections.css
 *
 * INFORMACION
 * Estilos para a visualización de seccións xenéricas - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/**
 * estilos comúns
 */
.section {
  padding-top: 2rem;
  padding-bottom: 2rem;
  margin-top: 0;
  margin-bottom: 0;

  & figcaption {
    text-align: left;
    max-width: 740px;
    font-size: 0.8rem;
    margin: 1rem auto;
  }
}
/**
 * Sección de tipo "text"
 */
.section-text {}
/**
 * Sección de tipo "imaxe"
 */
.section-image {
  position: relative;

  & a:focus {
    outline: 0;
  }

  & img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
  }

  & figcaption {
    margin-bottom: 2rem;
  }

  /* Imaxe aliñada á dereita */
  &.is-mode-right {
    max-width: 300px;
    margin: 1rem auto;
    padding-bottom: 0;

    @media (min-width: 1024px) {
      float: right;
      margin-right: -120px;
      margin-left: 2rem;
      clear: right;
    }
  }
}
/**
 * Sección de tipo "embed"
 */
.section-embed {
  --max-height: 100vh;

  position: relative;
  text-align: center;
  margin: 0 0 1em 0;
  max-height: var(--max-height);
}
.section-embed a {
    color: var(--color-medium);
  }
.section-embed a:hover {
      text-decoration: none;
    }
.section-embed p {
    font-size: var(--fs-14);
    margin: 0;
  }
.section-embed iframe {
    margin: 0 auto;
    max-width: 100%;
  }
.section-embed iframe + p {
      padding: 0 2em;
    }
/* Clase para manter a proporción de widgets sendo escalables */
.section-embed .aspect-ratio {
	max-width: 100%;
	position: relative;
	height: 0;
	overflow: hidden;
	padding: 0;
  }
.section-embed .aspect-ratio iframe,
	.section-embed .aspect-ratio object,
	.section-embed .aspect-ratio embed,
	.section-embed .aspect-ratio .aspect-ratio-target {
		position: absolute;
		top: 0;
		left: 0;
		width: 100% !important;
		height: 100% !important;
	}
.section-embed .aspect-ratio iframe {
      max-height: var(--max-height);
    }
/**
 * Sección de tipo "file" e "button"
 */
.section-button,
.section-file {
  text-align: center;
}
/**
 * Sección de tipo "logos"
 */
.section-logos {
  & ul {
    list-style: none;
    margin: 2rem 0 0 0;
    padding: 0 !important;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    grid-gap: 4rem;
  }
  & li {
    text-align: center;
    font-size: var(--fs-14);
    line-height: 1.2;
    margin: 0 !important;
  }
  & img {
    max-width: 100%;
    height: 120px;
    object-fit: contain;
  }
}
/* Cookies advise */
.cookies-advise {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  font-size: var(--fs-14);
  padding-bottom: 1em;

  & p {
    display: block;
    line-height: 1.5em;
    margin: 0;
    color: white;
    padding: 1em 1em 0 1em;
  }

  & button {
    background: none;
    border: solid 1px white;
    color: white;
    padding: 0.5em;

    &:hover {
      background: black;
    }
  }

  @media (min-width: 480px) {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  &.is-hidden {
    display: none;
  }
}
/**
 * form.css
 *
 * INFORMACION
 * Estilos para formularios - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
.form {
  background: var(--black-8);
  padding: 1em;
  border-radius: 3px;
  text-align: left;

  & .form-title {
    font-weight: var(--fw-bold);
    margin: 0;
    padding: 0.5em 0;
    margin-bottom: 1em;
    border-bottom: solid 1px var(--color-light);
  }

  /*honeypot*/
  & .hpt_input {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    opacity: 0;
    cursor: default;
  }

  & .form-row,
  & .form-row-radio {
    font-size: var(--fs-16);
    color: var(--color-main);
    margin-top: 1.5em;
  }

  & .form-footer {
    margin-top: 1.5em;
    padding-top: 1em;
    border-top: solid 1px var(--color-light);

    & .form-advice {
      margin-top: 1em;
    }
  }

  & .form-row {
    & label {
      display: block;
      margin: 0.3em 0;
    }
  }

  & .form-advice {
    font-size: var(--fs-14);
    line-height: 1.3;
    color: var(--color-medium);
    margin: 0.3em 0;

    & a {
      color: var(--color-main);

      &:hover {
        text-decoration: none;
      }
    }
  }

  & .form-control {
    position: absolute;
    left: -100px;
    opacity: 0;
  }

  & .error {
    color: var(--color-error);
  }

  & textarea,
  & input[type="text"],
  & input[type="url"],
  & input[type="email"],
  & input[type="tel"] {
    width: 100%;
    box-sizing: border-box;
    border: solid 1px var(--color-light);
    font-size: var(--fs-16);
    padding: 0.5em;
    border-radius: 3px;
    color: var(--color-medium);
  }
}
/* ENTIDADES */
/**
 * news.css
 *
 * INFORMACION
 * Estilos para a visualización de novas - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Estilos comúns
 */
.new {}
.new-header {
  color: var(--color-medium);

  /* Lista de etiquetas */
  & > nav {
    display: inline;
    font-size: var(--fs-14);
    font-weight: var(--fw-bold);
    text-transform: uppercase;

    & a {
      text-decoration: none;
      margin-right: 1em;
      color: var(--color-dag);

      &:hover {
        color: var(--color-medium);
      }
    }
  }

  /* Data */
  & > time {
    font-size: var(--fs-14);
    white-space: nowrap;
  }

  /* Título */
  & > h1 {
    line-height: 1;
    font-weight: var(--fw-bold);
    color: var(--color-main);
    margin: 0;

    & a {
      text-decoration: none;
      color: var(--color-main);

      &:hover {
        color: var(--color-medium);
      }
    }
  }
}
.new-intro,
.new-body {
  color: var(--color-dark);
  font-weight: var(--fw-light);
  font-size: var(--fs-16);

  & a {
    color: inherit;

    &:hover {
      color: var(--color-main);
      text-decoration: none;
    }
  }
}
.new-body {
  line-height: 1.45;

  & h2,
  & h3 {
    color: var(--color-main);
    line-height: 1.1;
    margin-top: 1.5em;
  }
  & h2 {
    font-size: var(--fs-18);
    font-weight: var(--fw-normal);
  }
  & h3 {
    font-size: var(--fs-16);
    font-weight: var(--fw-bold);
  }
  & li {
    margin: 0.5em 0;
  }

  & strong {
    font-weight: var(--fw-normal);
    color: var(--color-main);
  }
}
/**
 * Noticia modo listado 
 */
.new-list {
  border-top: 1px solid var(--black-8);
  padding-top: 1.3em;
  padding-bottom: 1.3em;

  & .new-header {
    & > h1 {
      font-size: var(--fs-26);
      margin: 0.2em 0;
    }

    @media (min-width: 480px) {
      & time {
        float: right;
        margin: 0.2em 0 2em 2em;
      }
    }
  }
}
/**
 * Noticia modo grella
 */
.new-grid {
  border-bottom: 1px solid var(--black-8);
  padding: 2rem 0;

  & .new-header {
    & > h1 {
      font-size: var(--fs-26);
      margin: 0.2em 0;
    }
  }

  & .new-intro p {
    margin-bottom: 0;
    line-height: 1.4;
  }

  & .section {
    margin: 0 auto;
    padding-bottom: 0;

    &:first-child {
      margin-top: 0;
      margin-bottom: 1rem;
    }
  }
}
/**
 * Noticia modo permalink
 */
.new-permalink {
  position: relative;

  & .new-header {
    margin-bottom: 1.5rem;

    & > h1 {
      margin-top: 0.5rem;
      font-size: var(--fs-32);
      letter-spacing: -0.02em;

      @media (min-width: 30rem) {
        font-size: var(--fs-48);
        letter-spacing: -0.03em;
      }
    }
  }

  & .new-intro {
    font-size: var(--fs-18);
    color: var(--color-main);
    margin-bottom: 1rem;
  }

  & .new-body {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;

    & > .new-section-text {
      /* capitular */
      &:first-of-type > p:first-child::first-letter {
        font-size: var(--fs-48);
        font-weight: var(--fw-bold);
        display: inline-block;
        line-height: 0;
      }
      /* sangría */
      & p + p {
        text-indent: 1em;
      }
    }
  }

  @media (min-width: 756px) {
    & .new-intro {
      font-size: var(--fs-26);
      letter-spacing: -0.01em;
    }
    & .new-body {
      font-size: var(--fs-18);

      & h2 {
        font-size: var(--fs-26);
      }
      & h3 {
        font-size: var(--fs-18);
      }
    }
  }
}
/**
 * news.css
 *
 * INFORMACION
 * Estilos para a visualización de artigos - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Estilos comúns
 */
.article {}
.article-header {
  color: var(--color-medium);

  /* Lista de etiquetas */
  & > nav {
    display: inline;
    font-size: var(--fs-14);
    font-weight: var(--fw-bold);
    text-transform: uppercase;

    & a {
      text-decoration: none;
      margin-right: 1em;
      color: var(--color-dag);

      &:hover {
        color: var(--color-medium);
      }
    }
  }

  /* Título */
  & > h1 {
    line-height: 1;
    font-weight: var(--fw-bold);
    color: var(--color-main);
    margin: 0;

    & a {
      text-decoration: none;
      color: var(--color-main);

      &:hover {
        color: var(--color-medium);
      }
    }
  }
}
.article-body {
  color: var(--color-dark);
  font-weight: var(--fw-light);
  font-size: var(--fs-16);
  line-height: 1.45;

  & a {
    color: inherit;

    &:hover {
      color: var(--color-main);
      text-decoration: none;
    }
  }

  & h2,
  & h3 {
    color: var(--color-main);
    line-height: 1.1;
    margin-top: 1.5em;
  }
  & h2 {
    font-size: var(--fs-18);
    font-weight: var(--fw-normal);
  }
  & h3 {
    font-size: var(--fs-16);
    font-weight: var(--fw-bold);
  }
  & li {
    margin: 0.5em 0;
  }

  & strong {
    font-weight: var(--fw-normal);
    color: var(--color-main);
  }
}
/**
 * Artigo modo listado e grella
 */
.article-grid,
.article-list {
  padding-top: 1.5em;
  padding-bottom: 1.5em;

  & > a {
    text-decoration: none;
    display: flex;
    align-items: center;

    &:hover .article-header h1 {
      color: var(--color-medium);
    }
  }

  & .article-thumbnail {
    display: none;
  }

  @media (min-width: 480px) {
    & > a {
      display: flex;
      align-items: center;
    }

    & .article-thumbnail {
      margin-right: 1rem;
      border-radius: 3px;
      flex: 0 0 200px;
      display: block;
    }
  }

  & .article-header {
    & > h1 {
      margin-top: 0.2em;
      font-size: var(--fs-26);
    }
  }
  & .article-author {
    margin-top: 0.5rem;
  }
}
/**
 * Artigo modo grella
 */
.article-grid {
  border-bottom: 1px solid var(--black-8);
}
/**
 * Artigo modo listado
 */
.article-list {
  max-width: 30em;
  display: inline-block;

  @media (min-width: 756px) {
    padding-right: 3em;
  }
}
/**
 * Artigo modo permalink
 */
.article-permalink {
  position: relative;

  & .article-header {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: var(--color-main);
    max-width: none;
    margin-top: -2rem;
    margin-bottom: 1.5rem;
    height: 70vh;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    text-align: center;

    & > * {
      position: relative;
      z-index: 1;
    }

    &::before {
      content: "";
      display: block;
      position: absolute;
      background: black;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background: rgba(0, 0, 0, 0.3);
    }

    & > h1 {
      color: white;
      margin-top: 0.5rem;
      font-size: var(--fs-32);
      letter-spacing: -0.02em;
      max-width: 40rem;
      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.7);

      @media (min-width: 30rem) {
        font-size: var(--fs-48);
        letter-spacing: -0.03em;
      }
    }

    & .share {
      margin: 2rem 0;
    }
  }

  & .article-body {
    margin-top: 5rem;
    padding-bottom: 2rem;
    position: relative;

    & > .section-text {
      @media (min-width: 756px) {
        &:first-child {
          margin-top: -10rem;
          padding-top: 4rem;
          background: white;
        }
      }

      /* capitular */
      &:first-of-type > p:first-child::first-letter {
        font-size: var(--fs-48);
        font-weight: var(--fw-bold);
        display: inline-block;
        line-height: 0;
      }
      /* sangría */
      & p + p {
        text-indent: 1em;
      }
    }

    /* Notas a pe de páxina */
    & li:target,
    & p:target {
      outline: dashed var(--color-medium) 1px;
      outline-offset: 10px;
    }

    & p[id] {
      font-size: var(--fs-16);
      text-indent: 0 !important;
    }
  }

  @media (min-width: 756px) {
    & .article-body {
      font-size: var(--fs-18);

      & h2 {
        font-size: var(--fs-26);
      }
      & h3 {
        font-size: var(--fs-18);
      }
    }
  }
}
/**
 * portfolio.css
 *
 * INFORMACION
 * Estilos para a visualización de portfolios dos socios - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Estilos comuns
 */
.portfolio {
  & figure {
    margin: 0;
    line-height: 0;

    & img {
      max-width: 100%;
      object-fit: cover;
    }
  }
  & figcaption {
    line-height: 1.2;
    text-align: center;
  }
}
.portfolio-header {
  & > h1 {
    font-size: var(--fs-16);
    font-weight: var(--fw-normal);
    margin: 0em;

    & a {
      text-decoration: none;
      color: var(--color-main);

      &:hover {
        color: var(--color-medium);
      }
    }
  }
}
.portfolio-authors {
  margin: 0;
  padding: 0;
  list-style: none;
  min-height: 48px;
  display: flex;

  & img {
    display: block;
  }
  & span {
    display: none;
  }

  & > li {
    & + li {
      margin-left: 4px;
    }
  }

  & a {
    text-decoration: none;
  }

  & span {
    font-size: var(--fs-16);
    color: var(--color-dark);
  }
}
/**
 * Portfolio modo listado
 */
.portfolio-list {
  max-width: 420px;

  & > a {
    padding: 0;
    display: block;
    color: inherit;
    text-decoration: none;

    & .portfolio-thumbnail {
      transition: transform 0.3s;
    }

    &:hover,
    &:focus {
      & .portfolio-thumbnail {
        transform: scale(1.05, 1.05);
      }
    }

    & > div {
      display: flex;
      position: relative;
      margin-top: 4px;
    }
    & .portfolio-header {
      padding: 0.3em 0.3em 0 0;
      flex-grow: 1;
    }
    & .portfolio-authors {
      position: absolute;
      top: -60px;
      right: 5px;

      & img {
        padding: 1px;
        background: white;
        display: block;
      }
      & span {
        display: none;
      }
    }
  }

  /* miniatura */
  & .portfolio-thumbnail {
    width: 100%;

    & img {
      border-radius: 3px;
    }
  }

  /* Iconos */
  & .portfolio-icon {
    margin-right: 0.5em;
    float: left;

    & + div {
      overflow: hidden;
      min-height: 48px;
    }
  }

  @media (min-width: 480px) {
    & > a {
      padding: 1rem;
    }
  }
}
/**
 * Portfolio modo listado nunha grella
 * Mostraríase en negro
 */
.portfolios-grid {
  padding-top: 2rem;
  background: var(--color-main);
  color: var(--color-medium);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;

  & .portfolio-list {
    width: 100%;
    margin-bottom: 2em;
    padding: 0.5rem 0;

    & > a:hover {
      color: white;
    }
  }
}
/**
 * Portfolio modo listado nun carrusel
 */
.carousel .portfolio-list {
  @media (min-width: 480px) {
    width: 420px;
  }
}
/**
 * Portfolio modo permalink
 */
.portfolio-permalink {
  font-weight: var(--fw-light);

  & .portfolio-header {
    & h1 {
      font-size: var(--fs-48);
    }
  }

  & .portfolio-data {
    border-left: 1px solid var(--color-light);
    padding-left: 1em;
    & dt {
      font-weight: var(--fw-bold);
    }
    & dd {
      margin-left: 0;
      margin-bottom: 0.5em;
    }
  }

  & .porfolio-body {
    font-size: var(--fs-18);
    color: var(--color-dark);
    margin-top: 3rem;
    line-height: 1.45;

    & a {
      color: inherit;

      &:hover {
        text-decoration: none;
      }
    }
  }
}
/**
 * members.css
 *
 * INFORMACION
 * Estilos para a visualización dos socios - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Estilos comuns
 */
.member {}
.member-header {
  & > h1 {
    margin-bottom: 0;
    font-size: var(--fs-32);
    font-weight: var(--fw-normal);
    letter-spacing: -0.02em;

    @media (min-width: 30rem) {
      font-size: var(--fs-48);
      letter-spacing: -0.03em;
    }
  }
  & p {
    margin-top: 0em;
    color: var(--color-medium);
  }
}
.member-address {
  margin: 1.75em 0;
  & ul {
    list-style-type: none;
    padding: 0;
  }
  & li {
    display: inline-block;
    margin-bottom: 0.25em;
  }
}
.member-bio {
  font-size: var(--fs-16);
  line-height: 1.4em;
  color: var(--color-dark);

  @media (min-width: 30rem) {
    font-size: var(--fs-18);
  }

  & a {
    color: inherit;

    &:hover {
      color: var(--color-main);
      text-decoration: none;
    }
  }
}
.member-avatar {
  margin: 0;

  & img {
    border-radius: 3px;
    object-fit: cover;
  }
}
/* Socios mini li */
.member-mini {
  display: inline-block;
  margin-right: 1em;
  font-size: var(--fs-14);

  & a {
    text-decoration: none;
    color: var(--color-medium);
    &:hover {
      color: var(--color-main);
    }
  }
}
/**
 * Socios modo listado
 */
.member-list {
  display: flex;
  align-items: center;
  padding: 0.5rem 0.5rem;

  & .member-avatar {
    flex: 0 0 64px;
    margin-right: 1em;
  }

  & .member-header {
    flex: 1;

    & h1 {
      font-size: var(--fs-18);
    }

    & a {
      color: inherit;
      text-decoration: none;

      &:hover {
        text-decoration: underline;
      }
    }
  }
}
/**
 * Socios modo permalink
 */
.member-permalink {
  padding-bottom: 100px;

  & .member-address {
    font-style: normal;
    color: var(--color-medium);
    line-height: 1.4;

    & a {
      color: inherit;

      &:hover {
        color: black;
        text-decoration: none;
      }
    }

    & p {
      margin: 0;
    }
  }

  & + .member-portfolio {
    margin-top: 4em;
  }

  @media (min-width: 756px) {
    padding-left: 200px;
    position: relative;

    & .member-avatar {
      position: absolute;
      left: 40px;
    }
  }
}
/**
 * projects.css
 *
 * INFORMACION
 * Estilos para a visualización de proxectos da dag - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Estilos comuns
 */
.project {
  & .project-header {
    & > h1 {
      margin: 0;
      font-weight: var(--fw-normal);
    }
  }
}
/**
 * Modo listado
 */
.project-list {
  box-sizing: border-box;
  max-width: 30rem;

  & > a {
    min-height: 8rem;
    display: block;
    text-decoration: none;
    color: inherit;
    position: relative;
  }

  & .project-image {
    padding: 0;
    margin: 0;
    line-height: 0;

    & img {
      border-radius: 3px;
      max-width: 100%;
      object-fit: cover;
    }
  }

  & .project-header {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

    & > h1 {
      font-size: var(--fs-18);
      text-align: center;
      padding: 2em;
    }
  }
}
/**
 * about.css
 *
 * INFORMACION
 * Estilos para a visualización de textos sobre a dag - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Estilos comúns
 */
.about {}
.about-body {
  color: var(--color-dark);
  font-weight: var(--fw-light);
  font-size: var(--fs-16);
  line-height: 1.45;

  & a {
    color: inherit;

    &:hover {
      color: var(--color-main);
      text-decoration: none;
    }
  }

  & h2,
  & h3,
  & h4 {
    color: var(--color-main);
    font-weight: var(--fw-normal);
    line-height: 1.1;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
  }
  & h2 {
    font-size: var(--fs-18);
  }
  & h3 {
    font-size: var(--fs-16);
  }
  & h4 {
    font-size: var(--fs-16);
    font-weight: var(--fw-normal);
  }
  & li,
  & p {
    margin: 0.5em 0;
  }

  & strong {
    font-weight: var(--fw-normal);
    color: var(--color-main);
  }
}
/**
 * Texto en modo permalink
 */
.about-permalink {
  & .about-header {
    & > h1 {
      font-size: var(--fs-32);
      letter-spacing: -0.02em;
      line-height: 1;
      font-weight: var(--fw-normal);
      color: var(--color-main);
      margin: 0;

      @media (min-width: 30rem) {
        font-size: var(--fs-48);
        letter-spacing: -0.03em;
      }
    }
  }

  & .about-body {
    margin-top: 2rem;

    & ol,
    & ul {
      padding-left: 1.5em;
    }

    @media (min-width: 1024px) {
      font-size: var(--fs-18);

      & h2 {
        font-size: var(--fs-26);
      }
      & h3 {
        font-size: var(--fs-18);
      }
      & h4 {
        font-size: var(--fs-18);
        font-style: italic;
      }
    }
  }
}
/**
 * Menú
 */
.about-menu {
  & ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: var(--fs-18);
    line-height: 1.2;
    position: sticky;
    top: 5rem;
  }
  & a {
    color: var(--color-medium);
    text-decoration: none;
    padding: 0.5rem 0.5rem 0.5rem 1rem;
    display: inline-block;

    &:hover {
      color: var(--color-main);
      text-decoration: underline;
    }
  }

  & li {
    border-left: solid 8px transparent;
    margin-left: -8px;

    &.is-active {
      border-color: var(--color-main);

      & a {
        color: var(--color-main);
      }
    }
  }
}
/**
 * banners.css
 *
 * INFORMACION
 * Estilos para a visualización de banners da dag - http://asociaciondag.org.
 *
 * AUTORES
 * Oscar Otero e Segundo Fdez no ano 2015.
 * http://oscarotero.com | http://segundofdez.com
 *
 * FERRAMENTAS
 * Stylecow ............... http://stylecow.github.io/
 * Desenvolvido por Oscar Otero.
 *
 * XENERICO
 * normalize.css .......... http://necolas.github.io/normalize.css
 * Desenvolvido por Nicolas Gallagher coa axuda de Jonathan Neal.
 *
 * FONTES
 * isaac-font.css ......... Importa a tipografia Isaac font.
 * Deseñada por Marcos Dopico (http://maistypes.com).
 *
 */
/*
 * Estilos do banner
 */
.banner {
  display: block;
  padding: 1em 0.5rem;
  text-align: center;
  background: var(--black-5);

  & img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: auto;
  }
}