.login,
.logout a,
label  {
        color: #4c3a00;
        padding: .25em .5em
}


label {padding: .25em .5em .25em 0;}

/* .maths-bot-killer label {font-size: 120%;} */

/* form input {padding: 1.5em 0;} */
form input[type="text"]:focus,
form input[type="email"]:focus,
form input[type="password"]:focus,
textarea[type="text"]:focus {
    
    height: 3em; /* for IE */
    vertical-align: middle; /* This is optional but it makes legacy IEs look better */
    background: #7788ad;
    color: #fff;
    font-size: 1.25em;
} 
 
textarea {display: block;
          height: 6em;
} 
 
 



/*  Wayfinder - page indicator (musical note icon) */
 

    
    .active:not(.nav-toggle) {color: #7788ad;}
    
    .active:not(.nav-toggle):after {
        font-family: 'FontAwesome';
        content: " \f001";
        font-style: normal;
        font-weight: normal;
        text-decoration: inherit;
        font-size: 1em;
        line-height: 0;
        color: #fbc14b; 
    }
 




/* Formit */
.success {
  padding: 1em;
  margin-bottom: 1.5em;
  color: #222;
  background: #c9d232; }
  


/* this is a span element */
.error {
    display: block; 
    background: red;
    color: white;
    font-size: 1em;
    padding: .25em;
} 

.is-invalid-label {color: #ec5840;}

.form-error {
  display: none;
  margin-top: -.86957rem;
  margin-bottom: .86957rem;
  font-size: 0.8rem;
  color: white;
  background: #ed3b1e;
  padding: .25em;
}
.form-error.is-visible {
    display: block;
    background: #ed3b1e;
}



.maths strong {font-size: 150%;}



/* Reveal Modal */

.reveal-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1005;
    display: none;
    background-color: rgba(10, 10, 10, .45);
    overflow-y: scroll
}

.reveal {
    z-index: 1006;
    backface-visibility: hidden;
    display: none;
    padding: 1rem;
    border: 1px solid #cacaca;
    border-radius: 0;
    background-color: #fefefe;
    position: relative;
    top: 100px;
    margin-right: auto;
    margin-left: auto;
    overflow-y: auto
}

.reveal .column,
.reveal .columns {
    min-width: 0
}

.reveal>:last-child {
    margin-bottom: 0
}

.reveal.collapse {
    padding: 0
}

table caption,
table tbody td,
table tbody th {
    padding: .5rem .625rem .625rem
}

@media print,
screen and (min-width:40em) {
    .reveal {
        min-height: 0;
        width: 600px;
        max-width: 75rem
    }
    .reveal .reveal {
        right: auto;
        left: auto;
        margin: 0 auto
    }
    .reveal.tiny {
        width: 30%;
        max-width: 75rem
    }
    .reveal.small {
        width: 50%;
        max-width: 75rem
    }
    .reveal.large {
        width: 90%;
        max-width: 75rem
    }
}

.reveal.full {
    top: 0;
    left: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    height: 100vh;
    min-height: 100vh;
    margin-left: 0;
    border: 0;
    border-radius: 0
}

@media screen and (max-width:29.9375em) {
    .reveal {
        top: 0;
        left: 0;
        width: 100%;
        max-width: none;
        height: 100%;
        height: 100vh;
        min-height: 100vh;
        margin-left: 0;
        border: 0;
        border-radius: 0
    }
}

.reveal.without-overlay {
    position: fixed
}

.modal {
    background: #fbc14b;
    padding: .5em 1em 0 .5em
}

.modal p {
    font-size: 125%;
    padding: .5em 1.25em
}

.modal p:nth-of-type(1) {
    text-decoration: underline
}

.reveal span {
    font-size: 100%
} 


/* Icons */
/*  concert date list */
.button.large .icon {color: #fff;}


/*  testimonials */
blockquote .icon {
    color: #8796b7;
    padding: 0 .2em 0 0;
}

/*  facebook */
.site-name .icon {
    padding: 2rem 0 0 0;  
    font-size: 3rem;
    text-align: center;
    position: relative;
    z-index: 10;
    margin-bottom: 0;
    color: #7383a3;
}

    @media print, screen and (min-width: 50em) {
          .site-name .icon {text-align: left;
                            padding: 3px 0 0 .25em; 
                            font-size: 2.5rem;
          }  
    }
    
     @media print, screen and (min-width: 95em) {
          .site-name .icon {padding: 3px 0 0 0;}  
    }

/* footer facebook */
footer .icon {
    font-size: 1.5em;
    text-align: center;
}


/* music library */
.voice-type .pdf {background: #a3792f;}

/*  concert date list */
.button.large .icon {color: #fff;}


/*  testimonials */
blockquote .icon {
    color: #8796b7;
    padding: 0 .2em 0 0;
}

/*  facebook */
.site-name .icon {
    padding: 1rem 0 0 0;  
    font-size: 2rem;
    text-align: center;
    position: relative;
    z-index: 10;
    margin-bottom: 0;
    color: #7383a3;
}

    @media print, screen and (min-width: 50em) {
          .site-name .icon {text-align: left;
                            padding: 3px 0 0 .25em; 
          }  
    }
    
     @media print, screen and (min-width: 95em) {
          .site-name .icon {padding: 3px 0 0 0;}  
    }

/* footer facebook */
footer .icon {
    font-size: 1.5em;
    text-align: center;
}


/* help page file download */
p.help-pic {margin: 0;}

.button.help {border-bottom: 4px solid red;}

.history-section-images {margin-top: 4em;}



/* History PDF Download and centenary concert audio */

.history-pdf,
.audio-files {
              border: 2px solid #e6e6e6;
              padding: 2em;
}

.history-pdf a {color: #000;}

/* .history-pdf p:nth-of-type(2) {margin: 0;}  *//* button */
/* .history-pdf h1 {margin: 0 0 1em 0;} */
.history-pdf-title {padding: 0 0 2em 0;}
.history-pdf h1 cite {font-size: 1.25rem; color: #546589;}
.history-pdf p:nth-of-type(3) {color: #8a8a8a;}



/* temporary styles */

/* .alison-welcome {color: #303d5e;}

.alison-welcome figcaption {margin-bottom: 1em;}

@media (min-width: 64em) {
  .alison-resume div {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    -ms-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    -ms-column-gap: 2em;
    column-gap: 2em; } } */
    
    
    audio {width: 100%;
        margin: 0 0 2em 0;
    }
    

.centenary h3 {border-bottom: none;} 


.posters div {padding: 10px;}

.audio-files a:not(.youtube-link) {color: #000;} 
.youtube-link {text-decoration: underline;}
    
.concert-half {color: #7788ad;}
    

/* Scrolling Narration section */
/* to make scrollbars a bit more obvious */

/* ::-webkit-scrollbar {
    width: 14px;
}
 
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
 
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
} */
.scrolling-notice {
                   text-transform: uppercase;
                   border-bottom: 1px solid #7788ad;
                   color: #e45239;
}

section.scrolling-narration {
                height: 400px; 
                overflow-x: hidden; 
                overflow-y: auto;
                padding-top: 1rem;
}

.contributor {margin: 2em 0;}



.scrolling-narration .row {padding: 1em 0;}
.narrator,
.concert-song-title {font-weight: bold;
                     padding-bottom: .75em;
}

@media (min-width: 64em) {
  .narrator {padding-bottom: 0;} 
}
    
    
    audio {width: 100%;
        margin: 0 0 2em 0;
    }



.concert-song-title {padding: 1em 0;} 

.concert-song-title:after {
                     color: #7788ad;
                     font-family: 'FontAwesome';
                     content: " \f001";
                     font-style: normal;
                     font-weight: normal;
                     text-decoration: inherit;
                     font-size: 1.5em;
                     line-height: 0;
}



.interval {font-weight: bold;
           background: #000;
           color: #fff;
           padding: 1em;
           margin: 2em 0;
}



.fa .fa-arrow-down {display: block;
                    color: #7788ad;
}

blockquote,
blockquote p {
    color: #546589;
    font-style: italic;
}

blockquote {padding-bottom: 3.5em;
            background: url("../img/posters/poppy.jpg") no-repeat bottom center;
}

.bob-marsden {color: teal;}
.derek-boardman {color: #916324;}

.posters-credit {font-size: 80%; color: #aaa;}
.posters-credit p:nth-of-type(2) {margin: 0;}

.volunteer {margin-top: 2em;
            font-size: 150%;}

.youtube-link p {padding: 2em 0 0 0;}

.concert-dates-link {
                    text-transform: uppercase;
                   /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#303d5e+26,000000+52,303d5e+77 */
background: #303d5e; /* Old browsers */
background: -moz-linear-gradient(left,  #303d5e 25%, #000000 50%, #303d5e 75%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #303d5e 25%,#000000 50%,#303d5e 75%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #303d5e 25%,#000000 50%,#303d5e 75%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#303d5e', endColorstr='#303d5e',GradientType=1 ); /* IE6-9 */


                    
                    
}

.concert-dates-link p {margin-bottom: 0;}


.concert-dates-link a {display: inline-block;
                       color: #7788ad;
                       padding: 1.25em 0;
                       font-family: "Open Sans", sans-serif;
                       letter-spacing: .75rem;
                       transition: all 500ms ease-in-out 0s;
}

.concert-dates-link a span {color: #fbc14b;
  
}



@media print, screen and (min-width: 90em) {

    .concert-dates-link a:hover {color: #fbc14b;
                                letter-spacing: 1rem;
    }

}

[type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'],
textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  /* height: 1.85714rem; */
  height: 2.2rem;
  margin: 0 0 0.7619rem;
  padding: 0.38095rem;
  border: 1px solid #cacaca;
  border-radius: 0;
  background-color: #fefefe;
  box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
  font-family: inherit;
  font-size: 0.7619rem;
  font-weight: normal;
  line-height: 1.5;
  color: #0a0a0a;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
  [type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus,
  textarea:focus {
    outline: none;
    border: 1px solid #8a8a8a;
    background-color: #fefefe;
    box-shadow: 0 0 5px #cacaca;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out; }

textarea {
  max-width: 100%; }
  textarea[rows] {
    height: auto; }

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #cacaca; }

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #cacaca; }

input::placeholder,
textarea::placeholder {
  color: #cacaca; }

input:disabled, input[readonly],
textarea:disabled,
textarea[readonly] {
  background-color: #e6e6e6;
  cursor: not-allowed; }

[type='submit'],
[type='button'] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 0; }

input[type='search'] {
  box-sizing: border-box; }

[type='file'],
[type='checkbox'],
[type='radio'] {
  margin: 0 0 0.7619rem; }

[type='checkbox'] + label,
[type='radio'] + label {
  display: inline-block;
  vertical-align: baseline;
  margin-left: 0.38095rem;
  margin-right: 0.7619rem;
  margin-bottom: 0; }
  [type='checkbox'] + label[for],
  [type='radio'] + label[for] {
    cursor: pointer; }

label > [type='checkbox'],
label > [type='radio'] {
  margin-right: 0.38095rem; }

[type='file'] {
  width: 100%; }

label {
  display: block;
  margin: 0;
  /* font-size: 0.66667rem; */
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.8;
  color: #0a0a0a; }
  
  
.gdpr label {font-size: 80%;}
  

  label.middle {
    margin: 0 0 0.7619rem;
    padding: 0.42857rem 0; }

.help-text {
  margin-top: -0.38095rem;
  font-size: 0.61905rem;
  font-style: italic;
  color: #0a0a0a; }

.input-group {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin-bottom: 0.7619rem;
  -webkit-align-items: stretch;
      -ms-flex-align: stretch;
          align-items: stretch; }
  .input-group > :first-child {
    border-radius: 0 0 0 0; }
  .input-group > :last-child > * {
    border-radius: 0 0 0 0; }

.input-group-label, .input-group-field, .input-group-button, .input-group-button a,
.input-group-button input,
.input-group-button button,
.input-group-button label {
  margin: 0;
  white-space: nowrap; }

.input-group-label {
  padding: 0 1rem;
  border: 1px solid #cacaca;
  background: #e6e6e6;
  color: #0a0a0a;
  text-align: center;
  white-space: nowrap;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex: 0 0 auto;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center; }
  .input-group-label:first-child {
    border-right: 0; }
  .input-group-label:last-child {
    border-left: 0; }

.input-group-field {
  border-radius: 0;
  -webkit-flex: 1 1 0px;
      -ms-flex: 1 1 0px;
          flex: 1 1 0px;
  height: auto;
  min-width: 0; }

.input-group-button {
  padding-top: 0;
  padding-bottom: 0;
  text-align: center;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex: 0 0 auto;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto; }
  .input-group-button a,
  .input-group-button input,
  .input-group-button button,
  .input-group-button label {
    height: auto;
    -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
                -ms-grid-row-align: stretch;
            align-self: stretch;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 0.7619rem; }

fieldset {
  margin: 0;
  padding: 0;
  border: 0; }

legend {
  max-width: 100%;
  margin-bottom: 0.38095rem; }

.fieldset {
  margin: 0.85714rem 0;
  padding: 0.95238rem;
  border: 1px solid #cacaca; }
  .fieldset legend {
    margin: 0;
    margin-left: -0.14286rem;
    padding: 0 0.14286rem; }

select {
  /* height: 1.85714rem; */
  height: 2.2rem;
  margin: 0 0 0.7619rem;
  padding: 0.38095rem;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid #cacaca;
  border-radius: 0;
  background-color: #fefefe;
  font-family: inherit;
  /* font-size: 0.7619rem; */
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.5;
  color: #0a0a0a;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 32,0 16,24' style='fill: rgb%28138, 138, 138%29'></polygon></svg>");
  background-origin: content-box;
  background-position: right -0.7619rem center;
  background-repeat: no-repeat;
  background-size: 9px 6px;
  padding-right: 1.14286rem;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out; }
  @media screen and (min-width: 0\0) {
    select {
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); } }
  select:focus {
    outline: none;
    border: 1px solid #8a8a8a;
    background-color: #fefefe;
    box-shadow: 0 0 5px #cacaca;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out; }
  select:disabled {
    background-color: #e6e6e6;
    cursor: not-allowed; }
  select::-ms-expand {
    display: none; }
  select[multiple] {
    height: auto;
    background-image: none; }

/* .is-invalid-input:not(:focus) {
  border-color: #cc4b37;
  background-color: #f9ecea; }
  .is-invalid-input:not(:focus)::-webkit-input-placeholder {
    color: #cc4b37; }
  .is-invalid-input:not(:focus):-ms-input-placeholder {
    color: #cc4b37; }
  .is-invalid-input:not(:focus)::placeholder {
    color: #cc4b37; }

.is-invalid-label {
  color: #f61212; }

.form-error {
  display: none;
  margin-top: -0.38095rem;
  margin-bottom: 0.7619rem;
  font-size: 0.57143rem;
  font-weight: bold;
  color: #cc4b37; }
  .form-error.is-visible {
    display: block; } */
    
.gdpr {
    padding: 1em; 
    margin-bottom: 1em;
    background: #ccc;
    background: rgba(0, 0, 0, .05);
}
    
.gdpr p a {display: inline;
           color: #303d5e;
           font-weight: bold;}
           
         
         
         
        .social-media-facebook a, .social-media-youtube a {display: block; padding: .5em 0;}  
           
        .social-media-facebook a {background: url("../img/Facebook_Logo_Primary.png") center center;
            background-repeat: no-repeat;
            background-size: contain;
        }
           
        .social-media-youtube a {background: url("../img/youtube-logo.png") center center;
            background-repeat: no-repeat;
            background-size: contain;
        }
        
        

           
  
           
/*Ad for musical Director */

section.advert {padding: 4em 10%;
         font-size: 1.15em;
         background: #fbc14b;
}
         
         
         section.advert h1 {
             font-family: "Open Sans",sans-serif;
             font-size: 2.25em;
             color: #fff;
             text-align: center;
         }
         section.advert h2 {text-align: center;}
         
         .advert-contact {font-weight: bold;}
         
         .closing-date {color: #fff;}
         
@media print, screen and (min-width: 40em) {
          section.advert h1 {font-size: 3em;}
    }
         
         
@media print, screen and (min-width: 50em) {
          section.advert h1 {font-size: 4em;}
    }
    
    @media print, screen and (min-width: 64em) {
          section.advert {font-weight: bold;
                          text-align: center;
          }
          
          section.advert h1 {font-size: 5em;}
          
          .advert-contact {font-size: 1.25em;}

    }
    
    .applications-close {font-size: 1.5em;}
         
         
  @media print, screen and (min-width: 60em) {
          .applications-close {font-size: 2em;}
    }
    
    
figcaption {padding: 6px 0 10px 0;}


    



/* ----------------------------------------------
 * Generated by Animista on 2023-10-18 22:38:10
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation bounce-in-top
 * ----------------------------------------
 */
@-webkit-keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}

.bounce-in-top {
	-webkit-animation: bounce-in-top 1.1s both;
	-moz-animation: bounce-in-top 1.1s both;
	        animation: bounce-in-top 1.1s both;
	        animation-delay: 1s;
}