.text{
    width: 100%;
    height: 100%;
    position: relative;

    --textAlign: center;
    --textVertical: center;
    --textHorizontal: center;
    --textSize:1rem;

    --textWidth: auto;
    --textFont: var(--fontText);

    --textBackground: none;
    --textColor: var(--colorFore);
    --textPadding: 0;    
    --textInterline: inherit;
    --textSpacing: inherit;
    --textBorderTop: inherit;
    --textBorderLeft: inherit;
    --textBorderRight: inherit;
    --textBorderBottom: inherit;
    --textRadius: 0; 
    --textShadow: none;   
    --textBlend: none;   
    --textClamp: 0;
}


.promise{
  visibility: hidden;
}

.inner{
    position: relative;
    width: 100%;
    height: 100%;
}

.pretext{
    display: flex;
    width: 100%;
    height: 100%;
    align-items: var(--textVertical);
    justify-content: var(--textHorizontal);
}

.textbox{
    text-align: var(--textAlign);
    /*overflow: hidden; */ /* removed for shadow, maybe neccessary */
    font-size: var(--textSize);
    font-family: var(--textFont);

    --backmark: var(--colorAccent);
    --foremark: var(--colorBack);
    --textaccentcolor: var(--colorAccent);
    width: var(--textWidth);
}

.itext{
    padding: var(--textPadding);

    background: var(--textBackground);
    color: var(--textColor);
    line-height: var(--textInterline);
    letter-spacing: var(--textSpacing);

    border-top: var(--textBorderTop);
    border-left: var(--textBorderLeft);
    border-right: var(--textBorderRight);
    border-bottom: var(--textBorderBottom);
    border-radius: var(--textRadius);
    
    box-shadow: var(--textShadow);
    mix-blend-mode: var(--textBlend);
}

.itext img{
    object-fit: contain;
    height: 4em;
    vertical-align: middle;
}


.itext mark {
  background-color: var(--backmark);
  color: var(--foremark);
  padding: .5rem .5rem;
  /* display: inline-block; */
}
.itext high {
  color: var(--textaccentcolor);
}
.itext bord {
  border: 8px solid var(--backmark);
  padding: 0 0.5rem;
}
.itext a {
  color: var(--textaccentcolor);
  text-decoration: underline;
}
.itext btn{
  background-color: var(--colorFore);
  color: var(--colorBack);
  padding: 1rem 2rem;
  display: inline-block;
  border-radius: 12px;
  overflow: hidden;
}

.itext blockquote {
  font-size: 2em;
  font-weight: 400;
  font-style: italic;
  font-family: var(--fontAlt);
}

.itext h1,
.itext h2,
.itext h3,
.itext h4,
.itext h5,
.itext h6,
.itext p,
.itext ul,
.itext blockquote {
  margin: 0;
}

.itext h1 strong,
.itext h2 strong,
.itext h3 strong,
.itext h4 strong,
.itext h5 strong,
.itext h6 strong,
.itext h1 b,
.itext h2 b,
.itext h3 b,
.itext h4 b,
.itext h5 b,
.itext h6 b {
  color: var(--textaccentcolor);
}

.itext > ul,
.itext > ol {
  /* font-size: 1.5em;
  line-height: 1.1em; */
}
.itext ul,
.itext ol { 
  text-align: left;
  margin: 0;
  padding: 0;
  list-style-type: none;
  counter-reset: li;
  padding: 0.5em 0;
}

.itext li{
  padding: 0.25rem 0;
  list-style-position:inside;
  margin-bottom: 2px;
  padding: .25em;
  padding-left: 0.8em;
}
.itext ul li::before {
  content: "–"; 
  display: inline-block; 
  width: 0.8em;
  margin-left: -0.8em;
}
.itext ol li::before {
  counter-increment: li;  
  content:  "." counter(li); 
  display: inline-block; 
  width: 1.1em; 
  margin-left: -1.3em;
  margin-right: 0.2em; 
  text-align: right; 
  direction: rtl;
}

.itext li p{
  display: inline;
}


.itext pre, .itext code{
  text-align: left;
  margin: 0;
}


.itext h1,
.itext h2,
.itext h3,
.itext h4,
.itext h5,
.itext h6 {
  font-family: var(--fontHead);
  padding: .5rem 0;
}

.itext h1{
  font-size: 2em;
}
.itext h2{
  font-size: 1.5em;
}
.itext h3{
  font-size: 1.17em;
}
.itext h4{
  font-size: 1em;
}
.itext h5{
  font-size: 0.83em;
}
.itext h6{
  font-size: 0.67em;
}

.itext p{
  padding: .5rem 0;
}
.itext p:first-child{
  padding-top: 0;
}
.itext p:last-child{
  padding-bottom: 0;
}


.itext hr{
  border: 1px solid var(--colorFore);
  margin: .5rem 0;
}

.itext h1:first-child,
.itext h2:first-child,
.itext h3:first-child,
.itext h1:last-child,
.itext h2:last-child,
.itext h3:last-child{
    padding: 0;
}

.itext table{
    width: 100%;
}
.itext tr{
    padding: 0;
}

.itext td, .itext th{
    padding:.5rem;
    border-bottom:1px solid var(--colorFore);
}

.itext small{
  font-size: .6em;
}




/* INLINE STYLES */
.marked span{
  background: var(--textAccent);
  color: var(--textColor);
}
.uppercase span{
  text-transform: uppercase;
}
.underline span{
  text-decoration: underline;
  text-decoration-color: var(--textColor);
}

.clamp{
  overflow: hidden;
  -webkit-line-clamp: var(--textClamp);
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
