/* _content/website/Pages/Shared/_Layout.cshtml.rz.scp.css */
/* this file is rendered 2nd in the head of the page after site.css as website.styles.css */

.navbar[b-qu0comy00z]{
  /*height:65px;*/
}
.navbar-toggler[b-qu0comy00z]{
  border-color: var(--color-dark-purple);
  height: 2em; /* 1.5em for the original bootstrap height of navbar-toggler-icon + .25 for top padding + .25 for bottom padding*/
}
    .navbar-toggler:hover[b-qu0comy00z],.navbar-toggler:focus[b-qu0comy00z],.navbar-toggler:active[b-qu0comy00z]{
        box-shadow:var(--box-shadow-purple);
    }


/*---------------*/
/* styles to create the hamburger menu image without using an SVG */
.navbar-toggler-icon[b-qu0comy00z]{
  position: relative;
  top:-3px; /* fixes where the vertical alignment is a bit off */
  height:3px; /* this object is just the middle line. We'll use a ::before/::after for the top & bottom lines */
  border:0;
  border-radius: 10px;  
  background: var(--color-purple); /* also gets rid of bootstrap's hamburger svg*/
  transition: 0.3s;
}
  .navbar-toggler-icon[b-qu0comy00z]::before, .navbar-toggler-icon[b-qu0comy00z]::after{
    content: "";
    position: absolute;
    left:0; /* keeps the top & bottom lines aligned with the middle line. Otherwise, they're both indented to the right a bit. */
    width:1.5em;
    height:3px;
    border-radius: 10px;
    background: var(--color-purple);
    transition: 0.3s;
  }
  .navbar-toggler-icon[b-qu0comy00z]::before{top:-8px;}
  .navbar-toggler-icon[b-qu0comy00z]::after{top:8px;}

/*---------------*/
/* styles to turn the hamburger menu into an X when it's expanded */
.navbar-toggler:not(.collapsed) > span[b-qu0comy00z] {
  background: transparent; /*hides the middle line*/
}
  .navbar-toggler:not(.collapsed) > span[b-qu0comy00z]::before,.navbar-toggler:not(.collapsed) > span[b-qu0comy00z]::after {
    top:0;
    height:4px;
  }
  .navbar-toggler:not(.collapsed) > span[b-qu0comy00z]::before { transform: rotate(-45deg); }
  .navbar-toggler:not(.collapsed) > span[b-qu0comy00z]::after { transform: rotate(45deg); }
/*---------------*/


@media (min-width: 768px) { /* when on a destop/tablet device */
  .navbar[b-qu0comy00z]{height:65px;}
}


.btn[b-qu0comy00z]{
  padding:.375rem .75rem .45rem .75rem; /* text wasn't vertically centered in the nav bar buttons (changed it from .375rem (top/bottom) .75rem (left/right)) */
}

.btn-primary[b-qu0comy00z] {
  color: #fff;
  background-color: var(--color-purple);
  border:none;
  border-radius: 20px;
}
  /* focus is when the button is clicked or tabbed onto. There's usually an extra border visible to show the selection which is what box-shadow does. */  
  .btn-primary:hover[b-qu0comy00z],.btn-primary:focus[b-qu0comy00z],.btn-primary:active[b-qu0comy00z]{
    color:white;
    background-color: var(--color-purple-hover);
    border:none;
    box-shadow: var(--box-shadow-purple);
  }

.btn-outline-secondary[b-qu0comy00z]{
  color:var(--color-purple);
  border-color: var(--color-dark-purple);
  border-radius: 20px;
}
  .btn-outline-secondary:hover[b-qu0comy00z],.btn-outline-secondary:focus[b-qu0comy00z],.btn-outline-secondary:active[b-qu0comy00z]{
    color:white;
    background-color: var(--color-purple-hover);
    border:1px solid transparent; /*can't go with 'none' because the switch from a border to none causes the button to jump around when moused over/out. */
    box-shadow: var(--box-shadow-purple);
  }

  .btn-SDA-text[b-qu0comy00z]{
    color:black;
    border:1px solid transparent;
    border-radius:20px;
  }
  .btn-SDA-text:hover[b-qu0comy00z],.btn-SDA-text:focus[b-qu0comy00z],.btn-SDA-text:active[b-qu0comy00z]{
    background-color: rgba(120, 0, 206, 0.1);
  }
  .btn-SDA-text:focus[b-qu0comy00z]{
    box-shadow: var(--box-shadow-purple);
  }

  /* have the text move a bit when moused over/clicked or tabbed on */
  .btn-primary:hover > span[b-qu0comy00z],.btn-primary:focus > span[b-qu0comy00z],.btn-primary:active > span[b-qu0comy00z],
  .btn-outline-secondary:hover > span[b-qu0comy00z],.btn-outline-secondary:focus > span[b-qu0comy00z],.btn-outline-secondary:active > span[b-qu0comy00z],
  .btn-SDA-text:hover > span[b-qu0comy00z],.btn-SDA-text:focus > span[b-qu0comy00z],.btn-SDA-text:active > span[b-qu0comy00z] {
    position: relative;
    top:1px;
    left:1px;
  }


.NoAccountLabel[b-qu0comy00z]{
  display:flex;
  align-self:center;
}


/* Below are styles for the nav bar */
.border-bottom[b-qu0comy00z] {
  border-bottom: 1px solid #e5e5e5;
}
.box-shadow[b-qu0comy00z] {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}
/*-------------*/

/* Below are styles for the bottom section with the copyright info */
.border-top[b-qu0comy00z] {
  border-top: 1px solid #e5e5e5;
}

.social-icon[b-qu0comy00z]{
    text-decoration:none;
    margin-right:8px;
}
/*button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}*/
.footer[b-qu0comy00z] {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 40px;
}
/*-------------*/