/* ------------------------------------------------------------- 20/07/2024 - *
   Typo
 * -------------------------------------------------------------------------- */
body { 
  font-family: 'Rajdhani', sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased; /* Safari OSX, feinere Schriften */

  /* Retina Large Screens */
  @media only screen and (min-width: 980px) and (min-resolution: 192dpi) {
  //border-right: 12px solid Red;
    font-size: 110%; /* 18px */
  } /* @media */
} /* body */


a {
  color: var(--link-hex, 0,100,255);
  text-decoration: none;
  text-decoration-skip-ink: auto;
  cursor: pointer;
  transition: .3s;

  &:focus { outline: none; /* no blue line */ }  
  &:hover { 
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 2px;
    opacity: .8;
  } /* hover */

  &.-textlink { 
    text-decoration: underline;
    text-underline-offset: 2px;
    
    &:hover { }
  } /* .-textlink */
} /* a */


h1, h2, h3, h4 {
  font-weight: normal;
  line-height: 1.15;
  margin-top: 0;
} /* hx */

h1, h2 {
  smaller { font-size: 60%; } 
  small   { font-size: 50%; }
} /* hx */

#messageGroups,
#wrapperGroups {
  a[target="_blank"]:not(.-noblank):after {
    font-size: x-small;
    content: '↗︎';
    margin-left: 2px;
  } /* target */

  .-noblank a[target="_blank"]:after { content: ''; } /* target */
} /* #wrapperGroups */



/* ------------------------------------------------------------- 21/01/2024 - *
   a[href] class="fa-autoicon" - automatische Zuordnung Icons
 * -------------------------------------------------------------------------- */
.fa-autoicon {
  white-space: nowrap;

  &:before {
  //border: 1px dotted;
    display: inline-block;
    width: 1.75em;
    text-align: center;    
  } /* before */
  
  &.fa-fw:before { margin-right: .25em; }
  
  &.fa-copy:before                { font: normal 400 85%/1 'Font Awesome 6 Free';   content: '\f0c5'; /* fa-copy */ }
  &.fa-vcard:before               { font: normal 400 85%/1 'Font Awesome 6 Free';   content: '\f2bb'; /* fa-adress-card */ }
  &[href*="http"]:before          { font: normal 900 85%/1 'Font Awesome 6 Free';   content: '\f0c1'; /* fa-link */ content: '\f109'; /* fa-laptop */ }
  &[href*="mailto:"]:before       { font: normal 400 85%/1 'Font Awesome 6 Free';   content: '\f0e0'; /* fa-envelope */ }
  &[href*="tel:"]:before          { font: normal 900 85%/1 'Font Awesome 6 Free';   content: '\f2a0'; /* fa-phone-volume */ }
  &[href*="maps"]:before          { font: normal 900 85%/1 'Font Awesome 6 Free';   content: '\f3c5'; /* fa-map-marker-alt */ }
  &[href*="earth.google"]:before  { font: normal 900 85%/1 'Font Awesome 6 Free';   content: '\f7a2'; /* fa-globe-europe */ }
  &[href*="wa.me"]:before         { font: normal 900 85%/1 'Font Awesome 6 Brands'; content: '\f232'; /* fa-whatsapp */ }
  &[href*="facebook.com"]:before  { font: normal 900 85%/1 'Font Awesome 6 Brands'; content: '\f09a'; /* fa-facebook */ }
  &[href*="instagram.com"]:before { font: normal 900 85%/1 'Font Awesome 6 Brands'; content: '\f16d'; /* fa-instagram */ }
  &[href*="t.me"]:before          { font: normal 900 85%/1 'Font Awesome 6 Brands'; content: '\f2c6'; /* fa-telegram */ }
  &[href*="twitter.com"]:before   { font: normal 900 85%/1 'Font Awesome 6 Brands'; content: '\f099'; /* fa-twitter */ }
  &[href*="odysee.com"]:before    { font: normal 900 85%/1 'Font Awesome 6 Free';   content: '\f144'; /* fa-circle-play */ }
  &[href*="youtube.com"]:before   { font: normal 900 85%/1 'Font Awesome 6 Brands'; content: '\f167'; /* fa-youtube */ }
  &[href*="csv"]:before           { font: normal 900 85%/1 'Font Awesome 6 Free';   content: '\f6dd'; /* fa-file-csv */ }
  &[href*="pdf"]:before           { font: normal 400 85%/1 'Font Awesome 6 Free';   content: '\f1c1'; /* fa-file-pdf */ }
  &[href*="xls"]:before           { font: normal 400 85%/1 'Font Awesome 6 Free';   content: '\f1c3'; /* fa-file-xls */ }
  &[href*="zip"]:before           { font: normal 400 85%/1 'Font Awesome 6 Free';   content: '\f1c6'; /* fa-file-zip */ }
//&[href*="wikipedia.org"]:before { font: normal 400 85%/1 'Font Awesome 6 Brands'; content: '\f266'; /* fa-wikipedia */ }

  &[href*="wikipedia.org"] {
    &:before { display: none; }
    &:after { font: normal 900 50%/1 'Font Awesome 6 Brands'; content: '\f266'; /* fa-wikipedia */ margin-left: .25em; vertical-align: text-top; }
  } /* wikipedia */
      
  &.modal-button,
  &[data-fancybox]:not(.nofancy) { /* fa-autoicon | nofancy */
    &:before { display: none; }
    &:after { font: normal 400 60%/1 'Font Awesome 6 Free'; content: '\f2d2'; /* fa-window-restore */ margin-left: .25em; vertical-align: text-top; }    
  } /* data-fancybox */
 } /* .fa-autoicon */



/* ------------------------------------------------------------- 03/07/2024 - *
   Quote
 * -------------------------------------------------------------------------- */
blockquote {
//border: 1px dashed;
  &.-quoted {
    margin-left: 0;
    padding-top: 1.5em;

    > *:first-child { margin-top: 0; }
    > *:last-child { margin-bottom: 0; }

    /* quote Symbol */
    &:before {
      font-size: 300%;
      font-weight: 700;
      display: block;
      content: "”";
      line-height: 0;
      margin-bottom: .1em;
    } /* before */
  } /* -quoted */

  &.-marginleft   { margin-left: 1.5em; }
  &.-marginright  { margin-right: 1.5em; }
  &.-align-center { margin-left: auto; margin-right: auto; }
  &.-align-right  { margin-left: auto; }

  &.-dashed       { padding: 2.5em 1.5em 1.5em 1.5em; border: 1px dashed; }  
  &.-dashed-left  { padding-left: 1em;  border-left: 1px dashed;  border-width: 0 0 0 1px; }  
  &.-dashed-right { padding-right: 1em; border-right: 1px dashed; border-width: 0 1px 0 0; }

  cite { display: block; }
} /* blockquote */


/* ------------------------------------------------------------- 03/05/2024 - *
 Headline Style .hblock
 <b class="-hblock | -bgr-text">Headline</b>
 * -------------------------------------------------------------------------- */
.-hblock {
  display: inline-block;
  padding: .25em .75em;
               clip-path: polygon(0 0, 100% 8%, 100% 95%, 0% 100%);
  &.-reverse { clip-path: polygon(0 8%, 100% 0, 100% 100%, 0% 100%); }
} /* .-hblock */