:root {
	  --mainColor: #4F0000; /*sealBrown*/
	  --backMainColor: #F5F4F2; /*floralWhite*/
	  --backTraits: #d9c484; /*Zombie*/
	  --rojoNormal:#5e0000; /*Maroon*/
	  --rojoTitulo:#c74a1b;
	  --fondoBloques:#eae4d8;
	  --bordeBloques:#c99a89;
	  --tablaCabeza:#5e0000;
	  --tablaPar:#f5efe0;
	  --tablaImpar:#ede3c8;
	  --tablaFoot:#e6d8b0;
	  --tablaExtra:#dfce9a;
	  --encabezado2:#a86753;
	  --bordeAmarillo:#b29e74;
	  --mlowEmphasisL:rgba(0,0,0,0.49);
	  --link:#c74a1b;
	  --link2:#138953;
	  --link3:#185580;
	  --link4:#c77c1b;
	  --rarity:#98513d;
	  --rare:#002664;
	  --settlement:#004416;
	  --unique:#54166e;
	  --size:#3b7b59;
	  --nonPaizo: #787878;
	  --alignment:#576293;
	  --fondoBox:#dbd1bc;
	  --fondoSidebar:#cfc3ad;
	  --fondoResaltar2:#d0c5af;
	  --lightBlue: #d1d3d4;
	  --sizeDice:1;
	}
@font-face {
    font-family: 'SabonLTSstd';
    src: url('/fonts/SabonLTStd-Roman.woff2') format('woff2'),
         url('/fonts/SabonLTStd-Roman.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'olsentf';
    src: url('/fonts/olsentf-regular-webfont.woff2') format('woff2'),
         url('/fonts/olsentf-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'sketch_gothic_schoolregular';
    src: url('/fonts/sketch_gothic_school-webfont.woff2') format('woff2'),
         url('/fonts/sketch_gothic_school-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'wolf_in_the_cityregular';
    src: url('/fonts/wolf_in_the_city-webfont.woff2') format('woff2'),
         url('/fonts/wolf_in_the_city-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'knemabold';
    src: url('/fonts/knema-webfont.woff2') format('woff2'),
         url('/fonts/knema-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Pathfinder_Icons';
    src: url('/fonts/Pathfinder-Icons.woff2') format('woff2'),
         url('/fonts/Pathfinder-Icons.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GoodOT_CondBold';
    src: url('/fonts/GoodOT-CondBold.woff2') format('woff2'),
         url('/fonts/GoodOT-CondBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GoodOT_Bold';
    src: url('/fonts/goodot-bold-webfont.woff2') format('woff2'),
         url('/fonts/goodot-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Taroca';
    src: url('/fonts/taroca-webfont.woff2') format('woff2'),
         url('/fonts/taroca-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GoodOT';
    src: url('/fonts/goodot-webfont.woff2') format('woff2'),
         url('/fonts/goodot-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'albertus_mt';
    src: url('/fonts/albertus_mt.woff2') format('woff2'),
         url('/fonts/albertus_mt.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'moonshiner';
    src: url('/fonts/moonshiner-regular-webfont.woff2') format('woff2'),
         url('/fonts/moonshiner-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-variant: small-caps;
}
@font-face {
    font-family: 'SabonItalic';
    src: url('/fonts/SabonLTStd-Italic.woff2') format('woff2'),
         url('/fonts/SabonLTStd-Italic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-variant: small-caps;
}
a:not([href]){
	color: inherit;
	text-decoration: none;
	/*border-bottom: 1px solid blue;*/
}
a:not([href]):hover{
	color: inherit;
	/*border-bottom: none;*/
	padding-bottom: 2px;
	background-repeat: repeat;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg id='squiggle-link' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:ev='http://www.w3.org/2001/xml-events' viewBox='0 0 10 18'%3E%3Cstyle type='text/css'%3E.squiggle%7Banimation:shift .5s linear infinite;%7D@keyframes shift %7Bfrom %7Btransform:translateX(-10px);%7Dto %7Btransform:translateX(0);%7D%7D%3C/style%3E%3Cpath fill='none' stroke='rgba(0,0,0,0.25)' stroke-width='1' class='squiggle' d='M0,17.5 c 2.5,0,2.5,-1.5,5,-1.5 s 2.5,1.5,5,1.5 c 2.5,0,2.5,-1.5,5,-1.5 s 2.5,1.5,5,1.5' /%3E%3C/svg%3E");
}
  .lightMode {
    display: none !important;
  }

i.pf2:before {
	font-family: 'Pathfinder_Icons';
	font-style:normal;
	font-size:0.9em;
}
i.pf2.action1:before { content: " "; }
i.pf2.action2:before { content: " "; }
i.pf2.action3:before { content: " "; }
i.pf2.actionF:before { content: " "; }
i.pf2.Reaction:before { content: " "; }

.tooltip{
	font-size: calc(10 * var(--midaLetra) / 18);
}
*{
	 font-family: 'SabonLTSstd';
	box-sizing: border-box;
}
html {
  min-height: 100%;
  position: relative;
}
body {
  margin: 0;
  margin-bottom: 70px;
  background-color:  var(--backMainColor);
}
footer.principal{
	  position: absolute;
	  bottom: 0;
	  left:0;
	  width: 100%;
	  height: 60px;
	  color:var(--mainColor);
	  font-size: calc(1 * var(--midaLetra) / 2);
}
/*MODALS*/
h3.modal-title strong{
	font-family: 'knemabold';
}
.modal-body > ul{
	padding-left: 0;
}
#monsterParts *{
	font-family:'GoodOT';
	font-size: calc(9 * var(--midaLetra) / 16);
}
#monsterParts h4.titulo{
	font-size: calc(10 * var(--midaLetra) / 9);	
}
/*BARRA TITULO*/
h1.mainTitle{
	cursor:pointer;
}
h1.mainTitle > span{
	font-family: 'sketch_gothic_schoolregular';
	color:var(--mainColor);
	font-size:calc(1.3 * var(--midaLetra));
	/*cursor:context-menu;*/
}
h1.mainTitle > span.special{
	font-family: 'wolf_in_the_cityregular';
	color:#a23424;
	font-size:var(--midaLetra);
	margin-right: calc(1 * var(--midaLetra) / 36);
	text-shadow:  calc(1 * var(--midaLetra) / 90)  calc(1 * var(--midaLetra) / 90) 0px rgba(0,0,0,0.2);
}
/*MENU DE LINKS*/
aside.linkR{
	position: absolute;
	right:calc(1 * var(--midaLetra) / 6);
	top:calc(1 * var(--midaLetra) / 6);
}
aside.linkR nav.dropdown-menu{
	width: calc(70 * var(--midaLetra) / 9) !important;
	font-size:calc(5 * var(--midaLetra) / 6);
}
aside.linkR nav > a{
	padding:calc(2 * var(--midaLetra) / 9) calc(5 * var(--midaLetra) / 9);
}
aside.linkR span:first-child{
	font-family: 'knemabold';
	margin-right: calc(5 * var(--midaLetra) / 9);
}

/*BARRA DE BUSQUEDA*/
#text_search {
	position:relative;
	font-size:calc(7 * var(--midaLetra) / 9);
	background: white url(/img/search-duotoneL.svg) no-repeat calc(100% - 10px) center;
	background-size:  auto 50%;
}
/*RESULTADOS BUSQUEDA*/
#list-results{
	font-size:calc(11 * var(--midaLetra) / 18);
	padding-left:calc(5 * var(--midaLetra) / 18);
}
button.listado > small{
	font-family: 'GoodOT_Bold';
	text-transform: uppercase;
	color: var(--rojoTitulo);
}

#opciones{
	width: calc(100 * var(--midaLetra) / 6) !important;
	font-size:calc(5 * var(--midaLetra) / 6);
	border:0;
}
#opciones button{
	margin-left:1em;
}
/*ADVERTISEMENT*/
#ad{
	background-color: #f96854;
	color:white;
	font-size:1em;
	border-radius: 1em;
}
#ad a{
	color:#62ce7e;

}
/*RESULTADO*/
#mainContainer{
	margin-top:calc(5 * var(--midaLetra) / 9);
}
.swiper-container {
    width: 100%;
    height: 100%;
}
.swiper-wrapper{
	overflow: visible;
}
.swiper-slide{
	overflow: visible;
}
.swiper-pagination-bullet
{
	background-color:#8b1c1b;
}
.swiper-button-prev{
	position: fixed !important;
	color:#8b1c1b !important;
	background:none;
	top:50%;
}
.swiper-button-next{
	position: fixed !important;
	color:#8b1c1b !important;
	background:none;
	top:50%;
}
/*PARTE FEATURE*/
article.result {
	background-color:white;
	padding-top:15px;
	padding-right:15px;
	overflow: visible;
}
article.result *{
	font-family: 'GoodOT';
}
article.result strong{
	/*margin-right:0.2em;*/
	font-family: 'GoodOT_Bold';
}
/*PARTE CABECERA FEATURE*/
article.result  header{
	margin-bottom:0em;
	position:relative;
}
article.result  header > h1, article.result  header > h2{
	font-family: 'GoodOT_CondBold';
	font-size: calc(10 * var(--midaLetra) / 9);
	margin-bottom:0;
	padding-bottom:calc(1 * var(--midaLetra) / 18);
}
article.result header > h2{
	text-align: right;
}
article.result header button.options{
	background-color: transparent;
	outline:none;
	border:none;
}
article.result header{
	/*box-shadow: inset 0 calc(-7 * var(--midaLetra) / 36) 0 0 rgba(255,255,255,1),inset 0 calc(-8.5 * var(--midaLetra) / 36) 0 0 rgba(0,0,0,1);*/
}
article.result header + section.traits{
	box-shadow: none ;
}
/*PARTE FILA DE RASGOS*/
article.result section.traits, article.result section.traitsExtra{
	border-top:1.5px solid black;
	/*position:relative;*/
	padding-top:calc(1 * var(--midaLetra) / 18);
	margin-top:calc(-5 * var(--midaLetra) / 18) !important;
}
article.result section.traits > div, article.result section.traitsExtra > div{
	background-color: var(--backTraits);
}
article.result section.traits > div > h3, article.result section.traitsExtra > div > h3{
	font-family: 'GoodOT_CondBold';
	font-size: calc(1 * var(--midaLetra) / 2);
	background-color: var(--rojoNormal);
	color:white;
	margin:0.1em 0.15em 0.1em 0.15em;
	padding:0.2em 0.5em;
	cursor:help;
}
article.result section.traits > div > h3.rareza, article.result section.traitsExtra > div > h3.rareza{
	background-color: var(--rarity);
}
article.result section.traits > div > h3.rareza.rare, article.result section.traitsExtra > div > h3.rareza.rare{
	background-color: var(--rare);
}
article.result section.traits > div > h3.settlement, article.result section.traitsExtra > div > h3.settlement{
	background-color: var(--settlement);
}
article.result section.traits > div > h3.rareza.unique, article.result section.traitsExtra > div > h3.rareza.unique{
	background-color: var(--unique);
}
article.result section.traits > div > h3.alignment, article.result section.traitsExtra > div > h3.alignment{
	background-color: var(--alignment);
}
article.result section.traits > div > h3.tamaño, article.result section.traitsExtra > div > h3.tamaño{
	background-color: var(--size);
}
article.result section.traits > div > h3.nonPaizo, article.result section.traitsExtra > div > h3.nonPaizo{
	background-color: var(--nonPaizo);
}

/*PARTE DESCRIPCION*/

section.content > h2, section.description > h2{
	font-family: 'GoodOT_CondBold';
	font-variant: small-caps;
	font-size: calc(10 * var(--midaLetra) / 9);
	color:var(--encabezado2);
	margin-top:0.5em;
	margin-bottom:0;
}
section.description > h2{
	margin-top:0;
	margin-bottom:-0.5em;
}
section.content > h2 > em{
	font-family: 'GoodOT_CondBold' !important;
	font-style:normal !important;
}
section.content > p, section.content li{
	font-family: 'GoodOT';
	/*font-family: 'GoodOT';*/
	font-size: calc(2 * var(--midaLetra) / 3);
	text-align:justify;
}

section.content {
  border-top: none;
  display: block;
  flex-direction:column;
    justify-content: start;
    align-items: start;
    overflow-x: auto;
    -ms-overflow-style: none; /* for Internet Explorer, Edge */
    scrollbar-width: none; /* for Firefox */
}
section.content::-webkit-scrollbar {
    display: none; /* for Chrome, Safari, and Opera */
}
section.content.extra {
	border-top:1.5px solid black;
}
section.content ~ section.content {
  border-top: 1.5px solid black;
}

section.content p{
	margin:0;
	padding:0;
}
p.fancy{
	margin:0;
	padding:0;
	font-family: 'SabonItalic' !important;
	padding:0.5em 0;
	font-size:calc(3 * var(--midaLetra) / 4);
	border-bottom:1.5px solid black;
	margin-bottom: 0.5em;

}
section.description > p{
	border-bottom:none;
	padding:0.5em;
	margin:0.5em;

	font-family: 'SabonItalic' !important;

	font-size:calc(2 * var(--midaLetra) / 3);

	margin-bottom: 0.5em;
}
section.content p:not(:first-child) {
	text-indent:1em;
}

/*PARTE DE PRERREQUISITOS, ETC.*/
section.details{
	border-bottom:1.5px solid black;
	position:relative;
}
section.details.addon{
	border-bottom:none;
	border-top:1.5px solid black;
	position:relative;
	padding-top:1em;
	margin-top:1em;
}
section.details.addon *{
	font-size: calc(4 * var(--midaLetra) / 7);
}
section.details > p{
	font-family: 'GoodOT';
	font-size: calc(2 * var(--midaLetra) / 3);
	text-indent: -1em;
	margin-left: 1em;
	margin-bottom:0;
	text-align: justify;
}
section.details p:not(:first-child) {
	text-indent:-1em;
}
ul + p:not(.tab0):not(.tab5), p.tab0 + p:not(.tab0):not(.tab3):not(.tab4):not(.tab5), ol + p:not(.tab0), p.fancy + p:not(.tab0):not(.tab3) {
	text-indent:0 !important;
}

h2 + p:not(.tab0) {
	text-indent:0 !important;
}
p.tab0 {
	text-indent: -1em;
	margin-left: 1em;
}
p.tab1 {
	text-indent: 0;
}
p.tab2{
	margin-left:1em !important;
	text-indent:0em !important;
}
section.content.extra > p{
	text-indent: 0;
}
p.tab3{
	text-indent:1em !important;
	margin-left:1em !important;
}
p.tab4{
	margin-left:1em !important;
	text-indent: -1em !important;
}
p.tab5{
	text-indent:1.3em !important;
	margin-left:1.3em !important;
}
p.tab6{
	margin-left:2em !important;
	text-indent: -1em !important;
}
/*Bloques Info*/
section.content > aside.info{
	background-color: var(--fondoBloques);
	padding:0.5em 1em;
	/*display: inline-block;*/
	margin: 2em auto;
	max-width:80%;
	border-radius: 1px;
}
section.content > aside.info *{
	font-family: 'GoodOT';
	font-size: calc(2 * var(--midaLetra) / 3);
	text-align: justify;
}
section.content > aside.info > p{
	text-indent: 0;
}
section.content > aside.info > h3{
	font-family: 'GoodOT_Bold';
	text-align:center;
	margin-bottom:0;
}
section.content > aside.info.L > h3{
	text-align:left;
	text-transform: uppercase;
}
h3.subtitle{
	margin-top:-0.3em !important;
	font-family: 'GoodOT_Bold';
	font-variant: small-caps;
	font-size: calc(7 * var(--midaLetra) / 9);
	border-bottom:1px solid black;
}
/*Tables*/
	section.content table{
		/*margin-left:-9px;*/
		z-index: 5;
		margin:0.5em 0 1em 0;
		margin-left:auto;
		margin-right:auto;
	}
	article.result table *{
		font-family:'GoodOT';
	}
	article.result table > caption{
		text-transform: uppercase;
		color:black;
		 font-family: 'GoodOT_CondBold';
		 font-size: calc(8 * var(--midaLetra) / 9) !important;
		caption-side: top;
		padding-bottom:0;
		line-height:1em;
	}
	article.result table > tfoot {
		background-color:var(--tablaFoot);
		font-size: calc(9 * var(--midaLetra) / 16);
		line-height:1.5em;
	}
	article.result table > tfoot > tr > td{
		font-family: 'GoodOT' !important;
		padding-left:0.5em;
	}
	article.result table > thead > tr, article.result table > tbody > tr.header, article.result table > tbody > tr.heading {
		background-color:var(--rojoNormal) !important;
	}

	article.result table > tbody > tr:nth-child(even) {
		background-color: var(--tablaPar);
	}
	article.result table > tbody > tr:nth-child(odd) {
		background-color: var(--tablaImpar);
	}
	article.result table > tbody > tr.light {
		background-color: var(--tablaPar) !important;
	}
	article.result table > tbody > tr.dark {
		background-color: var(--tablaImpar) !important;
	}
	article.result  table > tbody > tr.even,article.result table > tbody > tr.even,article.result table > tbody > tr.even > td {
		background-color: var(--tablaPar) !important;
	}
	article.result  table > tbody > tr.odd,article.result table > tbody > tr.odd,article.result table > tbody > tr.odd > td {
		background-color: var(--tablaImpar) !important;
	}
	article.result table > tbody > tr > td {
		font-family: 'GoodOT';
		text-align:center;
		vertical-align: top;
		color:black;
		padding:0 0.4em;
		font-size: calc(9 * var(--midaLetra) / 16);
	}
	article.result table > thead > tr > th, article.result table > tbody > tr.header > td, article.result table > tbody > tr.heading > td {
		font-family: 'GoodOT_CondBold';
		color:white;
		text-align:center;
		vertical-align: bottom;
		padding:0 0.4em;
		line-height: 1.2em;
		font-size: calc(2 * var(--midaLetra) / 3);
	}
	article.result table.justo > thead > tr > th, article.result  table.justo > tbody > tr > td{
		text-align:justify;
	}
	article.result table > tbody > tr.extra {
		background-color:var(--tablaExtra);
	}
	article.result table > tbody > tr.extra >  td {
		font-family: 'GoodOT_Bold';
		font-size: calc(9 * var(--midaLetra) / 16);
	}
	article.result table > tbody > tr > td:first-child {

		text-align:left;
	}
	article.result table > thead > tr > th:first-child {
		text-align:left;
		padding:0 1.8em 0 0.4em;
	}
/*TABLE.extra*/
table.extra{
	/*margin-left:-9px;*/
	z-index: 5;
	margin:0.5em 0 1em 0;
	width:100%;
}
table.extra > caption *{
	text-transform: uppercase;
	color:black;
	 font-family: 'GoodOT_CondBold';
	 font-size: calc(8 * var(--midaLetra) / 9) !important;
	caption-side: top;
	padding-bottom:0;
	line-height:1em;
}
table.extra tr td{
	text-align: center;
	font-family: 'GoodOT';
	vertical-align: top;
	color:black;
	padding:0 0.4em;
	font-size: calc(9 * var(--midaLetra) / 16);
}
table.extra tr.title td{
	font-size: calc(2 * var(--midaLetra) / 3);
}
table.extra tr td:first-child{
	text-align:left;
	white-space:nowrap;
}
table.extra.minimo{
	width:initial !important;

}
table.extra.minimo tr td:first-child{
	white-space:normal !important;
}
table.extra.minimo tr td{
	/*white-space:nowrap !important;*/
	width:initial !important;
}
table.extra tr td:nth-child(3){
	text-align:left;
}
table.extra tr td:last-child{
	text-align:justify;
}
table.extra > tbody > tr.light {
	background-color: var(--tablaPar) !important;
}
table.extra > tbody > tr.dark {
	background-color: var(--tablaImpar) !important;
}
table.extra tr.title {
	background-color:var(--rojoNormal) !important;
}
table.extra tr.title > td{
	font-family: 'GoodOT_CondBold' !important;
	color:white;
	vertical-align: bottom !important;
	line-height: 1.2em !important;
	/*font-size: calc(2 * var(--midaLetra) / 3);*/
}
table.extra.abilities tbody{
	border-bottom:1px solid var(--rojoNormal);
}
table.extra.abilities td{
	border-right:1px solid var(--rojoNormal);
	border-left:1px solid var(--rojoNormal);
	vertical-align: middle;
}
table.extra.abilities td{
	text-align: center !important;
}
table.extra.abilities td:last-child{
	text-align: left !important;
}
table.extra.proficiencies{
	margin:0.5em auto 1em auto !important;
	/*text-align: center;*/
	width:auto !important;
	/*table-layout:fixed;*/
}
table.extra.proficiencies tbody{
	border-bottom:1px solid var(--rojoNormal);
	border-right:1px solid var(--rojoNormal);
}
table.extra.proficiencies tr.main td:first-child{
	/*width:1% !important;*/
	white-space: nowrap !important;
	text-align:left !important;
	padding-left:0.2em;
}
table.extra.proficiencies tr.main {
	border-right:1px solid var(--rojoNormal);
}
table.extra.proficiencies tr:not(.main) td:not(:last-child){
	/*width:1em !important;*/
	white-space: normal;
	text-align:center;
	border-left:1px solid var(--rojoNormal);
	border-right:1px solid var(--rojoNormal);

}
table.extra.proficiencies tr:not(.main) td:last-child{
	/*width:100% !important;*/
}
/*TABLE.important*/
	table.important{
		border:4px solid var(--bordeAmarillo) !important;
		margin:1em !important;
	}
	table.important td{
		background-color: var(--rojoNormal) !important;
		width: 50% !important;
		color:white !important;
		padding:0.5em 2.2em 1.8em 2.2em !important;
		position:relative;
	}
	table.important >tbody > tr > td:first-child:after {
	    content: ""; /* This is necessary for the pseudo element to work. */
	    position:absolute;
	    display:block;
	    top:5%;
	    right:0;
	    width:100%;
	    height: 90%;
	    border-right:3px solid var(--bordeAmarillo) !important;
	}
	table.important td:last-child{
		text-align: left!important;
	}
	table.important td  h3{
		font-family: 'GoodOT_CondBold' !important;
		font-size:calc(9 * var(--midaLetra) / 10) !important;
		margin-bottom:0;
	}
	table.important td h2 {
		font-family: 'GoodOT_CondBold' !important;
		font-size:calc(11 * var(--midaLetra) / 10) !important;
		margin-bottom:0.5em;
	}
	table.important p{
		text-indent: 0 !important;
		font-family: 'GoodOT' !important;
		font-size:calc(12 * var(--midaLetra) / 16) !important;
		line-height: 1.2em;
	}
/*TABLE SPECIAL*/
	table.special{
		z-index: 5;
		margin:0.5em 0 1em 0 !important;
	}
	table.special > tbody > tr {
		background-color: transparent !important;
	}
	table.special > tbody > tr > td {
		font-family: 'GoodOT';
		text-align:left !important;
		vertical-align: top;
		color:black;
		padding:0 0.4em;
		font-size: calc(8 * var(--midaLetra) / 8) !important;
	}
/*TABLE MODALS*/
	div.modal table{
		z-index: 5;
		margin:0.5em 0 1em 0;
	}
	div.modal  table > caption{
		text-transform: uppercase;
		color:black;
		 font-family: 'GoodOT_CondBold';
		 font-size: calc(7 * var(--midaLetra) / 9);
		caption-side: top;
		padding-bottom:0;
		line-height:1em;
	}
	div.modal  table > tfoot {
		background-color:var(--tablaFoot);
		font-size: calc(9 * var(--midaLetra) / 16);
		line-height:2em;
	}
	div.modal  table > thead > tr {
		background-color:var(--rojoNormal);
	}
	div.modal  table > thead > tr > th {
		font-family: 'GoodOT_CondBold';
		color:white;
		text-align:center;
		vertical-align: bottom;
		padding:0 0.6em;
		line-height: 1.2em;
		font-size: calc(2 * var(--midaLetra) / 3);
	}
	div.modal  table > tbody > tr:nth-child(even) {
		background-color: var(--tablaPar);
	}
	div.modal  table > tbody > tr:nth-child(odd) {
		background-color: var(--tablaImpar);
	}
	div.modal  table > tbody > tr > td {
		font-family: 'GoodOT';
		text-align:center;
		vertical-align: top;
		color:black;
		padding:0 0.6em;
		font-size: calc(9 * var(--midaLetra) / 16);
	}
/*MODALS*/
	div.modal p{
		font-family: 'GoodOT';
		font-size: calc(9 * var(--midaLetra) / 16);
		text-align: justify;
	}
article.result footer {
	border-top:2px solid var(--backMainColor);
	padding-top:0.5em;
}
article.result footer div.source{
	font-family: 'GoodOT';
	font-size: calc(1 * var(--midaLetra) / 2);
}
.popover{
    max-width: calc(20 * var(--midaLetra) );
}
.popover-header, .popover-body {
    font-size: calc(1 * var(--midaLetra) / 2);
}

article.result footer div.source a {
  /*font-size: 40px;*/
  color:var(--rojoTitulo);
  display: inline-block;
  position: relative;
  overflow: hidden;
  text-decoration: none;
}
article.result footer div.source a:after {
  content: '';
  width: 20%;
  height: 100%;
  position: absolute;
  left: auto;
  top: 0;
  bottom: 0;
  right: -20%;
  background-image: linear-gradient(135deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
}
article.result footer div.source a:hover:after {
  transition: all .4s ease-out;
  right: 100%;
}

/*LINKS GENERALES*/
a.pi{
	color:#9EA0A8;
	text-decoration: none;
}
a.pi:hover{
	color:#5f6579;
}
a.pi:active{
	color:#B2A588;
}

a.inner {
 font-family: inherit;
  background:
     linear-gradient(
       to bottom, var(--link) 0%,
       var(--link) 100%
     );
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 1.5px 1.5px;
  color: inherit;
  text-decoration: none;
  transition: background-size .2s, margin 0.1s, padding 0.1s, color .1s, border-radius 0.5s;
  margin:0;
  padding:0;
  border-radius: 0;
}

a.inner:hover {
  background-size: 4px 50px;
  color:white;
  margin:-0.1em -0.2em;
  padding:0.1em 0.2em;
  border-radius: 0.2em;
}
a.inner.spell{
  font-family: inherit;
  background:
     linear-gradient(
       to bottom, var(--link3) 0%,
       var(--link3) 100%
     );
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 1.5px 1.5px;
  color: inherit;
  text-decoration: none;
}
a.outer {
 font-family: inherit;
  background:
     linear-gradient(
       to bottom, var(--rare) 0%,
       var(--rare) 100%
     );
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 1.5px 1.5px;
  color: inherit;
  text-decoration: none;
  transition: background-size .2s, margin 0.1s, padding 0.1s, color .1s, border-radius 0.5s;
  margin:0;
  padding:0;
  border-radius: 0;
}

a.outer:hover {
  background-size: 4px 50px;
  color:white;
  margin:-0.1em -0.2em;
padding:0.1em 0.2em;
border-radius: 0.2em;
}
a.inner.spell:hover {
  background-size: 4px 50px;
  color:white;
}
a.inner.sheets{
	font-family: inherit;
  background:
     linear-gradient(
       to bottom, var(--link4) 0%,
       var(--link4) 100%
     );
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 1.5px 1.5px;
  color: var(--link4);
  text-decoration: none;
}
a.inner.sheets:hover {
  background-size: 4px 50px;
  color:white;
  margin:0;
padding:0;
border-radius: 0.2em;
}
a.inner.rule{
	font-family: inherit;
  background:
     linear-gradient(
       to bottom, #c0c0c0 0%,
       #c0c0c0 100%
     );
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 1.5px 1.5px;
  color: inherit;
  text-decoration: none;
}
a.inner.rule:hover {
  background-size: 4px 50px;
  color:white;
}
.gris a.inner{
font-family: inherit;
background:
linear-gradient(
to bottom, #ccc 0%,
#ccc 100%
);
background-position: 0 100%;
background-repeat: repeat-x;
background-size: 1.5px 1.5px;
color: inherit;
text-decoration: none;
}
.gris a.inner:hover {
background-size: 4px 50px;
color:white;
}
a.btn-inform2,a.btn-inform3 {
 font-family: inherit;
  background:linear-gradient(to bottom, var(--link2) 0%,var(--link2) 100%);
  background-position: 0 100%;
  background-repeat: repeat-x;
  background-size: 1.5px 1.5px;
  color: inherit;
  text-decoration: none;
  transition: background-size .2s, margin 0.1s, padding 0.1s, color .1s, border-radius 0.5s;
  margin:0;
  padding:0;
  border-radius: 0;
 cursor:help;
/* font-family: 'GoodOT';*/
}
a.btn-inform2:hover,a.btn-inform3:hover {
  background-size: 4px 50px;
  color:white;
  margin:-0.1em -0.2em;
  padding:0.1em 0.2em;
  border-radius: 0.2em;
  background:linear-gradient(to bottom, var(--link2) 0%,var(--link2) 100%);
  background-position: 0 100%;
  background-repeat: repeat-x;
}
a.twitter{
	text-decoration: none;
	color:#1da1f2;
}
a.twitter:hover{
	color:royalblue;
}
.red{
	color:var(--rojoNormal) !important;
}
.gris{
color:#ccc;
}
article.result strong{
	font-family: 'GoodOT_Bold' !important;
	font-weight: normal !important;
}
article.result strong > em{
	font-family: 'GoodOT_Bold' !important;
	font-weight: normal !important;
	font-style:normal !important;
}
img.logo{
	margin-left:0.5em;
	margin-bottom:0.2em;
	height:1em;
}
span.accordion-body{
	margin-left:0.5em;
	text-indent: 0;
	font-family: 'GoodOT';
	/*background-color:rgba(9,33,50,0.1); */
	color:var(--link3);

}

button.toggle-button {
  margin:0;
  padding:0;
  border:none;
  background-color:transparent;
  outline:none !important;
  font-family: 'GoodOT';
  color: var(--link3);
  position: relative;
  text-decoration: none;
  transition: color .4s ease-out;
}

button.toggle-button:hover {
  color: var(--link);
  right: 0;
  text-decoration: none;
}

button.toggle-button:hover:after {
  border-color: var(--link);
  right: 0;
}

button.toggle-button:after {
  border-radius: 1em;
  border-top: .1em solid var(--link3);
  content: "";
  position: absolute;
    right: 100%;
    bottom: .14em;
    left: 0;
  transition: right .4s cubic-bezier(0,.5,0,1),
              border-color .4s ease-out;
}

button.toggle-button:hover:after {
  animation: anchor-underline 2s cubic-bezier(0,.5,0,1) infinite;
  border-color: var(--link);
}

@keyframes anchor-underline {
  0%, 10% {
    left: 0;
    right: 100%;
  }
  40%, 60% {
    left: 0;
    right: 0;
  }
  90%, 100% {
    left: 100%;
    right: 0;
  }
}
section.details  li{
	font-family: 'GoodOT' !important;
	font-size: calc(2 * var(--midaLetra) / 3) !important;
	text-align:justify !important;
}
section.details label{
	font-family: 'GoodOT' !important;
	font-size: calc(2 * var(--midaLetra) / 3) !important;
	text-decoration: underline var(--link3) dotted;
	text-indent: 0;

}

/*MENU DE LINKS DE CRIATURA*/
nav.criaturas{
	width: calc(57 * var(--midaLetra) / 9) !important;
	font-size:calc(5 * var(--midaLetra) / 6);
}
nav.criaturas > a{
	padding:calc(2 * var(--midaLetra) / 9) calc(5 * var(--midaLetra) / 9);
}
nav.criaturas span{
	font-family: 'knemabold';
	margin-right: calc(5 * var(--midaLetra) / 9);
}
button.btn-circle{
	width: 3em !important;
	  height: 3em !important;
	  line-height: 3em !important;
	  text-align: center !important;
	  padding: 0 !important;
	  border-radius: 50% !important;
	  background-color:yellow;
}
button.btn-circle > svg{
	position: relative !important;
		top: 0.2em !important;
}
#masked-image {
    background: url(/img/grunge1.jpg) no-repeat center center;
    	background-size: cover;
    	color: #fff;
    	-webkit-text-fill-color: transparent;
    	-webkit-background-clip: text;
    	display: inline-block;
    	margin-right:0.2em;
}
#masked-image h1{
	font-family: 'GoodOT_CondBold';
	font-size: calc(10 * var(--midaLetra) / 9);
		text-align: center;
		-webkit-transition: text-shadow 1s ease;
		text-shadow: 0 0 1px rgba(0,0,0,.1);
		margin: 0;
		padding: 0;
}
#booksAccordion > div.card{
	margin-bottom:0.5em;
}
#booksAccordion > div.card > div.card-header{
	background-color: var(--fondoBloques);
	/*margin-bottom:0;*/
	padding-bottom:0;
	padding-top:0;
}
#booksAccordion > div.card > div.card-header > h2 > button > span {
	text-decoration: none;
	font-family: 'GoodOT_CondBold';
	font-size: calc(7 * var(--midaLetra) / 9);
	text-transform: uppercase;
	color:black;

}
#booksAccordion > div.card > div.collapse, #booksAccordion > div.card > div.collapse > div.card-body{
	background-color: var(--fondoBloques);
}
.popover{
    max-width: 800px; /* Max Width of the popover (depending on the container!) */
    background-color:rgba(234,228,216,0.99);
    text-align: justify;
}
.popover-header{
	background:var(--tablaCabeza) !important;
	color:white;
}
label.nolink{
	font-family: inherit !important;
	font-size: inherit !important;
	margin:0;
	padding:0;
}
.highlight{
	border-radius:0.1em;
	padding:0.5em;
	margin-left:-0.5em;
	margin-right:-0.5em;
	animation-name: pinta;
	animation-duration: 1.5s;
	animation-iteration-count: 3;
}
@keyframes pinta{
	50%{
		background-color:rgba(168,103,83, 0.9);
		color:white;
	}
}
section.caja{
	display:inline-block;
	margin:2em 2.5em 5em 2.5em;
	background-color:var(--fondoBox);
	border:3em solid orange;
	border-image:url("/img/bordes/boxBorder2.png") 290 565 290 565 repeat;
	border-width: 3em 5.85em ;
	border-image-outset:3em 3em;
	/*outline:1px dotted red;*/
	padding:0;
}
section.caja.expande{
	height:76.5%;
}
section.caja > div:first-child{

	margin-top:-3.5em;
	margin-left:-7.5em;
	margin-right:-7.5em;
}
section.caja > div:last-child{
	margin-top:0.5em;
	margin-left:-7em;
	margin-right:-7em;
	margin-bottom:-5em;
}
section.caja .card-header{
	margin-right:0;
}
section.caja .card-body{
	background-color:var(--fondoBloques);
	margin-right:0;
}
section.caja h3{
	font-family: 'GoodOT_CondBold';
	color:var(--rojoNormal);
	font-size:calc(5 * var(--midaLetra) / 6);
}
/*Rules*/
h1.titulo{
	font-family:Taroca !important;
	font-variant: small-caps;
	font-size: calc(16 * var(--midaLetra) / 9);
	color:var(--rojoNormal);
	margin-bottom:-0.3em !important;
	margin-top:1em;
	text-align:center;
}
h2.titulo{
	font-family:Taroca !important;
	font-variant: small-caps;
	font-size: calc(12 * var(--midaLetra) / 9) !important;
	color:var(--rare) !important;
	margin-top:0.5em;
	margin-bottom:0 !important;
	padding-bottom: 0 !important;

}
h3.titulo{
	font-family:GoodOT_CondBold !important;
	text-transform: uppercase;
	font-size: var(--midaLetra) !important;
	color:var(--rojoNormal);
	margin-top:0.5em;
	margin-bottom:0;
}
h4.titulo{
	font-family:moonshiner !important;
	font-variant: small-caps;
	font-size: calc(10 * var(--midaLetra) / 9);
	color:var(--encabezado2);
	margin-top:0.3em;
	margin-bottom:0;
}
header > .titulo{
	margin-top:0;
	margin-bottom:0;
}
section.content .titulo + p{
	margin:0 !important;
	padding:0 !important;
	text-indent:0 !important;
}
h5.titulo{
	font-family:GoodOT_CondBold !important;
	text-transform: uppercase;
	font-size: var(--midaLetra) !important;
	color:black;
	margin-top:0.5em;
	margin-bottom:0;
}
section.content h5.titulo + p{
	border-top: 1.5px solid black;
	padding-top:0.2em !important;
	margin-top:-0.2em !important;
}
aside.equation{
	background-color:var(--fondoBloques);
	border-top:1.5px solid var(--bordeBloques);
	border-bottom:1.5px solid var(--bordeBloques);
	padding:0.5em;
	margin:0.5em 0;
}
aside.equation >p{
	font-size: calc(2 * var(--midaLetra) / 3);
	font-family:GoodOT_Bold;
	text-align: center;
}
section.parents{
	padding-top:calc(1 * var(--midaLetra) / 18);
	margin-top:calc(-5 * var(--midaLetra) / 18);
	border-top: 1.5px solid black;
	border-bottom: 1.5px solid black;
	padding-left:0;
	margin-bottom:0.5em;
	font-family:GoodOT_Bold;
	font-size: calc(6 * var(--midaLetra) / 9) !important;
}
section.parents > a.rule{
	font-family:GoodOT_Bold;
	font-size: calc(6 * var(--midaLetra) / 9) !important;
}

/*SIDEBARS*/
h1.sidebar {
	font-family:GoodOT_Bold !important;
	text-transform: uppercase;
	font-size: calc(var(--midaLetra) * 8 / 9) !important;
	text-align: center;
	margin-bottom:0;
}
h2.sidebar{
	font-family:GoodOT_Bold !important;
	font-size: calc(8 * var(--midaLetra) / 9) !important;
	text-align: center;
	margin-bottom:0;
	margin-top:0.5em;
}
h1.sidebar + p{
	margin:0 !important;
	padding:0 !important;
	text-indent:0 !important;
}
aside.sidebar p{
	font-family: GoodOT;
	font-size:calc(2 * var(--midaLetra) / 3);
	text-align: justify;
}
aside.sidebar{
	display:inline-block;
	margin:2em 2.5em 5em 2.5em;
	margin-left:3.5em !important;
	margin-bottom:3em !important;
	/*margin-top:3em !important;*/
	background-color:var(--fondoBox);
	border:3em solid orange;
	border-image:url("/img/bordes/boxBorder2.png") 290 565 290 565 repeat;
	border-width: 3em 5.85em ;
	border-image-outset:3em 3em;
	/*outline:1px dotted red;*/
	padding:0;
	z-index:30;
}
aside.sidebar > div:first-child{
	margin-top:-4.7em;
	margin-left:-7.2em;
	margin-right:-7.2em;
	margin-bottom:-5em;
}
aside.sidebar.full > div:first-child{
	margin-right:-14.4em;
}
aside.sidebar div.body{
	max-width:calc(var(--midaLetra) * 16.1);
	/*background-color: var(--fondoSidebar);*/
	/*border:1px solid red;*/
}
aside.sidebar.full div.body{
	max-width:calc(100% + 14.4em);
}
aside.full div.body{
	min-width:calc(100%) !important;
}
aside.sidebar.full{
	margin-top:3em !important;
	width:calc(100% - 6.8em) !important;
}
aside.sidebar ul{
	padding-left:1em !important;
	margin-bottom:0 !important;
	/*margin-left:-2em;*/
}
aside.sidebar ul li{
	font-family: 'GoodOT' !important;
	font-size: calc(2 * var(--midaLetra) / 3) !important;
	text-align:justify !important;
}

aside.resaltar{
	background-color: var(--rojoNormal);
	margin:3.5em 2.5em 5em 2.5em;
	margin-left:3.5em !important;
	margin-bottom:3.5em !important;
	border:3em solid orange;
	border-image:url("/img/bordes/boxBorder4.png") 290 565 290 565 repeat;
	border-width: 3em 5.85em ;
	border-image-outset:3em 3em;
	padding:0 !important;
	position:relative;
	clear:both;
}
aside.resaltar::after{
	content: "";
	background-image:url("/img/bordes/top-Border2.png");
	background-position: top center; /* Center the image */
		background-repeat: no-repeat;
		background-size:10em;
	position:absolute;
	top:-5.98em;
	left:0;
	width:100%;
	height:10vh;
	z-index:10000000;
}
aside.resaltar > div.contenido{
	margin-top:-4.3em;
	margin-left:-6.2em;
	margin-right:-6.2em;
	margin-bottom:-4.5em;
}
aside.resaltar > div.contenido *{
	font-family: 'GoodOT';
	color:white !important;
	font-size: calc(2 * var(--midaLetra) / 3);
	text-align:justify;
}
aside.resaltar > div.contenido> h3.titulo{
	text-align:center;
}
aside.resaltar > div.contenido> h4.titulo{
	font-size: calc(9 * var(--midaLetra) / 10);
	text-align:center;
}
aside.resaltar > div.contenido > .titulo{
	font-family:GoodOT_Bold !important;
}

aside.resaltar2{
	background-color: var(--fondoResaltar2);
	margin:3.5em 2.5em 5em 2.5em;
	margin-left:3.5em !important;
	margin-bottom:3.5em !important;
	border:3em solid orange;
	border-image:url("/img/bordes/boxBorder5.png") 290 565 290 565 repeat;
	border-width: 3em 5.85em ;
	border-image-outset:3em 3em;
	padding:0 !important;
	position:relative;
	clear:both;
}
aside.resaltar2::after{
	content: "";
	background-image:url("/img/bordes/top-Border3.png");
	background-position: top center; /* Center the image */
		background-repeat: no-repeat;
		background-size:10em;
	position:absolute;
	top:-5.98em;
	left:0;
	width:100%;
	height:10vh;
	z-index:10000000;
}
aside.resaltar2 > div.contenido{
	margin-top:-4.3em;
	margin-left:-6.2em;
	margin-right:-6.2em;
	margin-bottom:-4.5em;
}
aside.resaltar2 > div.contenido *{
	font-family: 'GoodOT';
	/*color:black;*/
	font-size: calc(2 * var(--midaLetra) / 3);
	text-align:justify;
}
aside.resaltar2 > div.contenido> h3.titulo{
	text-align:center;
	color:black;
	font-size: calc(8 * var(--midaLetra) / 9) !important;
	font-family: 'GoodOT_Bold';
}
aside.resaltar2 > div.contenido> h4.titulo{
	font-size: calc(9 * var(--midaLetra) / 10);
	text-align:center;
}
aside.resaltar2 > div.contenido > .titulo{
	font-family:GoodOT_Bold !important;
}
aside.resaltar2 > div.contenido > table{
	width:calc(100% + 2em);
	margin-left:-1em;
	margin-top:2em;
	/*padding-right:-5em;*/
}
aside.resaltar2 > div.contenido > table > caption {
		text-transform: uppercase;
		color:black;
		 font-family: 'GoodOT_CondBold';
		 font-size: calc(8 * var(--midaLetra) / 9) !important;
		caption-side: top;
		padding-bottom:0;
		padding-left:1em;
		line-height:1em;
}

sup{
	font-family: inherit;
}
div.important{
	border:4px solid var(--bordeAmarillo) !important;
	background-color: var(--rojoNormal) !important;
	min-width: 50% !important;
	max-width:80% !important;
	color:white !important;
	padding:1em 2.2em 0.5em 2.2em !important;
	margin: 0.5em auto;
}
div.important *{
	text-transform: capitalize;
	font-family: GoodOT_CondBold !important;
	text-align: center;
	font-size:calc(13 * var(--midaLetra) / 10) !important;
}
p.fancy.rule{
	border:none;
	border-bottom:2px solid #6a1313;
	position:relative !important;
	margin-bottom:1.5em;
	color:var(--rojoNormal);
	padding-bottom:15px;
}
p.fancy.rule.noborder{
	border-bottom:none;
	margin-bottom:0;
	padding-bottom:0;
}
p.fancy.rule:not(.noborder)::after {
    position:absolute;
    content:"";
    height:40px;
    width:100%; /* or i.e: 500px */
    background:url(/img/fancy2.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 30px;
    bottom:-26px;
    left:0;
}
p.fancy.rule:not(.noborder) + p {
	margin-top:1em;
}

aside.inCard{
	margin:1em 0;
	padding:0;
}
aside.inCard > header{
	border-bottom:1px solid black;
}
aside.inCard > header > h1, aside.inCard > header > h2{
	font-size: calc(6.5 * var(--midaLetra) / 9);
	padding-bottom: 0;
	margin-bottom:-5px;
}
aside.inCard > section * {
	font-family: 'GoodOT';
}
aside.inCard > section, aside.inCard > section.content.extra {
	border-width: 1px;
}
aside.inCard > section.details{
	/*padding-left: 2em;*/
}
aside.inCard > section.traits{
	border-top: none;
	position:relative;
	padding-top:calc(1 * var(--midaLetra) / 18);
	margin-top:0;
	margin-bottom:calc(4 * var(--midaLetra) / 18);
	top:calc(4 * var(--midaLetra) / 18);
}

section.traitsExtra + section.details p:not(:first-child) {
	text-indent:-1em;
	margin-left:1em;
}
aside.inCard > section.traits + section.details p:not(:first-child) {
	text-indent:0;
	margin-left:0;
}
section.traitsExtra + section.details p:first-child{
	margin-left:1em;
}
aside.inCard > section.traits + section.details p:first-child {
	/*margin-left:0;*/
}
/*diceRoller*/
#diceRoller{
	border-radius: 0.5em 0 0 0.5em;
	padding:0.2em 0.5em;
	padding-right:0;
	background-color:var(--mainColor);
	position:fixed;
	top:calc(100% - calc(0.1 * var(--midaLetra) * var(--sizeDice) / 1) - 4em) ;
	height:calc(0.1 * var(--midaLetra) * var(--sizeDice) / 1 + 3em);
	width:calc(16 * var(--midaLetra) * var(--sizeDice) / 1);
	z-index: 100000000;
	overflow: hidden;
}
#diceRoller *{
	font-family:GoodOT;
}
#diceRoller > footer {
	background-color:var(--mainColor);
	margin-bottom:calc(0.05 * var(--midaLetra) * var(--sizeDice) / 1) ;
	z-index:2000;
}
#diceRoller.oculto{
	right:calc(-16 * var(--midaLetra) * var(--sizeDice) / 1 + 3em);
	transition: top 0.2s,
				height 0.2s,
				right 0.2s 0.05s;
}
#diceRoller.noOculto{
	right:0;
	top:calc(100% - calc(10 * var(--midaLetra) * var(--sizeDice) / 1) - 4em);
	height:calc(10.1 * var(--midaLetra) * var(--sizeDice) / 1 + 3em);/*calc(13 * var(--midaLetra) / 1);*/
	transition: right 0.2s,
				top 0.3s 0.05s,
				height 0.3s 0.05s;
}
#diceRoller > header{
	position:absolute;
	color:white;
	height:calc(0.7 * var(--midaLetra) * var(--sizeDice) / 1 + 0.7em);
	margin:0;
	padding:0;
}
#diceRoller > header > h2{
	font-family:knemabold;
	font-size:calc(0.8 * var(--midaLetra) * var(--sizeDice) / 1);
	margin:0;
	padding:0;
}
#diceRoller.oculto > header{
	top:calc(-2 * var(--midaLetra) * var(--sizeDice) / 1);
	transition: top 0.05s;
}
#diceRoller.noOculto > header{
	top:0;
	transition: top 0.3s 0.05s;
}
#diceRoller ul{
	position:absolute;
	height:calc(100% - 1 * var(--midaLetra) * var(--sizeDice) / 1 - 3.1em);/*calc(10.1 * var(--midaLetra) / 1) !important;*/
	width:calc(15.6 * var(--midaLetra) * var(--sizeDice) / 1) ;
	top:calc(1 * var(--midaLetra) * var(--sizeDice) / 1);
	left:calc(0.2 * var(--midaLetra) * var(--sizeDice) / 1) ;
	border-radius:0.2em;
	background-color:transparent;
	overflow-y: auto !important;
	display: flex;
	flex-direction: column;
}
#diceRoller.oculto  ul{
	opacity:0;
	transition: opacity 0.05s;
	z-index:1999;
}
#diceRoller.noOculto  ul{
	opacity:1;
	transition: opacity 0.4s 0.05s;
}
#diceRoller  ul > li {
	background-color:var(--fondoBloques);
	padding:calc(0.1 * var(--midaLetra) * var(--sizeDice) / 1) calc(0.2 * var(--midaLetra) * var(--sizeDice) / 1);
	margin: 0;
	margin-top:1px;
	color:black;
	border-radius: 0.1em;
}
#relleno{
	height:calc(100% - 1 * var(--midaLetra) * var(--sizeDice) / 1);
	background-color:transparent !important;
}
#dice, #clearHistory, #resizeDiceRoller{
	color:white;
	padding:0;
	border:0;
	background-color: transparent;
	margin:0;
	transition: color 0.3s ease-in-out;
}
#clearHistory{
	margin-right:1em;
	transition: color 0.3s ease-in-out;
}
#resizeDiceRoller{
	margin-right:1em;
	transition: color 0.3s ease-in-out;
}
#dice:hover{
	color:var(--rarity);
}
#clearHistory:hover, #resizeDiceRoller:hover{
	color:var(--rarity);
}
#dice_text{
	transition: all 0.30s ease-in-out;
}
#dice_text:focus{
  box-shadow: 0 0 5px rgba(199, 74, 27, 1);
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid rgba(199, 74, 27, 1);

}
.crit{
	font-family:inherit;
	color:var(--link2);
}
.fail{
	font-family:inherit;
	color:var(--link);
}
.gris2{
	color:#aaa;
}
a.roll, a.roll2{
	cursor:url(/img/cursorRoll3.png), auto;
	font-family:inherit;
	font-size:inherit;
}
em.etiqueta1{
	font-family:GoodOT_CondBold;
	color:var(--rojoNormal);
	margin-left:-0.1em;

}
.tooltip-inner em.etiqueta1{
	color:white;
	margin-left:-0.1em;
	margin-right:0.2em;
}
.tooltip-inner {
    max-width: 450px;

}
li.creature{
	color:white !important;
	font-family:knemabold !important;
	background-color:transparent !important;
	padding-bottom:0 !important;
	padding-top:0 !important;
	padding-left:0  !important;
	margin-bottom:-0.2em !important;
	margin-top:0.2em !important;
}
button.copiar{
	background-color:transparent;
	border:0;
	padding:0;
	margin:0;
	display:none;
	color:var(--rojoNormal);
}
li.tirada:hover button.copiar{
	display:flex;
}
span.spoiler{
	text-transform: uppercase;
	font-family:olsentf;
	background-color:var(--rojoNormal);
	color:white;
}
span.nonPaizo{
	text-transform: uppercase;
	font-family:olsentf;
	background-color:var(--nonPaizo);
	color:white;
}
span.rare{
	text-transform: uppercase;
	font-family:olsentf;
	background-color:var(--rare);
	color:white;
	font-size:0.75em;
}
span.uncommon{
	text-transform: uppercase;
	font-family:olsentf;
	background-color:var(--rarity);
	color:white;
}
table.transparent *{
	background-color:transparent !important;
	font-family: GoodOt;
	font-size: calc(2 * var(--midaLetra) / 3) !important;
}
table.transparent strong{
	font-family:GoodOt_Bold;
}
table.transparent tr > td:first-child{
	padding-right:0;
	padding-left:0;
}

#DC1to2,#GP1to2 {
	background-color:var(--fondoSidebar);
	margin:1em;
	border-radius: 0.3em;
	/*box-shadow: 0px 2px 3px 1px rgba(0,0,0,0.33);*/
}
#GP1to2{
	padding:0.3em 0;
}
#DC1to2 *, #GP1to2 * {
	font-size:calc(2 * var(--midaLetra) / 3);
}
#DC1to2 label, #GP1to2 label{
	font-family: GoodOT_Bold;
	/*color:var(--lowEmphasis);*/
}
#DC1to2 label.resultado{
	/*color:var(--mhighEmphasis);	*/
	height:100%;
	color:rgba(0,0,0,0.6);
	font-size:3em;
	font-family: GoodOT_Bold;
}
#Lvl_formN, #DC_formN{
	height:100%;
	color:rgba(0,0,0,0.6);
	font-size:2.7em;
	font-family: GoodOT_Bold;
	text-align: center;
	background-color:rgba(255,255,255,0.5);
	border-radius:0.1em;
	width:1.3em;
	margin-left:0.2em;
}
#DC2eX_form{
	/*color:var(--mhighEmphasis) !important;*/
}
#DC2e_form{
	color:black !important;
	/*color:var(--highEmphasis) !important;	*/
}
label.destaca_form{
	color:var(--rojoTitulo) !important;
}
input.coins{
	width:5em;
	margin-right:1em;
	border-radius:0.3em;
	margin-left:0.2em;
}
#coins2_form{
	font-size:1.5em;
	color:var(--rojoTitulo);
}
@media (hover: hover){
	/* For no mobile phones*/
.nomobil{
  	display:flex !important;
  }
  .mobil{
  	display:none !important;
  }
}
label.custom-control-label.ancestry{
	font-family:GoodOT_Bold;
}
.custom-radio .custom-control-label::before {
    background-color: rgba(255,255,255,0.3);  /* orange */
}
.custom-radio .custom-control-input:checked~.custom-control-label::before,
.custom-radio .custom-control-input:checked~.custom-control-label::after {
    background-color: var(--rojoTitulo);  /* green */
    /* this bg image SVG is just a white circle, you can replace it with any valid SVG code */
    /*background-image: url(data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E); */
    border-radius: 50%;
}
/* active state i.e. displayed while the mouse is being pressed down */
.custom-radio .custom-control-input:active ~ .custom-control-label::before {
    color: var(--rojoTitulo);
    background-color: var(--rojoNormal); /* red */
}

/* the shadow; displayed while the element is in focus */
.custom-radio .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 1px var(--rojoNormal), 0 0 0 0.2rem rgba(94, 0, 0, 0.25); /* pink, 25% opacity */
}
small.PwL{
	margin-left:0.5em;
	font-family:albertus_mt;
	font-size:0.7em;
	color:var(--rojoTitulo);
	position: relative;
	bottom:0.1em;
}
.custom-switch .custom-control-label::before, .custom-switch .custom-control-label::after  {
	margin-left:calc(9 * var(--midaLetra) / 18);
	margin-top:calc(6 * var(--midaLetra) / 18);
	font-size:calc(8 * var(--midaLetra) / 18);
}
.custom-switch span{
	margin-left:calc(9 * var(--midaLetra) / 18);
}
.custom-switch del{
	font-family: inherit;
}
.custom-switch .custom-control-input ~ .custom-control-label{
	color:var(--mlowEmphasisL);
}
.custom-switch .custom-control-input:checked ~ .custom-control-label{
	color:black;
}
a + label.nolink{
	margin-left:-0.8em !important;
}
sup.source{
	padding-left:calc(1em / 8) ;
	padding-top:0.5em;
	font-weight: 500;
	color:var(--mlowEmphasisL);
	font-size:0.8em !important;
}
@media (hover: none) {
  /* For mobile phones: */
  .nomobil{
  	display:none !important;
  }
  .mobil{
  	display:flex !important;
  }
}
@media print {
	a {
		background:none !important;
	}
	a.roll, a.roll:link, a.roll2, a.roll2:link{
		border-bottom: none !important;
		text-decoration: none !important;
	}
	.no-print{
		display:none !important;
	}
	article.result{
		padding:0 !important;
		margin:0 !important;
	}
	#mainContainer{
		padding:0 !important;
		margin:0 !important;
	}
	div.swiper-wrapper{
		height:100% !important;
		width:100% !important;
	}
	div.swiper-slide-active{
		padding:0 !important;
		margin:0 !important;
		height:100% !important;
		width:100% !important;
	}
	article.result > footer, div.swiper-pagination, button.close.borrar{
		display:none !important;
	}
	div.container-fluid{
		padding:0 !important;
		margin:0 !important;
	}
	body {
		background-color: transparent !important;
		padding:0 !important;
		margin:0 !important;
	}
	bdi{
		font-family: inherit;
		font-size: inherit;
	}

}
aside.skillActions{
	border-bottom: 1px solid black;
	border-top: 1px solid black;
	font-size:calc(5 * var(--midaLetra) / 8);
	padding-left:0em;
	padding-bottom: 0.2em;
	background-color: var(--tablaPar);
	margin: 0.1em 0.4em;
	padding: 0 0.8em;
}
aside.skillActions *{
	color:rgba(0,0,0,0.79);
    font-family: 'GoodOT';
}
aside.skillActions h4{
	font-family:'GoodOT_Bold';
	font-size:calc(var(--midaLetra) * 7 / 9);
	color: white;
	background-color:var(--tablaCabeza);
	text-transform: uppercase;
	padding: 0.1em 0.4em;
	margin: 0 -0.65em;
}
aside.skillActions h4 *{
	color: white;
}
aside.skillActions > p{
	text-align:justify;
	text-indent:-1em !important;
    margin-left:1em;
	margin-bottom: 0;
}
aside.skillActions span.accordion-body{
	margin-left:0;
	color:rgba(0,0,0,0.79);
}
button.skillActions{
    font-family:'olsentf';
    background-color:transparent;
	border:1px solid white;
	border-radius:0.2em;
	padding: 0 ;
	margin-left:0;
	margin-right:0;
	color:maroon;
}
#btn_closeSkills,#btn_closeSkills:active,#btn_closeSkills:focus,#btn_closeSkills:hover{
	background-color: transparent;
	border: none;
	text-decoration: none;
	padding: 0;
	margin: 0;
	outline: 0;
    font-size:0.7em;
}
aside.skillActions span.accordion-body > p{
    text-indent:1em;
    margin-bottom:0;
}
aside.skillActions span.accordion-body > p > strong:first-child{
    margin-left:-1em;
}


table.tablesorter *{
font-family:'GoodOT';
}
table.tablesorter > caption{
text-transform: uppercase;
color:black !important;
font-family: 'GoodOT_CondBold';
font-size: 2em;
caption-side: top;
padding-bottom:0;
line-height:1em;
}
table.tablesorter > tfoot {
background-color:var(--tablaFoot);	
font-size: calc(9 * var(--midaLetra) / 16);
line-height:1.5em;
}
table.tablesorter > tfoot > tr > td{
font-family: 'GoodOT' !important;
padding-left:0.5em;
}
table.tablesorter > thead > tr, table.tablesorter > tbody > tr.header, table.tablesorter > tbody > tr.heading {
background-color:var(--rojoNormal) !important;
}
table.tablesorter > thead > tr:nth-child(1) > th{
	position:sticky;
	top:0;
	background-color:var(--rojoNormal) !important;
	z-index:50;
}
table.tablesorter > thead > tr:nth-child(2) > td {
	position:sticky; 
	top:32px; 
	z-index:51;
	background-color:var(--rojoNormal) !important;
	border-top:none;
}
table.tablesorter > tbody > tr:nth-child(even) {
background-color: var(--tablaPar);
}
table.tablesorter > tbody > tr:nth-child(odd) {
background-color: var(--tablaImpar);
}
table.tablesorter > tbody > tr.even {
background-color: var(--tablaPar);
}
table.tablesorter > tbody > tr.odd {
background-color: var(--tablaImpar);
}
table.tablesorter > tbody > tr > td {
font-family: 'GoodOT';
text-align:center;
vertical-align: top;
color:black;
padding:0 0.4em;
font-size: 1em;
}
table.tablesorter > thead > tr > th, table.tablesorter > tbody > tr.header > td, table.tablesorter > tbody > tr.heading > td {
font-family: 'GoodOT_CondBold' !important;
background-color:transparent !important;
color:white;
text-align:left;
vertical-align: bottom;
padding:0 0.4em;
line-height: 1.2em;
font-size: 1.2em;
}
table.tablesorter > tbody > tr.extra {
background-color:var(--tablaExtra);
}
table.tablesorter > tbody > tr.extra >  td {
font-family: 'GoodOT_Bold';
font-size: 1em;
}
.filterHead{
font-family:GoodOT;
padding-left:0.5em !important;
margin-top:-0.5em !important;
font-size:1.2em;
color:green var(--rojoNormal);
}

.text {
font-family:knemabold;
font-size:2em;
color: var(--rojoNormal);
display: inline-block;
margin-left: 5px;
}

.bounceball {
position: relative;
display: inline-block;
height: 37px;
width: 15px;
}
.bounceball:before {
position: absolute;
content: '';
display: block;
top: 0;
width: 15px;
height: 15px;
border-radius: 50%;
background-color: var(--rojoNormal);
-webkit-transform-origin: 50%;
transform-origin: 50%;
-webkit-animation: bounce 500ms alternate infinite ease;
animation: bounce 500ms alternate infinite ease;
}

@-webkit-keyframes bounce {
0% {
top: 30px;
height: 5px;
border-radius: 60px 60px 20px 20px;
-webkit-transform: scaleX(2);
transform: scaleX(2);
}
35% {
height: 15px;
border-radius: 50%;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
100% {
top: 0;
}
}

@keyframes bounce {
0% {
top: 30px;
height: 5px;
border-radius: 60px 60px 20px 20px;
-webkit-transform: scaleX(2);
transform: scaleX(2);
}
35% {
height: 15px;
border-radius: 50%;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
100% {
top: 0;
}
}
table.centered *{
	text-align: center !important;
}

#FSRange::-webkit-slider-thumb, .custom-range.DC1to2::-webkit-slider-thumb{
	background:var(--rojoTitulo);
}
#CSRange::-webkit-slider-thumb{
	background:var(--rare);
}
.badge-danger{
	background-color:var(--backTraits);
	color:maroon;
}