/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@400;700&family=Raleway:wght@400;700&display=swap');

body { padding-top: 56px; }
.left-aligned { margin-left: auto; }
.bg-dark { background-color: #d84388 !important;}
.bg-hero { background-color: #290315; }
.bg-light { background-color: #f7d5e0}
.my-element{ background-color:#290315; }

/* CALLOUT */
.bd-callout { padding:1.25rem; margin-top:1.25rem; margin-bottom:1.25rem; border:1px solid #e9ecef; border-left-width:.25rem; border-radius:.25rem }
.bd-callout h4 { margin-bottom: 1.25rem }
.bd-callout p:last-child { margin-bottom:0 }
.bd-callout code { border-radius:.25rem }
.bd-callout+.bd-callout { margin-top:-.25rem }
.bd-callout-info { border-left-color:#398459 }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }

/* footer */
footer a { color: rgb(244, 182, 182); font-weight: bold; text-decoration: none; }
footer a:hover { color: rgb(244, 182, 182); text-decoration: underline; }


/* Add global font? */

/* Set CSS variables for easy font management */
:root {
    --base-header-font: 'Comfortaa', cursive;
    --base-body-font: 'Raleway', sans-serif;
}

/* Body background */
body {
    background-color: #8cd589;
}

/* Headings */
h1 {
    font-family: var(--base-header-font);
    color: #86cf83;
    font-size: 64px;
    text-align: center;
}

h2 { font-family: var(--base-header-font);
    color: #ebabce;
    font-size: 40px;
    border-radius: 10px;
    text-align: center;
}

h3 { font-family: var(--base-header-font);
    color: #ebabce;
    font-size: 30 px;
    border-radius: 20px;
    text-align: center;}

/* for member page */
h4 { font-family: var(--base-header-font);
    color: #ffd5e9;
    font-size: 30 px;
    border-radius: 10px;
    text-align: center;
}

header{
    background-color: #290315;
    background-image: url("")
}

/*images*/
img {
    margin: 0;
    padding: 0;
}

/* Paragraphs */
p {
    font-family: var(--base-body-font);
    color: #290315;
    font-size: 20px;
    text-align: justify;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}

/* Paragraph class */
.paragraph {
    font-family: var(--base-body-font);
    color: #ebabce;
    font-size: 20px;
    justify-self: right;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    width: 550px;
}

/* Tables */
table {
    font-family: var(--base-body-font);
    color: #ffffff;
    font-size: 20px;
}

/* Lists */
ul {
    font-family: var(--base-body-font);
    color: #ffffff;
    font-size: 20px;
    text-align: justify;
    padding-left: 40px;
    padding-right: 20px;
    padding-top: 20px;
}

/* APA sources */
.apasource {
    padding-left: 66px;
    padding-right: 40px;
    text-indent: -26px;
    margin-block: 5px;
    overflow-wrap: anywhere;
    font-family: var(--base-body-font);
    color: #f4a9a9;
    font-size: 20px;
}




/*sketchy stuff*/

.navbar-brand .navbar-logo {
    height: 100px;
    position: absolute;
    top: -15px;
    left: 0px;
    z-index: 1;
}


div.scroll-container {
    background-color: #fff0f5;
    overflow: auto;
    white-space: nowrap;
    padding: 5px;
  }
  
  div.scroll-container img {
    padding: 10px;
    height: 200px;
  }