/* Layout Elements */

body.rf {
    background-image: url('../images/bg/rf-bg.jpg');
    background-attachment: fixed;
    background-position: center top;
    background-clip: border-box;
    background-origin: padding-box;
    background-size: auto auto;
    background-repeat: repeat;
    background-blend-mode: normal;
  }

  /* Fixed banner area at top of window. */
  .container.rf-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 10;
    margin-top: 0px;
    margin-right: 0px;
    margin-left: 0px;
  }
  
  a.responsive-picture.rf-header {
    max-width: none;
  }
  
  a.responsive-picture.rf-header:hover {
    opacity: .7 ;
  }
  
  /* Fixed menu bar at bottom of window. */
  .container.menubar {
    position: fixed;
    right: auto;
    bottom: 0vmax;
    left: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display:    -moz-box;
    display: -ms-flexbox;
    display:         flex;
    -ms-flex-pack: center;
    -ms-flex-align: center;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
  
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
            align-items: center;
  }
  
  a.glyph.menubar {
    background-color: darkblue;
    color: #fff;
    margin-right: 2px;
    margin-left: 2px;
    width: 41px;
    height: 41px;
    text-align: center;
    font-size: 30px;
  }
  
  a.glyph.menubar:hover {
    background-color: skyblue;
  }

  span.menubar-text {
    color:#fff ;
    font-size: 16px;
  }

  button.social.rf-footer {
    margin-bottom: 0;
    min-width: 200px;
    max-width: 600px;
    width: 80%;
    background-color: darkblue;
    font-family: 'Contrail One', cursive;
  }
  
  button.social:hover {
    background-color: skyblue;
  }
  
  .container.menubar-popup {
    position: fixed;
    right: 5%;
    bottom: 4%;
    left: 5%;
    padding-top: 10px;
    background-color: rgba(36, 35, 33, 0.70);
    grid-template-columns: repeat(2 , auto);
    grid-template-rows: auto;
  }
  
  .container.menubar-popup.is-hidden {
    top: auto;
    right: 5%;
    bottom: 4.8%;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 10px;
    padding-bottom: 0;
    background-color: rgba(36, 35, 33, 0.70);
  }

  @media screen and (min-width: 40rem) {
    .container.menubar-popup {
      grid-template-columns: repeat( 3, auto );
    }
  }
  
  @media screen and (min-width: 64rem) {
    .container.menubar-popup {
      grid-template-columns: repeat( 4, auto );
    }
  }
  
  span.glyph-for-button.menubar {
    color:#fff ;
    display: inline-block;
    margin-right: .25rem;
    font-size: 16px;
  }
  
  a.link-button-glyph.social {
    margin-right: .25rem;
    margin-bottom: 10px;
    padding: 10px;
  }

  a.link-button-glyph.social.skyblue {
    background-color: skyblue;
  }
  
  a.link-button-glyph.social.green {
    background-color: green;
  }
  
  a.link-button-glyph.social.orange {
    background-color: orange;
  }
  
  a.link-button-glyph.social.yellow {
    background-color: gold;
  }
  
  a.link-button-glyph.social.blue {
    background-color: blue;
  }
  
  a.link-button-glyph.social.pink {
    background-color: pink;
  }
  
  a.link-button-glyph.social.plum {
    background-color: plum;
  }
  
  a.link-button-glyph.social.red {
    background-color: red;
  }

  a.link-button-glyph.social.facebook {
    background-color: #3b5998;
  }
  
  a.link-button-glyph.social.twitter {
    background-color: #55acee;
  }
  
  a.link-button-glyph.social.instagram {
    background-color: #125688;
  }
  
  a.link-button-glyph.social.soundcloud {
    background-color: #ba6517;
  }
  
  a.link-button-glyph.social.bandcamp {
    background-color: #498c8f;
  }
  
  a.link-button-glyph.social.youtube {
    background-color: #b00;
  }
  
  a.link-button-glyph.social.applemusic {
    background-color: #0a348f;
  }
  
  a.link-button-glyph.social.spotify {
    background-color: #547604;
  }
  
  a.link-button-glyph.social.google-plus {
    background-color: #dd4b39;
  }

  a.link-button-glyph.social:hover {
    background-color: #706666;
    -webkit-transform: scaleZ(1);
       -moz-transform: scaleZ(1);
            transform: scaleZ(1);
  }

  /* Main cardbox container. */
  .container.rf-cardbox {
    display: grid;
    margin: 0% auto 20px;
    padding-top: 7%;
    padding-right: 10px;
    padding-left: 10px;
    grid-template-columns: repeat(auto-fit, minmax(300px, 400px));
    grid-template-rows: auto;
    grid-row-gap: 20px;
    grid-column-gap: 20px;
    /* grid-auto-columns: 21px; */
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
            justify-content: center;
  }

  .container.rf-cardbox.big {
    grid-template-columns: repeat(auto-fit, minmax(400px, 800px));
  }

  .container.rf-cardbox.notop {
    padding-top: 10px;
  }

  /* Card styles. */
  .container.rf-card {
    padding: 0px;
  }

  .container.rf-card-bg {
    padding: 10px;
    border-radius: 10px;
    background-color: rgba(167, 25, 25, .8);
    max-width: none;
  }

  .rf-elem-linklist {
    position: relative ;
    background-color: rgba(167, 25, 25, .8);
    max-width: none;
    padding: 20px 10px;
    color: #fff;
    font-size: 17px;
    font-family: 'Noto Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  }
  
  .container.rf-card-image {
    position: relative ;
  }

  a.responsive-picture.rf-card-image-link {
    max-width: none;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
  }
  
  a.responsive-picture.rf-card-image-link:hover {
    opacity: .7 ;
  }

  .rf-elem-image {
    position: relative ;
    background-color: rgba(167, 25, 25, .8);
  }

  a.responsive-picture.rf-card-elem-link {
    max-width: 96%;
    margin: auto ;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 20px;
  }
  
  a.responsive-picture.rf-card-elem-link:hover {
    opacity: .7 ;
  }
  
  a.responsive-picture.rf-title-image-link {
    max-width: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  
  a.responsive-picture.rf-title-image-link:hover {
    opacity: .7 ;
  }

  p.paragraph.rf-card-content {
    padding: 20px 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color: rgba(167, 25, 25, .8);
    color: #fff;
    font-size: 17px;
    font-family: 'Noto Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  }
  
  span.rf-card-headline {
    color: #fff;
    background-color: blue ;
  }
  
  /* Accordian. */
  ul.list-container.rf-accordion {
    margin: 0;
    background-color: white;
    list-style-type: none;
  }

  a.link-text.accordion-title.rf-dropdown {
    color: #a71919;
    font-size: 16px;
    font-family: 'Contrail One', cursive;
  }

  /* Styles for 2/3/4-column pages. */

  .container.rf-1col {
    display: grid;
    margin-top: 7%;
    margin-left: auto;
    margin-right: auto;
    padding-right: .625rem;
    padding-left: .625rem;
    max-width: 90% ;
    max-width: 75rem;
  }

  @media screen and (min-width: 40rem) {
    .container.rf-1col {
      padding-right: .9375rem;
      padding-left: .9375rem;
    }
  }

  .container.sd-two-cols.rf-2col,
  .container.sd-three-cols.rf-3col,
  .container.sd-four-cols.rf-4col {
    margin-top: 7%;
    max-width: 90% ;
  }

  .container.rf-1col.notop,
  .container.sd-two-cols.rf-2col.notop,
  .container.sd-three-cols.rf-3col.notop,
  .container.sd-four-cols.rf-4col.notop {
    margin-top: 5px;
    max-width: 90% ;
  }

  .container.rf-1col-default,
  .container.rf-2col-default,
  .container.rf-3col-default,
  .container.rf-4col-default {
    margin-top: 0px;
    margin-bottom: 30px;
    padding-right: 5px;
    padding-left: 5px;
    background-color: rgba(255, 255, 255, .8);
  }

  .container.rf-col-container {
    margin: 10px;
    padding: 10px;
    background-color: rgba(255, 255, 255, .8);
  }
  
  p.paragraph.rf-col-para {
    margin: 5px auto 5px;
    padding: 0 5px;
    max-width: 1200px;
    color: #a71919;
    font-size: 20px;
    font-family: 'Contrail One', cursive;
    line-height: 1.1;
  }
  
    p.paragraph.rf-col-para.rf-col-heading {
    margin: 0 auto 5px;
    padding: 0 5px;
    max-width: 1200px;
    font-weight: 700;
    font-size: 25px;
  }

  /* Picture styles. */
  div.responsive-picture.rf-picture {
    display: block;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 5px;
    max-width: none;
  }

  div.responsive-picture.rf-picture-link {
    display: block;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 5px;
    max-width: none;
  }

  div.responsive-picture.rf-picture-link:hover {
    box-shadow: rgba(0, 0, 0, .5) 5px 5px 5px 5px;
  }

  /* Link styles. */
 
  a.link-text.rf-col-link-text {
    margin-right: auto;
    margin-left: auto;
    color: #223875;
    font-size: 20px;
    font-family: 'Contrail One', cursive;
    font-weight: 200;
  }
  
  a.link-text.rf-col-link-text:hover {
    color: skyblue;
  }
 
  a.link-text.rf-card-link-text {
    margin-right: auto;
    margin-left: auto;
    color: #223875;
    background-color: white;
    font-size: 20px;
    font-family: 'Contrail One', cursive;
    font-weight: 200;
  }

  a.link-text.rf-card-link-text.white {
    background-color: white;
  }

  a.link-text.rf-card-link-text.pink {
    background-color: pink;
  }

  a.link-text.rf-card-link-text.yellow {
    background-color: yellow;
  }

  a.link-text.rf-card-link-text.green {
    background-color: green;
  }
  
  a.link-text.rf-card-link-text.orange {
    background-color: orange;
  }
  
  a.link-text.rf-card-link-text.skyblue {
    background-color: skyblue;
  }
  
  a.link-text.rf-card-link-text.plum {
    background-color: plum;
  }
  
  a.link-text.rf-card-link-text.darkturquoise {
    background-color: darkturquoise;
  }
  
  a.link-text.rf-card-link-text.red {
    background-color: red;
  }
  
  a.link-text.rf-card-link-text:hover {
    opacity: 0.8;
  }

  /* Paragraph styles. */

  p.rf-text-para {
    padding-right: 5px;
    padding-left: 5px;
    max-width: none;
    color: #575757;
    font-size: small;
    font-family: 'Roboto', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  }
  
  /* Orbit. */
  
  ul.list-container.orbit-container {
    height: auto;
  }
  
  div.responsive-picture.orbit-image {
    max-width: none;
  }
  
  button.slide-indicator {
    margin-right: 1.1%;
    margin-left: 1.1%;
  }

  @media screen and (min-width: 40rem) {
    button.slide-indicator {
      margin-right: .1%;
      margin-left: .1%;
    }
  }

  div.rf-orbit {
    position: relative;
    background-color: rgba(167, 25, 25, .8);
  }

  div.rf-orbit-nav {
    position: relative;
    background-color: pink;
  }

  .orbit-bullets.rf {
    position: relative;
    margin-top: 0px;
    margin-bottom: 0px;
    text-align: center; }

  .orbit-bullets.rf button {
    width: 2rem;
    height: 2rem;
    margin: auto ;
    border-radius: 50%;
    background-color: #cacaca;
  }
  
  .orbit-bullets.rf button:hover {
      background-color: green;
    }

  .orbit-bullets.rf button.is-active {
      background-color: greenyellow;
   }
  
   /* Button group. */

  a.link-button.button.rf {
    padding-right: 5px;
    padding-left: 5px;
    max-width: none;
    color: white;
    background-color: rgb(90, 90, 206);
    font-size: medium ;
    font-family: 'Roboto', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  }

  a.link-button.button.rf:hover {
    opacity: .7 ;
  }  

  .container.rf-button-group {
    position: relative;
    background-color: rgba(167, 25, 25, .8);
    display: grid;
    /* margin: 0% auto 20px; */
    padding-top: 10px;
    margin-top: 5px;
    grid-template-columns: repeat(auto-fit, minmax(60px, 200px));
    grid-template-rows: auto;
    grid-row-gap: 2px;
    grid-column-gap: 5px;
    grid-auto-columns: 2px;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
            justify-content: center;
  }

  /* Gallery. */

  /* Layout Elements */

img.rf-gallery {
  max-width: 100%;
  height: auto;
}

.container.gallery-wrapper {
  max-width: 100%;
}

.container.gallery-content {
  position: relative;
  overflow: hidden;
  /* margin-top: 1vw; */
}

.container.main-image-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
}

p.rf-gallery-caption {
  position: absolute;
  padding:10px;
  margin-left: 5%;
  margin-top: 5px;
  width: 90%;
  font-size:20;
  color:white;
  background-color: rgba(167, 25, 25, .8);
  font-family: 'Noto Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
}

a.rf-gallery-caption {
  color:white;
  background-color: rgb(90, 90, 206);
}

a.rf-gallery-caption:hover {
  opacity: .7;
}

.container#image-1 {
  z-index: 51;
  display: block;
}

.container#image-2 {
  z-index: 52;
  display: none;
}

.container#image-3 {
  z-index: 53;
  display: none;
}

.container#image-4 {
  z-index: 54;
  display: none;
}

.container#image-5 {
  z-index: 55;
  display: none;
}

.container#image-6 {
  z-index: 56;
  display: none;
}

.container#image-7 {
  z-index: 57;
  display: none;
}

.container#image-8 {
  z-index: 58;
  display: none;
}

.container#image-9 {
  z-index: 59;
  display: none;
}

.container#image-10 {
  z-index: 60;
  display: none;
}

.container.thumbnails-row {
  display: -webkit-box;
  display: -webkit-flex;
  display:    -moz-box;
  display: -ms-flexbox;
  display:         flex;
  padding-top: 10px;
}

.container.thumbnail-cont {
  padding-right: 1px;
  padding-left: 1px;
}

.container.button.thumbnail-cont {
  padding-top: 0;
  padding-bottom: 0;
  background-color: transparent;
}

div.responsive-picture.main-image {
  max-width: none;
  max-height: none;
}

div.responsive-picture#placer {
  opacity: .5;
}

div.responsive-picture.thumbnail-img {
  opacity: .5;
  -webkit-filter: saturate(1) contrast(1) brightness(1) grayscale(.6);
          filter: saturate(1) contrast(1) brightness(1) grayscale(.6);
  -webkit-transition-duration: .4s;
     -moz-transition-duration: .4s;
       -o-transition-duration: .4s;
          transition-duration: .4s;
  -webkit-transition-property: all;
     -moz-transition-property: all;
       -o-transition-property: all;
          transition-property: all;
}

div.responsive-picture.thumbnail-img:hover {
  opacity: 1;
  -webkit-filter: saturate(1) contrast(1) brightness(1) grayscale(0);
          filter: saturate(1) contrast(1) brightness(1) grayscale(0);
  -webkit-transition-duration: .4s;
     -moz-transition-duration: .4s;
       -o-transition-duration: .4s;
          transition-duration: .4s;
  -webkit-transition-property: all;
     -moz-transition-property: all;
       -o-transition-property: all;
          transition-property: all;
}

/* Tabs. */

span.rf-tab-label {
  color: #223875;
  font-size: 20px;
  font-family: 'Contrail One', cursive;
}

p.rf-tab-heading {
  color: #a71919;
  font-size: 20px;
  font-family: 'Contrail One', cursive;
}

p.rf-tab-subheading {
  color: #a71919;
  font-size: 16px;
  font-family: 'Contrail One', cursive;
}

ul.list-container.tabs {
  margin: 0px;
  padding: 0px;
  background-color: #e6e6e6;
}

a.link-text.transp {
  background-color: transparent;
}

.container.tabs-panel {
  margin: 0px;
  min-height: 260px;
}

li.list-item-container.is-active.tabs-title {
  /* border-bottom-width: .0625rem;
  border-bottom-style: solid; */
  background-color: white;
}

li.list-item-container.tabs-title:hover {
  opacity: .7;
}

/* Social box. */

.container.rf-socialbox-wrapper {
  padding: 5px;
  background-color: rgba(167, 25, 25, .8);
}

.container.rf-socialbox-container {
  display: -webkit-box;
  display: -webkit-flex;
  display:    -moz-box;
  display: -ms-flexbox;
  display:         flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-pack: justify;
  -ms-flex-align: start;
  padding: 24px 16px;
  border: .250rem solid rgba(214, 214, 214, .4);
  border-radius: 24px;
  background-color: #fff;
  /* background-color: rgba(167, 25, 25, .8); */
  box-shadow: none;

  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
     -moz-box-align: start;
          align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
     -moz-box-pack: justify;
          justify-content: space-between;
}

.container.rf-social-box-headings {
  display: -webkit-box;
  display: -webkit-flex;
  display:    -moz-box;
  display: -ms-flexbox;
  display:         flex;
  -ms-flex-pack: start;
  -ms-flex-align: center;
  margin-top: 36px;
  margin-bottom: 18px;
  border-radius: 8px;
  background-color: #fff;

  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
     -moz-box-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
     -moz-box-align: center;
          align-items: center;
}

div.responsive-picture.rf-socialbox-picture {
  margin-right: 16px;
  width: 100px;
  border-radius: 200px;
}

.container.rf-socialbox-heading-text {
  display: -webkit-box;
  display: -webkit-flex;
  display:    -moz-box;
  display: -ms-flexbox;
  display:         flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;

  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
}

blockquote.rf-socialbox-text {
  margin: 0;
  padding-right: 0;
  padding-left: 0;
  border-left-width: 0;
  font-size: 20px;
  font-family: 'Inter', sans-serif;
  line-height: 31px;
}

span.text-element.rf-socialbox-heading {
  color: #000;
  text-align: left;
  font-weight: 500;
  font-size: 16px;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

span.text-element.rf-socialbox-subheading {
  margin-top: 8px;
  color: #b5b5b5;
  text-align: left;
  font-weight: 300;
  font-size: 16px;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a.social-image.rf-socialbox-icon {
  margin-right: 8px;
  margin-left: 8px;
  padding: 4px;
  max-width: 48px;
  border-radius: 50px;
  background-color: #0064fa;
  -webkit-transition-timing-function: ease-in-out;
     -moz-transition-timing-function: ease-in-out;
       -o-transition-timing-function: ease-in-out;
          transition-timing-function: ease-in-out;
  -webkit-transition-duration: .25s;
     -moz-transition-duration: .25s;
       -o-transition-duration: .25s;
          transition-duration: .25s;
}

a.social-image.rf-socialbox-icon:hover {
  -webkit-transform: translateY(-2px);
     -moz-transform: translateY(-2px);
       -o-transform: translateY(-2px);
          transform: translateY(-2px);
}


