/* =====================================

Main stylesheet
Default Theme

This is where you will put all the styles for your site.
Please see the theme's README.md for information on how to override bootstrap if needed.

======================================== */

/* Include a google font for headers */
@import url(https://fonts.googleapis.com/css?family=Rokkitt:700);

/* Set background, to be overridden for other sections */
body {
    background-color:#fff;
    background-image: url("../images/seamless_paper_texture.png");
}

.main_content {
    background-color:#f7f6f2;
}

/* ==========
Header
=========== */

.site_header {
    background-image: url("../images/seamless_paper_texture.png");
}

.header_navbar {
    background-color: RGBA(0,0,0,.7);
}

.header_navbar .nav-item .nav-link {
    text-decoration:none;
    color: #fff;
}

.navbar-dark .nav-item .nav-link.active,
.header_navbar .nav-item .nav-link:hover,
.header_navbar .nav-item .nav-link:focus {
    color: #fff;
    text-decoration: underline;
    background-color: RGBA(0,0,0,.85);
}

/* Making Bootstrap navbar toggler icon white */

.header_navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.header_navbar .navbar-toggler {
    border:1px solid RGBA(0,0,0,.85);
}

.site_title {
    font-family: 'Rokkitt', serif;
    font-weight:700;
    text-align:center;
    margin:10px;
    color:RGBA(0,0,0,.6);
    text-shadow: 1px 4px 6px #E1DFD7, 0 0 0 #000, 1px 4px 6px #E1DFD7; /* fancy inner shadow */
    line-height: 1em;
}

/* ==========
Footer
=========== */

#footer {
    background-image: url("../images/seamless_paper_texture.png");
    padding:20px 0 90px 0;
    border-top: solid 1px #43423f;
    margin-top: 0px
}

/* ==============
Basic HTML
============== */

h1, h2, h3, h4, h5, h6 {
    font-family: 'Rokkitt', serif;
    font-weight:700;
    line-height:1em;
    color: #D14536;
}

h1 {
    font-size: 3.5em;
}

h2 {
    font-size: 3em;
}

h3 {
    font-size: 2.5em;
}

h4 {
    font-size: 2em;
}

h5 {
    font-size: 1.5em;
}

h6 {
    font-size: 1.3em;
}

a:not(.btn) {
    color: #296FB9;
    text-decoration: underline;
}

.pagination li a,
.pagination li.disabled a:hover {
    text-decoration: none;
}

.pagination li a:hover {
    text-decoration: underline;
}

a:visited:not(.btn):not(.pagination .active .page-link):not(.navbar .nav-link) {
    color: #865EB8;
}

a:hover:not(.btn):not(.page-link) {
    color: #D14536;
}

#newspaper_nav .nav-pills .nav-link:hover {
    color: #D14536;
    background-color: #eee;
    text-decoration: none; 
}

/* Fix for calendar page, newer bigger base font makes calendars wrap */
.calendar_wrapper {
    font-size: 14px;
}

/* Accessibility tweak to improve Bootstrap's default contrast */
.help-block {
    color: #333;
}

/* =============
Breakpoints (Based on bootstrap defaults)
============== */

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    body {
        font-size: 16px;
    } /* Make font bigger when screens are bigger */

    .site_title {
        font-size: 7em;
    } /* Make font bigger when screens are bigger */
}

/* =============
Forms (to account for changes in base styles from Bootstrap 3 to Bootstrap 5)
============== */

label {
    font-weight: bold;
}

legend {
    padding-top: 2rem;
    padding-bottom: 0.25rem;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 1em;
}
