html {
  margin: 0;
  padding: 0;
}

* {
  margin: 0;
  padding: 0;  
  box-sizing: border-box;
}

body {
  font-family: 'Roboto', sans-serif;


  /* ChatGPT Suggested Colour Scheme */
  --strong-yellow:#F39C12; /* strong yellow */
  --mid-yellow:#F4D03F; /* mid yellow */
  --pale-yellow:#FFF9C4; /* pale yellow */

  --strong-purple:#4B0082; /* strong purple */
  --mid-purple:#9B59B6; /* mid purple */
  --pale-purple:#D6BBFC; /* pale purple*/


  /* ChatGPT Tweaked Colour Scheme */
  --strong-yellow:#D4A017; /* strong yellow */
  --mid-yellow:#F4D03F; /* mid yellow */
  --pale-yellow:#FFF176; /* pale yellow */

  --strong-purple:#3A0068; /* strong purple */
  --mid-purple:#7A5CC4; /* mid purple */
  --pale-purple:#C4B7F2; /* pale purple*/


  /* Main Colour Scheme */
  --strong-yellow:#e9f436; /* strong yellow */
  --mid-yellow:#f1f880; /* mid yellow */
  --pale-yellow:#f4fa9d; /* pale yellow */

  --strong-purple:#212258; /* strong purple */
  --mid-purple:#373893; /* mid purple */
  --pale-purple:#8788be; /* pale purple*/


  --main-background-color:#373893; /* mid purple */
  --main-text-color:#f1f880; /* yellow */
  --paler-text-color:#f4fa9d; /* paler yellow */ /* alternative option fafbd1 */
  --content-box-background-color:#212258; /* dark purple */
  --content-box-outline-color:#8788be; /* light purple */
  --menu-bar-background-color:#a3a4d6; /* even lighter purple */
  --cta-button-color:#e9f436;
  --cta-text-color:#212258; /* dark purple */


  background-color: var(--main-background-color);
  color: var(--pale-yellow);
  max-width:1280px;
  margin-right:auto; 
  margin-left:auto; 
  padding: 0px;
  line-height: 1.5em;  
}


.banner {
  text-align: center;
  padding-top: 10px;
  padding-bottom: 0px;
  margin: 0 auto;
}

.responsive_banner {
  display: block;
  max-width: 100%;
  height: auto;
  justify-self: center;
  text-align: center;
  margin: 0 auto;
}

.responsive_img_tile {
  display: inline-block;
  max-width: 100%;
  height: auto;
  justify-self: center;
  text-align: center;
  margin: 0 auto;
  border-radius:10px;
  box-shadow: 0x 4px 6px -1px rgba(244, 250, 157, 0.33);
  transition:all 0.25s;
}


.zoomable_image {
  overflow:hidden;
}

.council_logo {
  display: inline;
  max-height:45px;
  width:auto;
  margin:5px 5px;
  justify-self:justify;
  box-shadow: 4px 4px 2px rgba(0,0,0,0.5);
}


.school_logo {
  display:block;
  max-width:60px;
  border-radius:50%;
  border-color:var(--strong-purple);
  border-style:solid;
  border-width:1px;
  height: auto;
  justify-self: center;
  text-align: center;
  margin: 0 auto;
  box-shadow: 4px 4px 2px rgba(0,0,0,0.5);
}

.centre_item {
  display: block;
  text-align: center;
}

ul {
  margin:0;
  padding-left: 1.2em;">
}

.emphasise {
  font-size:1.15em;
  font-style:italic;
  font-weight:bold;
}

/*******************************************************************/
/*                           'H' Styling                           */
/*******************************************************************/

h1, h2, h4 {
  text-wrap:balance;
  /*
  margin:0;
  padding:0;
  */
  
}

h1 {
  font-size:2.25em;
  margin-top:0.67em;
  margin-bottom:0.67em;
  line-height:normal;  
  color: var(--strong-yellow);
}

h2 {
  font-size:1.5em;
  margin-top:0.83em;
  margin-bottom:0.83em;
  color: var(--mid-yellow);
}

.hero_h1 {
  font-size:2.25em;
  line-height:1.2em;
  margin: 0.75em 0;
  color: var(--strong-yellow);
}

.hero_h2 {
  font-size:1.5rem;
  line-height:1.2em;
  margin: 0.5em 0;
  color: var(--mid-yellow);
}

.first_paragraph {
  font-size:1.3em;
  margin-bottom:1.5em;
}

.about_the_show {
  color: var(--pale-yellow);
}

.highlight {
  font-weight:bold;
  color:var(--mid-yellow);
}

.no_decoration {
  text-decoration:none;
}

@media only screen and (max-width: 480px) {
  .hero_h1 {
    font-size:1.5rem;
  }
  .hero_h2 {
    font-size:1.125rem;
  }
}

/*******************************************************************/
/*                           'P' Styling                           */
/*******************************************************************/

p {
  margin-bottom:1em;  
  text-wrap:pretty;
/*  max-width:65ch;  */
}


.shows_page_body_text {
  color: var(--paler-text-color);
}

.testimonials_page_more_testimonials_text {
  display: block;
  text-align: center;
  color: var(--content-box-outline-color);
}

.FAQ_Question {
  color: var(--main-text-color);
  font-weight: bold;  
}

.FAQ_Answer {
  color: var(--paler-text-color);
}

.bold {
  font-weight: bold;
}

/*******************************************************************/
/*                        Navigation Styling                       */
/*******************************************************************/

nav {
  width: 95%;
  height: 30px;
  margin: auto;
  box-sizing:border-box;
  background-color: var(--menu-bar-background-color);
}

nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: 30px;
  box-sizing:border-box;
}

nav li {
  float: left;
  width:20%;
  min-height: 30px;
  position: relative;
  text-align: center;
  box-sizing:border-box;
}

nav li ul li {
  float: none;
  width: 400px;
  margin-left: 0px;
  text-align: left;
  padding-left: 5px;
  padding-top: 7px;
  background-color:rgba(33,34,88,0.85);
  border-color:#8788be;
  border-style:solid;
  border-width:0px 3px 3px 3px;
/*  border-radius:10px; */
  box-sizing:border-box;
}

nav li ul {
  position: absolute;
  top: 30px;
  box-sizing:border-box;
  visibility: hidden;
}

nav li:hover ul {
  visibility: visible;
}

nav a {
  text-decoration: none;
  color: #f1f880;
  font-weight: bold;
  font-size: 20px;
}

nav a:hover {
  color:#8788be;
}

label {
  margin: 0 0 0 5px;
  font-weight: bold;
  font-size: 20px;
  line-height: 30px;
  display: none;  
}

#toggle {
  display: none;
}

@media only screen and (max-width: 768px) {
  label {
    display: block;
    cursor: pointer;  
  }

  #toggle:checked + .main_menu, .sub_menu {
    display: block;
  }

  nav ul {
    border-color:#8788be;
    border-style:solid;
    border-width:3px 3px 3px 3px;
    box-sizing:border-box;
    display: none;
  }

  nav li {
    float: none;
    width: 200px;
    height: 40px;
    line_height: 40px;
    margin-left: 0px;
    text-align: left;
    padding-left: 5px;
    background-color:rgba(33,34,88,0.85);
    border-color:#8788be;
    border-style:solid;
    border-width:0px 3px 3px 3px;
    box-sizing:border-box;
  }

  nav li ul li {
    float: none;
    width: 400px;
    margin: 0px;
    text-align: left;
/*    padding-left: 5px; */
/*    padding-top: 7px; */
    background-color:rgba(33,34,88,0.85);
    border-color:#8788be;
    border-style:solid;
    border-width:0px 3px 3px 3px;
/*  border-radius:10px; */
    box-sizing:border-box;
  }

  nav li ul {
    position: absolute;
    top: 0;
    left: 100%;
    visibility: hidden;
  }

}

/*******************************************************************/
/*                        Content Box Styling                      */
/*******************************************************************/

.content {
  min-height:600px;
  background-color: var(--content-box-background-color);
  border-color: var(--content-box-outline-color);
  border-style:solid;
  border-width:3px;
  border-radius:10px;
/*  padding:20px 15px; */
}
					  
.content a {
  color: var(--main-text-color);
}

.content a:hover {
  color: var(--content-box-outline-color);
}

.full_width_text {
  width:100%
  margin:auto;
  text-align:left;
}

/*******************************************************************/
/*                      Main Sections Styling                      */
/*******************************************************************/

.hero_section {
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--strong-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:20px;
  padding-bottom:0px;
  padding-left:15px;
  padding-right:15px;
}

.about_section {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--mid-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:100px;
  padding-bottom:125px;
  padding-left:15px;
  padding-right:15px;
}

.shows_section {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--strong-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:0px;
  padding-bottom:175px;
  padding-left:15px;
  padding-right:15px;
}

.testimonial_section {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--mid-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:20px;
  padding-bottom:150px;
  padding-left:15px;
  padding-right:15px;
}

.call_to_action_section {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--strong-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:0px;
  padding-bottom:50px;
  padding-left:15px;
  padding-right:15px;
}


@media only screen and (max-width: 768px) {

  .about_section {
    padding-top:25px;
    padding-bottom:100px;
  }

  .shows_section {
    padding-bottom:75px;
  }

  .testimonial_section {
    padding-bottom:125px;
  }

}

@media only screen and (max-width: 480px) {

.hero_section {
  padding-bottom:25px;
}

  .about_section {
    padding-top:0px;
    padding-bottom:50px;
  }

  .testimonial_section {
    padding-bottom:75px;
  }

  .call_to_action_section {
    padding-top:0px;
  }

}

/*******************************************************************/
/*             Individual Shows Page Sections Styling              */
/*******************************************************************/

.also_interested_in {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--strong-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:0px;
  padding-bottom:50px;
  padding-left:15px;
  padding-right:15px;
}

/*******************************************************************/
/*          Genral Testimonials Page Sections Styling             */
/*******************************************************************/

.general_testimonials_council_section {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--mid-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:125px;
  padding-bottom:175px;
  padding-left:15px;
  padding-right:15px;
}

.general_testimonials_schools_section {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--strong-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:0px;
  padding-bottom:175px;
  padding-left:15px;
  padding-right:15px;
}


@media only screen and (max-width: 768px) {

  .general_testimonials_council_section {
    padding-top:100px;
    padding-bottom:125px;
  }
}

@media only screen and (max-width: 480px) {

  .general_testimonials_council_section {
    padding-top:75px;
    padding-bottom:100px;
  }
}


/*******************************************************************/
/*          Council Testimonials Page Sections Styling             */
/*******************************************************************/

.council_testimonial_section {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  background-color:var(--mid-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:125px;
  padding-bottom:175px;
  padding-left:15px;
  padding-right:15px;
}


@media only screen and (max-width: 768px) {

  .council_testimonial_section {
    padding-top:100px;
    padding-bottom:125px;
  }
}

@media only screen and (max-width: 480px) {

  .council_testimonial_section {
    padding-top:75px;
    padding-bottom:100px;
  }
}



/*******************************************************************/
/*                 Downloads Page Sections Styling                 */
/*******************************************************************/

.introduction_section {
  position:relative;
  display:grid;
  background-color:var(--mid-purple);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:150px;
  padding-bottom:150px;
  padding-left:15px;
  padding-right:15px;
}

.introduction_section p {
  max-width:85ch;
  margin:0 auto;
}

.download_section {
  position:relative;
  background-color:var(--strong-purple);
  padding-top:25px;
  padding-bottom:20px;
}

.download_container_dark {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:0px;
  padding-bottom:20px;
  padding-left:20px;
  padding-right:20px;
  background-color:var(--strong-purple);
}

.download_container_light {
  position:relative;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  grid-row-gap:20px;
  grid-column-gap:15px;
  padding-top:125px;
  padding-bottom:125px;
  padding-left:20px;
  padding-right:20px;
  background-color:var(--mid-purple);
}

.download_thumbnails_left {
  grid-column:1/5;
}

.download_description_right {
  grid-column:5/13;
}

.download_thumbnails_right {
  grid-column:9/13;
}

.download_description_left {
  grid-column:1/9;
}

@media only screen and (max-width: 480px) {

  .download_thumbnails_left {
    grid-column:1/7;
  }

  .download_description_right {
    grid-column:7/13;
  }

  .download_thumbnails_right {
    grid-column:7/13;
  }

  .download_description_left {
    grid-column:1/7;
  }


}

/*******************************************************************/
/*                       SVG Divider Styling                       */
/*******************************************************************/

.custom-shape-divider-top-1725579884 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}

.custom-shape-divider-top-1725579884 svg {
    position: relative;
    display: block;
    width: calc(150% + 1.3px);
}

.custom-shape-divider-top-1725579884 .shape-fill {
    fill: var(--strong-purple);
}

.custom-shape-divider-bottom-1725563413 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}

.custom-shape-divider-bottom-1725563413 svg {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}

.custom-shape-divider-bottom-1725563413 .shape-fill {
    fill: var(--mid-purple);
}

.custom-shape-divider-bottom-1725563844 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}

.custom-shape-divider-bottom-1725563844 svg {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    transform: scaleX(-1);
}

.custom-shape-divider-bottom-1725563844 .shape-fill {
    fill: var(--strong-purple);
}



/*******************************************************************/
/*                       Video Wrapper Styling                     */
/*******************************************************************/
.video_wrapper {
  width: 100%
  position: relative;
  padding-bottom: 56.25%;
}

.video_wrapper iframe {
  Position: absolute;
  width: 100%;
  Height: 100%;
  top: 0;
  left: 0;
}


/*******************************************************************/
/*            CSS Grid Layout for Index Page Styling               */
/*******************************************************************/

.twelve_column_grid_container {
  display: grid;
  margin:20px 15px;
  grid-template-columns: repeat(12, 1fr);
  grid-row-gap: 20px;
  grid-column-gap: 10px;
}

.grid_element_hero_banner {
  grid-column:1/13;
}

.grid_element_hero_headline {
  grid-column:1/9;
  margin: auto;
  text-align:center;
}

.grid_element_hero_logo {
  grid-column:9/13;
  margin:auto;
}

.grid_element_hero_quote {
 grid-column:1/13;
}

.grid_element_hero_cta_button {
  grid-column:1/13;
  text-align:center;
}

.grid_element_promo_banner {
  grid-column:1/13;
  padding-top:30px;
  z-index:1;
}

.grid_element_about_us_text {
  grid-row:4/5;
  grid-column:7/13;
}

.grid_element_about_us_video {
  grid-row:4/5;
  grid-column:1/7;
  margin-bottom:30px;
}

.grid_element_testimonials {
  grid-column:1/13;
  text-align:center;
}

.grid_element_quote_01 {
  grid-column:1/5;
}

.grid_element_quote_02 {
  grid-column:5/9;
}

.grid_element_quote_03 {
  grid-column:9/13;
}

.grid_element_council_logos {
  grid-column:1/13;
  text-align:center;
}

.grid_element_testimonial_CTA {
  grid-column:1/13;
  margin: auto;
}

.grid_element_our_shows {
  grid-column:1/13;
  margin: auto;
}

.grid_element_card_01 {
  grid-column:1/5;
}

.grid_element_card_02 {
  grid-column:5/9;
}

.grid_element_card_03 {
  grid-column:9/13;
}

.grid_element_bottom_of_page_cta {
  grid-column:1/13;
  text-align: center;
}

/*******************************************************************/
/*            Additional Grid Styling for Show Pages               */
/*******************************************************************/

.grid_element_show_page_hero_quote_01 {
  grid-column:1/7;
}

.grid_element_show_page_hero_quote_02 {
  grid-column:7/13;
}

.grid_element_about_the_show {
  grid-column:1/7;
  padding-top:25px;
  padding-bottom:25px;  
}

.grid_element_faq {
  grid-column:7/13;
  padding-top:25px;
  padding-bottom:25px; 
}

.grid_element_also_interested_in {
  grid-column:1/13;
  text-align: center;
}

.grid_element_also_interested_in_card_01 {
  grid-column:1/7;
}

.grid_element_also_interested_in_card_02 {
  grid-column:7/13;
}


@media only screen and (max-width: 768px) {

  .grid_element_hero_headline {
    grid-column:1/13;
    margin: auto;
  }

  .grid_element_hero_logo {
    grid-column:1/13;
  }

  .grid_element_promo_banner {
    padding-top:50px;
  }

  .grid_element_about_us_text {
    grid-row:5/6;
    grid-column:1/13;
  }

  .grid_element_about_us_video {
    grid-row:6/7;
    grid-column:1/13;
    margin-bottom:30px;
  }

  .grid_element_card_01 {
    grid-column:1/7;
    justify-self: center;
  }

  .grid_element_card_02 {
    grid-column:7/13;
    justify-self: center;
  }

  .grid_element_card_03 {
    grid-column:4/10;
    justify-self: center;
  }

  .grid_element_quote_01 {
    grid-column:1/7;
    justify-self: center;
  }

  .grid_element_quote_02 {
    grid-column:7/13;
    justify-self: center;
  }

  .grid_element_quote_03 {
    grid-column:4/10;
    justify-self: center;
  }

  .grid_element_show_page_hero_quote_01 {
    grid-column:1/13;
  }

  .grid_element_show_page_hero_quote_02 {
    grid-column:1/13;
  }

  .grid_element_about_the_show {
    grid-column:1/13;
    padding-top:50px;
    padding-bottom:0px; 
  }

  .grid_element_faq {
    grid-column:1/13;
  }
}


@media only screen and (max-width: 480px) {

  .grid_element_quote_01 {
    grid-column:1/13;
  }

  .grid_element_quote_02 {
    grid-column:1/13;
  }

  .grid_element_quote_03 {
    grid-column:1/13;
  }

  .grid_element_card_01 {
    grid-column:1/13;
    justify-self: center;
  }

  .grid_element_card_02 {
    grid-column:1/13;
    justify-self: center;
  }

  .grid_element_card_03 {
    grid-column:1/13;
    justify-self: center;
  }

  .grid_element_also_interested_in_card_01 {
    grid-column:1/13;
    text-align: center;
  }

  .grid_element_also_interested_in_card_02 {
    grid-column:1/13;
    text-align: center;
  }
}

/*******************************************************************/
/*        Additional Grid Styling for Testimonials Pages           */
/*******************************************************************/


.grid_element_testimonial_hero_headline {
  grid-column:1/13;
}


/*******************************************************************/
/*                    Call To Action Button Styling                */
/*******************************************************************/

button {
  display:inline-block;
  background-color: var(--strong-yellow);
  color: var(--cta-text-color);
  margin-right:auto;
  margin-left:auto;
  margin-top:1.25em;
  margin-bottom:0.5em;
  padding:10px 25px;
  border-radius:15px;
  font-weight:bold;
  font-size:1.2em;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  box-shadow: 4px 4px 2px rgba(0,0,0,0.5);
  transition:scale 0.15s ease-in-out;
}

button:hover {
  scale:1.1;
}

.centered_button {
  text-align:center;
}

.bottom_of_page_CTA {
  display:grid;
  margin:auto;
}
  
/*******************************************************************/
/*                         Quote Box Styling                       */
/*******************************************************************/

.quote_box {
  display: grid;
  grid-template-columns: auto 5fr;
  grid-row-gap: 5px;
  grid-column-gap: 5px;
  margin:5px auto;
  width:100%;
  height:100%;
  line-height:1.2em; 
  color: var(--main-background-color);
  background-color: var(--pale-yellow);
  border-color: var(--content-box-outline-color);
  border-style:solid;
  border-width:5px;
  border-radius:10px;
  padding:5px;
  box-sizing:border-box;
  box-shadow: 8px 8px 4px rgba(0,0,0,0.5);
}

.quote_box p {
  margin-bottom:0;
}

.quote_box a {
  color: var(--main-background-color);
}

.quote_box a:hover {
  color: var(--content-box-outline-color);
}

.quotation_mark {
  font-weight:bold;
  text-align:center;
  color: var(--menu-bar-background-color)
}


.quote_text {
  grid-column:1/6;
  font-weight:bold;
  text-align:left;
}

.quote_justified_text {
  grid-column:1/6;
  font-weight:bold;
  text-align:justify;
}


.quote_separator {
  line-height: 1em;
  font-style:italic;
  text-align:center;
}

.quote_source {
  grid-column:2/6;
  font-style:italic;
  text-align:left;
  padding-left:0;
  margin-top: auto;
  margin-bottom: auto;
}

.quote_source_logo {
  grid-column:1/2;
  margin-left: auto;
  margin-right: 0;
  margin-top:auto;
  margin-bottom:auto;
}

.quote_more {
  grid-column:1/6;  
}

.star-rating {
  grid-column:1/6;
  margin:auto;
}

/*******************************************************************/
/*                         Show Card Styling                       */
/*******************************************************************/

.card {
  width:90%;
  height:100%;
  margin:auto;
  border-radius:10px;
  background-color: var(--mid-purple);
  box-shadow: 8px 8px 4px rgba(0,0,0,0.5);
  transition:0.4s ease-in-out;
}

.card:hover {
  transform:translateY(-16px);
}

.card img {
  width:100%;
  height:auto;
  border-radius:10px;
}

.card-content {
  padding:16px;
}

.card-content h2 {
  text-align:left;  
}

.card-content p {
  text-align:left;
}

.card_content_button {
  display:grid;
  margin:0 auto;
  vertical-align:bottom;
}

.card_content_button a { 
  color:var(--strong-purple);
  background-color:var(--strong-yellow);
  margin:16px auto;
  padding:8px 16px;
  border-radius:8px;
  text-align:center;
  text-decoration:none;
  font-weight:bold;
  box-shadow: 4px 4px 2px rgba(0,0,0,0.5);
  transition:0.4s ease-in-out;
}

.card_content_button a:hover {
  color:var(--strong-purple);
  scale:1.1;
}


/*******************************************************************/
/*         CSS Grid Layout for 'The Shows' Page Styling            */
/*******************************************************************/

.grid_container_shows_page {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-row-gap: 15px;
  grid-column-gap: 10px; 
}

.grid_element_1_shows_page {
  grid-column:1;
  grid-row:1;
}

.grid_element_2_shows_page {
  grid-column:2;
  grid-row:1/3;
}

.grid_element_3_shows_page {
  grid-column:1;
  grid-row:2;
}

.grid_element_4_shows_page {
  grid-column:1;
  grid-row:3;
}

.grid_element_5_shows_page {
  grid-column:2;
  grid-row:3/5;
}

.grid_element_6_shows_page {
  grid-column:1;
  grid-row:4;
}

.grid_element_7_shows_page {
  grid-column:1;
  grid-row:5;
}

.grid_element_8_shows_page {
  grid-column:2;
  grid-row:5/7;
}

.grid_element_9_shows_page {
  grid-column:1;
  grid-row:6;
}

.grid_element_10_shows_page {
  grid-column:1;
  grid-row:7;
}

.grid_element_11_shows_page {
  grid-column:2;
  grid-row:7/9;
}

.grid_element_12_shows_page {
  grid-column:1;
  grid-row:8;
}

@media only screen and (max-width: 680px) {

  .grid_element_1_shows_page {
    grid-column:1/3;
    grid-row:1;
    text-align:center;
  }

  .grid_element_2_shows_page {
    grid-column:1/3;
    grid-row:2;
    text-align:center;
  }

  .grid_element_3_shows_page {
    grid-column:1/3;
    grid-row:3;
  }

  .grid_element_4_shows_page {
    grid-column:1/3;
    grid-row:4;
    text-align:center;
  }

  .grid_element_5_shows_page {
    grid-column:1/3;
    grid-row:5;
    text-align:center;
  }

  .grid_element_6_shows_page {
    grid-column:1/3;
    grid-row:6;
  }

  .grid_element_7_shows_page {
    grid-column:1/3;
    grid-row:7;
    text-align:center;
  }

  .grid_element_8_shows_page {
    grid-column:1/3;
    grid-row:8;
    text-align:center;
  }

  .grid_element_9_shows_page {
    grid-column:1/3;
    grid-row:9;
  }

  .grid_element_10_shows_page {
    grid-column:1/3;
    grid-row:10;
    text-align:center;
  }

  .grid_element_11_shows_page {
    grid-column:1/3;
    grid-row:11;
    text-align:center;
  }

  .grid_element_12_shows_page {
    grid-column:1/3;
    grid-row:12;
  }


}

/*******************************************************************/
/*      CSS Grid Layout for Individual Shows Page Styling          */
/*******************************************************************/

.grid_container_individual_shows_page {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-row-gap: 20px;
  grid-column-gap: 10px;
}

/* ************************************* */
/*              Show Title               */
/* ************************************* */
.grid_element_1_individual_shows_page {
  grid-column:1/5;
  text-align:center;
  margin:auto;
}

/* ************************************* */
/*              Show Image               */
/* ************************************* */
.grid_element_2_individual_shows_page {
  grid-column:5/7;
  margin:auto;
  /* justify-self: end;
     align-self: start; */
}

/* ************************************* */
/*                Quote 1                */
/* ************************************* */
.grid_element_3_individual_shows_page {
  grid-column:1/4;
}

/* ************************************* */
/*                Quote 2                */
/* ************************************* */
.grid_element_4_individual_shows_page {
  grid-column:4/7;
}

/* ************************************* */
/*          CTA Request A Quote          */
/* ************************************* */
.grid_element_CTA_testimonials_individual_shows_page {
  grid-column:1/7;
  margin: auto;
}

/* ************************************* */
/*             About The Show            */
/* ************************************* */
.grid_element_about_individual_shows_page {
  grid-column:1/4;
  max-width:90%;
  margin: 0 auto;
}

/* ************************************* */
/*                  FAQ                  */
/* ************************************* */
.grid_element_faq_individual_shows_page {
  grid-column:4/7;
}

@media only screen and (max-width: 770px) {

  .grid_element_1_individual_shows_page {
    grid-column: 1/7;
  }

  .grid_element_2_individual_shows_page {
    grid-column:1/7;
  }

  .grid_element_3_individual_shows_page {
    grid-column:1/7;
  }

  .grid_element_4_individual_shows_page {
    grid-column:1/7;
  }

  .grid_element_about_individual_shows_page {
    grid-column:1/7;
    max-width:100%;
  }

  .grid_element_faq_individual_shows_page {
    grid-column:1/7;
  }

}

@media only screen and (max-width: 560px) {

  .grid_element_1_individual_shows_page {
    grid-column:1/7;
    justify-self: center;
  }

  .grid_element_2_individual_shows_page {
    grid-column:1/7;
    justify-self: center; 
  }

  .grid_element_3_individual_shows_page {
    grid-column:1/7;
  }

  .grid_element_4_individual_shows_page {
    grid-column:1/7;
  }
}


/* ************************************* */
/*            CTA Book A Show            */
/* ************************************* */
.grid_element_CTA_Book_individual_shows_page {
  grid-column:1/7;
  margin: auto;
}

/* ************************************************** */
/*            You May Also Be Interested In           */
/* ************************************************** */
.also-interested-in {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-row-gap: 20px;
  grid-column-gap: 10px;
  margin: auto;
  text-align:center;
}

.also-interested-in-heading {
  grid-column:1/3;
  margin: auto;
}

.also-interested-in-show-1 {
  grid-column:1/2;
  margin: auto;
}

.also-interested-in-show-2 {
  grid-column:2/3;
  margin: auto;
}

@media only screen and (max-width: 560px) {
  .also-interested-in-show-1 {
    grid-column:1/3;
  }

  .also-interested-in-show-2 {
    grid-column:1/3;
  }
}

/*******************************************************************/
/*         CSS Grid Layout for Testimonials Page Styling           */
/*******************************************************************/

.grid_container_testimonials_page {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 2fr;
  grid-row-gap: 15px;
  grid-column-gap: 10px;
}

.grid_element_general_testimonials_section_header {
  grid-column:1/13;
  text-align: center;  
}

.grid_element_2_testimonials_page {
  grid-column:1/5;
}

.grid_element_3_testimonials_page {
  grid-column:5/9;
}

.grid_element_4_testimonials_page {
  grid-column: 9/13;
}

.grid_element_5_testimonials_page {
  grid-column: 1/5;
}

.grid_element_general_testimonials_show_title {
  grid-column:1/13;
  text-align: left;
}

.grid_element_general_testimonials_show_thumbnail_left {
  grid-column: 1/5;
  grid-row: span 2;
}

.grid_element_general_testimonials_quote_right {
  grid-column: 5/13;
}

.grid_element_general_testimonials_section_cta {
  grid-column:1/13;
  text-align: center;  
}

.grid_element_9_testimonials_page {
  grid-column: 1;
  grid-row: span 2;
}

.grid_element_10_testimonials_page {
  grid-column: 2/5;
}

.grid_element_11_testimonials_page {
  grid-column: 2/5;
}

.grid_element_12_testimonials_page {
  grid-column: 1;
  grid-row: span 2;
}

.grid_element_13_testimonials_page {
  grid-column: 2/5;
}

.grid_element_14_testimonials_page {
  grid-column: 2/5;
}

.grid_element_15_testimonials_page {
  grid-column: 1;
  grid-row: span 2;
}

.grid_element_16_testimonials_page {
  grid-column: 2/5;
}

.grid_element_17_testimonials_page {
  grid-column: 2/5;
}

@media only screen and (max-width: 768px) {

  .grid_element_2_testimonials_page {
    grid-column:1/7;
  }

  .grid_element_3_testimonials_page {
    grid-column:7/13;
  }

  .grid_element_4_testimonials_page {
    grid-column: 4/10;
  }

  .grid_element_general_testimonials_show_title {
    text-align: center;
  }

  .grid_element_general_testimonials_show_thumbnail_left {
    grid-column: 1/13;
    grid-row: span 1;
  }

  .grid_element_general_testimonials_quote_right {
    grid-column: 1/13;
  }

}

@media only screen and (max-width: 480px) {

  .grid_element_2_testimonials_page {
    grid-column: 1/13;
  }

  .grid_element_3_testimonials_page {
    grid-column: 1/13;
  }

  .grid_element_4_testimonials_page {
    grid-column: 1/13;
  }

  .grid_element_6_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_7_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_8_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_9_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_10_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_11_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_12_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_13_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_14_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_15_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_16_testimonials_page {
    grid-column: 1/5;
  }

  .grid_element_17_testimonials_page {
    grid-column: 1/5;
  }


}


/*******************************************************************/
/*  CSS Grid Layout for Individual Show Testimonials Page Styling  */
/*******************************************************************/

.grid_container_individual_testimonials_page {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-row-gap:15px;
  grid-column-gap:15px;
  padding:20px 15px;
}

.grid_element_1_individual_testimonials_page {
  grid-column:1/3;
  text-align:center;
}

@media only screen and (max-width: 768px) {

  .grid_element_quote_box_individual_testimonials_page {
    grid-column:1/3;
  }

}


/*******************************************************************/
/*      CSS Grid Layout for Council Testimonials Page Styling      */
/*******************************************************************/

.grid_container_council_testimonials_page {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-row-gap:15px;
  grid-column-gap:15px;
  padding-top:20px;
  padding-bottom:50px;
  padding-left:15px;
  padding-right:15px;
}

.grid_element_1_council_testimonials_page {
  grid-column:1/13;
}

.grid_element_2_council_testimonials_page {
  grid-column:1/7;
}

.grid_element_3_council_testimonials_page {
  grid-column:7/13;
}

.grid_element_4_council_testimonials_page {
  grid-column:4/10;
}


@media only screen and (max-width: 768px) {

  .grid_element_2_council_testimonials_page {
    grid-column:1/13;
  }

  .grid_element_3_council_testimonials_page {
    grid-column:1/13;
  }

  .grid_element_4_council_testimonials_page {
    grid-column:1/13;
  }

}

/*******************************************************************/
/*                 CSS Grid Layout for Contact Page                */
/*******************************************************************/

.grid_container_contact_page {
  display: grid;
  grid-template-columns: minmax(min-content, 1fr) 1fr;
  grid-row-gap: 10px;
  grid-column-gap: 10px;
  padding:20px 15px;
}

.grid_container_contact_page p {
  margin:0;
}

.grid_container_contact_page a {
  text-decoration:none;
}

.contact_type {
  text-align: right;
}

.contact_title {
  grid-column: 1/3;
  text-align: center;
}

.contact_text {
  grid-column: 1/3;
}

.spacing_row_contact_page {  
  grid-column: 1/3;
}


/*******************************************************************/
/*            CSS Grid Layout for Tech Requirements Page           */
/*******************************************************************/

.grid_container_tech_requirements {
  display: grid;
  grid-row-gap: 10px;
  grid-column-gap: 10px;
  padding:20px 15px;
}


/*******************************************************************/
/*                    CSS FAQ Accordian Styling                    */
/*                           Code From                             */
/*           https://www.youtube.com/watch?v=pzy_QStQaqA           */
/*          https://codepen.io/dcode-software/pen/oNjXqzg          */
/*******************************************************************/

.accordion {
  grid-column:1/7;
  width:90%;
  margin:auto;
  box-shadow: 4px 4px 2px rgba(0,0,0,0.25);
  border-radius: 10px;
  overflow: hidden;
  /* font-family: "Quicksand", sans-serif; */
  background: var(--strong-purple);
}

.accordion__label,
.accordion__content {
  padding: 14px 20px;
}

.accordion__label {
  display: block;
  color: var(--strong-yellow);
  font-weight: 500;
  cursor: pointer;
  position: relative;
  transition: background 0.1s;
}

.accordion__label:hover {
  background: rgba(0, 0, 0, 0.1);
}

.accordion__label::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 20px;
  width: 12px;
  height: 6px;
  background-image: url('data:image/svg+xml;utf8,<svg width="100" height="50" xmlns="http://www.w3.org/2000/svg"><polygon points="0,0 100,0 50,50" style="fill:%23FFFFFF99;" /></svg>');
  background-size: contain;
  transition: transform 0.4s;
}

.accordion__content {
  background: var(--pale-purple);
  line-height: 1.6;
  font-size: 0.85em;
  display: none;
}

.accordion__input {
  display: none;
}

.accordion__input:checked ~ .accordion__content {
  display: block;
}

.accordion__input:checked ~ .accordion__label::after {
  transform: translateY(-50%) rotate(0.5turn);
}

@media only screen and (max-width: 560px) {
  .accordion {
    width:100%;
  } 
}

/*******************************************************************/
/*                      Contact Form Styling                       */
/*******************************************************************/

.contact_form {
  display:grid;
  max-width:800px;
  border-radius: 10px;  
  margin:auto;
  background-color: var(--pale-yellow);
  color: var(--mid-purple);  
}

footer {
    background-color: var(--mid-purple);
    color: var(--pale-yellow);
    text-align: center;
    padding: 20px 0;
}

footer a {
    color: var(--pale-yellow);
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}
