:root {
  --dark: #1f1f24;
  --purple: #c2c2ff;
  --body-bg: hsl(0, 0%, 13%);
}
:root {
  --font-family: system-ui;

  --fs-300: clamp(0.94rem, calc(0.92rem + 0.08vw), 0.98rem);
  --fs-400: clamp(1.13rem, calc(1.06rem + 0.33vw), 1.31rem);
  --fs-500: clamp(1.35rem, calc(1.21rem + 0.69vw), 1.75rem);
  --fs-600: clamp(1.62rem, calc(1.37rem + 1.24vw), 2.33rem);
  --fs-700: clamp(1.94rem, calc(1.54rem + 2.03vw), 3.11rem);
  --fs-800: clamp(2.33rem, calc(1.7rem + 3.15vw), 4.14rem);
  --fs-900: clamp(2.8rem, calc(1.85rem + 4.74vw), 5.52rem);

  --clr-primary-300: hsl(219, 76%, 55%);
  --clr-primary-400: hsl(219, 76%, 40%);
  --clr-primary-500: hsl(219, 76%, 25%);
  --clr-secondary-300: hsl(269, 75%, 55%);
  --clr-secondary-400: hsl(269, 75%, 40%);
  --clr-secondary-500: hsl(269, 75%, 25%);
  --clr-accent-300: hsl(358, 72%, 65%);
  --clr-accent-400: hsl(358, 72%, 50%);
  --clr-accent-500: hsl(358, 72%, 35%);

  --clr-1: #052b2f;
  --clr-2: #073438;
  --clr-3: #0e4b50;
  --clr-4: #2d8f85;
  --clr-5: #637c54;
  --clr-6: #0036d0;
}
*,
*::after,
*::before {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
   padding: 0;
    margin: 0;
}

html{
 position: relative;
  /* cursor: none;*/
  height: 100%;
  width: 100%;
  /*background: var(--dark);*/
  color-scheme: dark light;
  margin: 0 auto;
  padding: 0.5rem;
 /*background: hsl(209, 50%, 18.75%);*/
}

body {
position: relative;
color-scheme: dark light;
padding: 0.1rem;
background: #f5c1fd;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; 
font-size: 1.125rem;
line-height: 1.5;
margin: 0 auto;
color:white;
/*max-width:600px;*/
}

.downgap {
position: inherit;
padding-top:13rem;

}

.teal-blu {
    color: #00e0de!important;
}
@font-face {
    font-family: 'Roselyn';

 src: url('../assets/fonts/Roselyn');
    src: url('../assets/fonts/Roselyn.woff') format('woff');
      font-weight: 900;
      font-style: normal;
}
@font-face {
    font-family: 'Abuela';

 src: url('../assets/fonts/Abuela');
    src: url('../assets/fonts/Abuela.woff') format('woff');
      font-weight: 600;
      font-style: normal;
}
@font-face {
    font-family: 'Stars';

 src: url('../assets/fonts/Stars');
    src: url('../assets/fonts/Stars.woff') format('woff');
      font-weight: 900;
      font-style: normal;
}
.happy-text{
  border: 0.8em #183743;
  border-style: double;
  margin: 3em 0;
  padding: 1em;
  color:black;
  background:transparent;
  background: linear-gradient(60deg, pink, #00fffd, #ffd700, #00fffd, pink);
  font: 900 1em sans-serif;
  text-decoration: none;
}

.border-box {
  background-clip: border-box;
}
.padding-box {
  background-clip: padding-box;
}
.content-box {
  background-clip: content-box;
}

.applefont { 
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
color:white; 
font-size: 1.125rem;
font-weight: 600;
line-height: 1;
margin: 3rem auto;
}

.stars { 
font-family: Stars, sans-serif;
color:white; 
font-size: 1.125rem;
font-weight: 600;
line-height: 1;
margin: 3rem auto;
}

h1 { font-family: 'Roselyn', serif; 
font-size: 4.75rem;
line-height: 1.5; 
 

}
h2 { font-family: 'Abuela', serif; 

font-size: 1.5rem;
line-height: 1.5; }

h3 { font-family: 'Roselyn', serif; 
font-size: 2.5rem;
font-weight:900;
line-height: 1.5; 
}

h3 { font-family: 'Roselyn', serif; 
color:seagreen;

}

.slidetext{ font-family: 'Abuela', serif; 
color:black;
font-size: 1rem;
line-height: 1.5; 
font-weight:900;
}
.biotext { 
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
color:white; 
font-size: 1.125rem;
font-weight: 600;
line-height: 1.1;
margin: 3rem auto;
}
.tinytext { 
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
color:white; 
font-size: 0.8rem;

line-height: 1.3;
margin: 3rem auto;
}
.white-glowz {
    text-shadow: 
    2px 2px 10px blue, 
    14px 14px 0px black, 
    16px 16px 30px pink;
}
  
.black-glowz {
    text-shadow: 
    8px 0px 42px black,
    -8px 0px 42px white,
      0px 0px 43px transparent,
      0px 0px 44px transparent,
      0px 0px 45px teal;
}
  
.white-glow2 {
    text-shadow: 
   
    -8px 0px 42px white;
    }
  .bbasic-shadow {

text-shadow: 0px 0px -1px #333;

  }
  /* Default box-shadow */
.boxy-shadow {
  box-shadow: 0 3px 3px rgba(0,0,0,0.2);
}

/* Create smoother box-shadows by layering multiple
 * shadows with gradually increasing radius and offset */
.shadow-5 {
  box-shadow: 0 1px 1px rgba(0,0,0,0.12), 
              0 2px 2px rgba(0,0,0,0.12), 
              0 4px 4px rgba(0,0,0,0.12), 
              0 8px 8px rgba(0,0,0,0.12),
              0 16px 16px rgba(0,0,0,0.12);
}
.fairytext {
  text-shadow: 0 1px 1px rgba(0,0,0,0.12), 
              0 2px 2px rgba(0,0,0,0.12), 
              0 4px 4px rgba(0,0,0,0.12), 
              0 8px 8px rgba(0,0,0,0.12),
              0 16px 16px rgba(0,0,0,0.12);
}

hr.basiclove {
   position:relative;
  --size: 2px;
margin: 0 auto;
z-index: -1;
  border: 0;
  height: var(--size);
  background: white;
  border-radius: 50rem;
  box-shadow: 0 4px 0 var(--clr-accent-400), 0 8px 0 var(--clr-secondary-400),
    0 12px 0 var(--clr-primary-400);
}
hr.onelove{

  position:relative;
    --size: 10px;
margin: 0 auto;
    border:0;
    border-radius:100vw;
z-index: 1;
    height: var(--size);
    background: teal;
    box-shadow: 
    /*0 8px 0 blue,
    0 8px 0  violet,
    0 12px 0  purple,*/
    0 calc(var(--size) * 2) 0 blue,
    0 calc(var(--size) * 4) 0  violet,
    0 calc(var(--size) * 6) 0  purple;
}
/*button {
  background-color: #5100a6;
  color: #fff;
  &:hover {
    background-color: #d1abf3;
    color: #fff;
}
}*/

.tertiary {
 background:rgba(33, 37, 41, 0.5);

}
table, td {
    border:2px solid #000000 !important;
}
/*# sourceMappingURL=bootstrap.min.css.map */
.modal-sheet .modal-dialog {
  width: 380px;
  transition: bottom .75s ease-in-out;
}
.modal-sheet .modal-footer {
  padding-bottom: 2rem;
}
img.sep {
  filter: none;
}
img.sep:hover,
img.sep:focus {
  filter: sepia(100%);
}
img.glare {
  filter: none;
}
img.glare:hover,
img.glare:focus {
  filter: invert(100%);
}

.filtertee {
  filter: invert(100%);
}


.capz {
  color: #304ffe;
  

}
.capz:hover {
  text-decoration: none;
}
.no-lines {
  text-decoration: none;
}


.capz {
  font-size: 5rem;
 font-family: 'Roselyn', serif;
  width: 80%;
  max-width: 35em;
  margin: 1em auto;
  background-image: url("../assets/img/mandala2.art.2023-260x260.gif");
  background-size: cover;
  background-position: center;
  background-clip: text;
  color: transparent;
   text-shadow: 0 1px 1px rgba(0,0,0,0.12), 
              0 2px 2px rgba(0,0,0,0.12), 
              0 4px 4px rgba(0,0,0,0.12), 
              0 8px 8px rgba(0,0,0,0.12),
              0 16px 16px rgba(0,0,0,0.12);
}

.capz::first-letter {
  -webkit-initial-letter: 3 2;
  initial-letter: 3 2;
 
  color: #c69c6d;
  margin: 1em.5em 0 0;
  font-weight: bold;

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}