/*NAVBAR*/
nav {margin-bottom: 15vmin;}
nav.bg-gradient-custom {background: rgb(31,86,116); background: linear-gradient(90deg, rgba(31,86,116,1) 0%, rgba(169,95,128,1) 50%, rgba(210,122,100,1) 100%);}

/*CONTAINERS*/
.container-fixed-width {max-width: 800px; margin: 0 auto;}
.container-wide {max-width: 1200px; margin: 0 auto;}
.container-w80 {width: 80%; margin: 0 auto;}

/*COLOURS*/
.bg-blue {background-color: #1f5674;}
.bg-pink {background-color: #a95f80;}
.bg-orange {background-color: #d27a64;}
.bg-tan {background-color: rgba(219,218,200,.3);}
.color-blue {color: #1f5674;}
.color-pink {color: #a95f80;}
.color-orange {color: #d27a64;}
.fourohfour h1.bg-gradient-custom {background: rgb(31,86,116);background: linear-gradient(90deg, rgba(31,86,116,1) 0%, rgba(169,95,128,1) 50%, rgba(210,122,100,1) 100%);width: fit-content;}

/*TYPEFACES*/
p.serif {font-family: Georgia, 'Times New Roman', Times, serif; line-height: 2.5rem; text-justify: inter-word;}
p.sans-serif {font-family: Arial, Helvetica, sans-serif !important;}
.sans-serif {font-family: Arial, Helvetica, sans-serif !important;}
span.opacity-50 {opacity: 0.8;}
section.content-markdown p.caption-text {font-family: Arial, Helvetica, sans-serif !important; font-size: 0.8rem !important;text-transform: uppercase;padding: 0;margin-top: -18px;line-height: 1rem !important;}
code {color: #d27a64; font-size: 1rem; background-color: #eee; padding: 2px;}
.page-item.active .page-link {border-color:#d27a64; background-color: #d27a64 !important;}
.page-link {color:#d27a64;}

/*TYPEFACES INSIDE MARKDOWN*/
section.content-markdown h3 {font-weight: 700; padding-top: 3vmin;}
section.content-markdown p strong {font-weight: 700;}
section.content-markdown p {font-family: Georgia, Times, Serif !important;font-size: 1.3rem !important;font-weight: 100;color: #5e5e5e;line-height: 2.1rem !important; padding: 0.2rem 0;}
section.content-markdown p a {text-decoration: none;}
section.content-markdown blockquote {font-style: italic !important;line-height: 2.3rem !important;padding-left: 30px;width: 90%;margin: 2rem auto;right: 0.5rem;}
section.content-markdown ul li, section.content-markdown ol li {font-family: Georgia, Times, Serif !important;font-size: 1.3rem !important;font-weight: 100;color: #5e5e5e;line-height: 2.5rem !important;padding: 0.2rem 0;}
section.content-markdown ol li a {color: #d27a64; text-decoration: none;}
section.content-markdown ul li strong, section.content-markdown ol li strong {font-weight: 700;}
section.content-films blockquote {border-left: 3px solid #1f5674;}
section.content-comics blockquote {border-left: 3px solid #a95f80;}
section.content-newsletter blockquote {border-left: 3px solid #d27a64;}
section.content-markdown h4 {text-align: center;font-size: 2rem;font-weight: 100;width: 90%;margin: 2rem auto;}
section.content-markdown h3 a {color: #d27a64; text-decoration: none;}
section.content-markdown h4 a {color: #d27a64; text-decoration: none;}
section.footnotes ol li p {font-family: Arial, Helvetica, sans-serif !important; font-size: 1rem !important; line-height: 1.5rem !important;}
.fig-caption {font-family: Sans-serif;text-transform: uppercase;font-size: 1rem !important;}

/*TYPEFACES FOR HEADERS*/
header.intro h3 {text-align: center; padding-bottom: 1rem; font-size: 1.75rem; font-weight: 500;}
header.intro p {font-size: 1.25rem; padding-bottom: 3rem; line-height: 2.5rem; font-family: Georgia, Times, Serif; text-justify: inter-word;}
header.intro p a {background-color: #1f5674; text-decoration: none; color: #fff; padding: 4px; border-radius: .25rem !important;}
header.newsletter-intro p a {background-color: #d27a64;}

/*HIGHLIGHTED TYPEFACES - DIFFERENT COLOURS FOR EACH SECTION*/
.content-films mark { background-color: #a5d4ec;}
.content-comics mark { background-color: #e9c6d6;}
.content-newsletter mark { background-color: #eec4b9;}
.index-films mark {background-color: #1f5674;}
.index-films mark a {color: #fff;}
.index-tags mark {background-color: #d27a64;color: #fff;}

/*COLOURS FOR LINKS*/
section.content-films p a {color: #1f5674;}
section.content-comics p a {color: #a95f80;}
section.content-newsletter p a {color: #d27a64;}
section.content-default p a {color: #a95f80;}

/*THE POSTCARDS ON INDEX PAGES*/
.postcard h3 a {text-decoration: none; color:#333; font-size: 1.5rem; font-weight: 600;}
.postcard p {font-family: Georgia, 'Times New Roman', Times, serif; color: #666;}

/*NEWSLETTER INDEX*/
img.newsletter-index {max-height: 600px;}
.postcard-newsletter {width: 100%;height: 100%;display: flex;justify-content: space-between;align-items: start;flex-direction: column;}

/*FILMS ARCHIVE*/
.archive ul {padding-left: 0rem !important; margin-bottom: 3vmin;}
.archive ul li {list-style: none; line-height: 1.8em; font-weight: 100;}
.archive ul li a {text-decoration: none; color: #1f5674;}
.archive ul li a:hover {font-weight: 300;}
.archive h5 {font-size: small; text-transform: uppercase; background-color: #1f5674; color: #fff; padding: 4px; margin-bottom: 3vmin; width:fit-content;}

/*BUTTONS*/
.home-button, .button {width: fit-content;}
.content-markdown .button {width: fit-content; margin: 1rem auto;}
.content-markdown .button p {font-family: Arial, Helvetica, sans-serif !important; font-weight: 600; margin-bottom: 0;}

/*PHOTOGRIDS*/
.photogrid {
  width: 100vw; /* Full viewport width */
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw; /* Center the grid by adjusting margins */
  margin-right: -50vw;
  margin-top: 30px;
  margin-bottom: 30px;}

  .photogrid .row > .col-12 {padding: 10px;}

/*MOBILE*/
@media only screen and (max-width: 768){
    .container-sm {max-width: 1000px !important;} 
    .container-w80 {width: 100%; margin: 0 auto;}
}

@media only screen and (max-width: 576px){
    .container-w80 {width: 100%; margin: 0 auto; text-justify: newspaper;}
}