@charset "utf-8";
/* CSS Document */

html { 
    background-color: #3a000a;

  /* height: 100%;  */
  /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#3a000a',GradientType=0 ); IE6-9 */
}
body {
  margin:auto;

}  
body {
  /* position: absolute; */
	height: 100%;
  /* width: 100%; */
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	
    background-repeat: no-repeat;
	
	background-color: #3a000a; 
  background: linear-gradient(0deg, #3a000a, #a90329) fixed;
}

header {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: sticky;
}

.menuCtn {
  display: flex;
  width: 100%;
  height: 20%;
  flex-direction: column;
  /* min-height: 100vh; */
  /* max-width: 800px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
  margin: 25px; /* the auto margins (in conjunction with a width) center the page */
  /* padding: 10px; */
  /* position:relative; */
  /* overflow-x: hidden; */
  /* overflow-y: hidden; */
  /* background-color: beige; */
  align-items: center;
}


.headerCtn {
  display: flex;
	background: #f2f2e2;
	margin: 10px;
	-webkit-border-radius: 25px;
	border-radius: 25px;
	-webkit-box-shadow: 7px 13px 15px 3px black;
	box-shadow: 7px 13px 15px 3px black;
	text-align: center;
	/* padding: 10px 0px; */
	width: 800px;
  justify-content: center;
}

.menuCtn p {
	margin-bottom: 16px;
}

.menuCtn h1 {
	padding-top: 10px;
}

.homeIMG {
  display: block;
}

.flexMenu {
  display: flex;
  flex-direction: row;
  justify-content: center;
	width: 100%;
  margin-top: 15px;
  border-bottom-style: outset;
  border-color: rgb(0, 0, 0);
  border-width: medium;
  border-radius: 25px;
}

/*@media (max-width: 1300px) {
  .flexMenu {
    display: flex;
    width: 100%;
    padding: 20px;
    align-items: center;
    flex-direction: column;
  }

  .flexLink {
    width: 100%;
    flex-grow: 1;
    background-color: #69F;
    display: flex;
    box-shadow: inset 0 0 0 100vmax #3a000a17;
    transition: .2s all;
    cursor: pointer;
    justify-content: center;
    align-items: center;
  }
  
  .flexTitle {
    text-transform: uppercase;
    letter-spacing: .075em;
    color: #f5f5dc;
    transition: .2s all;
  }

  .flexLink:hover {
    flex-grow: 5;
    box-shadow: inset 0 0 0 100vmax rgba(175, 0, 100, 0.7);
  }
}*/

/*.FrontPageItemSelector
{

}

.FrontPageItemSelector img
{
   opacity: 0.7;
}
.FrontPageItemSelector img:hover
{
   opacity: 1.0;
}*/


/*.flexHome {
  width: 100%;
  flex-grow: 1;
  background-color: rgb(255, 255, 255);
  display: flex;
  box-shadow: inset 0 0 0 100vmax #3a000a17;
  transition: .2s all;
  cursor: pointer;
  justify-content: center;
  align-items: center; 
}*/

.flex:hover {
  flex-grow: 1;
  box-shadow: inset 0 0 0 100vmax rgba(175, 0, 100, 0.7);
}

.flexLink {
  flex-grow: 1;
  display: flex;
  box-shadow: inset 0 0 0 100vmax #3a000a00;
  transition: .2s all;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  border-radius: 25px;
}

.flexTitle {
  text-transform: uppercase;
  letter-spacing: .075em;
  color: #f5f5dc;
  transition: .2s all;
}

.flexLink:hover {
  flex-grow: 2;
  box-shadow: inset 0 0 0 100vmax rgba(33 43 95 / 48%);
}

.flexLink:nth-child(1) {
  /* background: url(2011-SpringNoteables61.jpg); /* repeat center center */
  background-position: center;
  background-size: inherit;
}

.flexLink:nth-child(2) {
  /* background: url(2012-03-15-SalidaSings-RhythmSection.jpg);*/
  background-position: center;
  background-size: inherit;
}

.flexLink:nth-child(3) {
  /* background: url(2018-Winter2.jpg); */
  background-position: center;
  background-size: inherit;
}

.flexLink:nth-child(4) {
  /* background: url(2018-Winter2.jpg); */
  background-position: center;
  background-size: inherit;
}

a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
  color: blue;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: none;
}


@media screen and (min-width: 900px) {
  
  .oneColFixCtr {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    /* text-align: center; */
    color: #000000;
    /*font: 100% Verdana, Arial, Helvetica, sans-serif;*/
    font-family:
    'Afacad';
    font-size: 22px;
  }
}

@media screen and (max-width: 900px) {
  body {
    background-color: #3a000a; 
    background: linear-gradient(0deg, #3a000a, #a90329) #3a000a; 
  }

  footer {
    margin-left: auto;
    margin-right: auto;
    width: 90%;
  }

  .oneColFixCtr {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    /* right: 0; */
    /* text-align: center; */
    color: #000000;
    /*font: 100% Verdana, Arial, Helvetica, sans-serif;*/
    font-family:
    'Afacad';
    font-size: x-large;
  }
}



.mainCtn {
  margin-bottom: 80px;
}


.page {
  /* display: flex; */
  height: 100%;
  flex-direction: column;
  align-items: center;
  margin: 25px;
  font-size: x-large;
  box-shadow: 9px 11px 17px 2px black;
}

.donateNow {
  text-align: center;
}

.donateNow a:visited {
  color: blue;
  text-decoration: none;
}

.donateNow p {
  font-size: 16px;
}

#mainMenu
{
  /*background-image: url(../images/menu_background.png);
  background-repeat: no-repeat; */
  width: 780px;
  height: 30px;
  position: absolute;
	top: 0px;
	left: 0px;
  margin: 0;
  padding: 0px 10px;
  overflow: visible;
	border-bottom: 1px solid #999;
	background-color: #aaa;
}

#mainMenu ul
{
  margin: 0 auto;
  padding: 0 0 0 0;
  white-space: nowrap;
  text-align: right;
  font: 15px Tahoma,Geneva,sans-serif;
  color: #000000;
  width: 836px;
}
#mainMenu ul li
{
  font: 15px Tahoma,Geneva,sans-serif;
  color: #000000;
  display: list-item;
  position: relative;
  list-style-type: none;
  float: left;
  padding: 0;
  margin: 0;
}
#mainMenu ul li a
{
  position: relative;
  top: 6px;
  color: #000000;
  text-decoration: none;
  margin: 0;
  padding: 6px 20px 6px 19px; /* change L&R padding here to correctly space out menu */
  border-left: 1px solid #6ff;
  border-right: 1px solid #669;
}
#mainMenu ul li a:hover
{
  background-color: #69F;
  border-left: 1px solid #888;
  border-right: 1px solid #888;
}
#mainMenu ul li a:active, a:selected, a:focus
{
  border: none;
  outline: none;
  /*ie-dummy: expression(this.hideFocus=true);*/
}

#mainMenu ul li a.over
{
  background-color: #69F;
  border-left: 1px solid #888;
  border-right: 1px solid #888;
}
#mainMenu ul li div.subnav
{
  position: absolute;
  top: 30px;
  left: 0px;
  width: 250px;
  margin: 0;
  padding: 0;
  display: none; /* disable for screen layout testing */
  background: #69F;
  opacity: 0.93;
  filter: alpha(opacity=93);
  border-left: 1px solid #888;
  border-right: 1px solid #888;
  border-bottom: 1px solid #888;
}
html #mainMenu ul li div.subnav ul
{
  text-align: left;
  margin: 0;
  padding: 0;
}
html #mainMenu ul li div.subnav ul li
{
  margin: 0;
  padding: 0;
  display: list-item;
  position: relative;
  list-style-type: none;
  border-top: 1px solid #888;
  clear: both;
}
html #mainMenu ul li div.subnav ul li a
{
  position: relative;
  display: block;
  top: 0px;
  margin: 0;
  padding: 5px 10px 5px 5px;
  width: 235px;
  font: 12px Tahoma,Geneva,sans-serif;
  text-align: left;
  background-image: none;
  border: 0;
}
html #mainMenu ul li div.subnav ul li a:hover
{
  color: #000000;
  background-color: #f5f5dc;
}
html #mainMenu ul li div.subnav ul li a span
{
  color: #000000;
}

html #mainMenu ul li div.subnav2
{
  padding: 0px;
  position: absolute;
  top: -2px;
  left: 250px;
  width: 250px;
  display: none; /* disable for screen layout testing */
  background: #379656;
  border-left: 1px solid #888;
  border-top: 1px solid #888;
  border-right: 1px solid #888;
  border-bottom: 1px solid #888;
}
html #mainMenu ul li div.subnav2left
{
  padding: 0px;
  position: absolute;
  top: -2px;
  left: -252px;
  width: 250px;
  display: none; /* disable for screen layout testing */
  background: #379656;
  border-left: 1px solid #888;
  border-top: 1px solid #888;
  border-right: 1px solid #888;
  border-bottom: 1px solid #888;
}

.oneColFixCtr #ContentAndMenu {
	padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	margin-top: 15px;
	/* background: #bbb; */
  background-color: #e3e3d4;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, .5);
  box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, .5);
  height: 100%;
  width: 100%;
  font-size: x-large;
  /*margin-bottom: 80px;*/
}


.radiusBorder
{
  margin: 10px 10px 10px 10px; 
  border:1px solid #bdbdbd; 
  border-radius: 5px; 
  -moz-border-radius:5px; 
  padding: 4px; 
  background: #fff; 
}
.floatRightWithBorder 
{
  margin: 0px 0px 10px 10px; 
  border:1px solid #bdbdbd; 
  border-radius: 5px; 
  -moz-border-radius:5px; 
  padding: 4px; 
  background: #fff; 
  float: right;
}

.testimg {
  display: flex;
  position: relative;
  width: 100%;
  height: 100%;
}

.video{
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: center;
  align-items: center;
}

footer {
  position: sticky;
  left: 20%;
  width: 50%;
  padding-left: 5%;
  padding-right: 5%;
  background-color: #e3e3d4;
  /* bottom: 0; */
  top: 100%;
  border-top-right-radius: 25px;
  border-top-left-radius: 25px;
  border-radius: 411px;
  box-shadow: 11px 14px 20px 0px;
}

.footerCtn {
  position: relative;
  min-width: fit-content;
  display: flex;
  text-align-last: start;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.footerIcons {
  text-decoration: none;
  margin-bottom: 0px;
  padding: 0;
  display: flex;
  flex-direction: column;
  margin-right: 5px;
}

.footIcon {
  text-decoration: none;
  color: #990909;
  margin: 0;
  padding: 0;
  font-size: xx-large;
}

.vl {
  border-left: 2px solid black;
  height: 63px;
  /* position: absolute; */
  left: 50%;
  margin: 5px;
  top: 0;
  color: #46010f;
}

.peakLink a:visited {
  text-decoration: none;
  color: blue;
}

.peakLink a:active {
  text-decoration: none;
  color: blue;
}

.supportLink {
  position: relative;
}

.paraContainer {
  padding: 25px;
}

.div-line {
  width: 100%;
  border-bottom: 1px solid black;
  }

h5 {
  font-size: larger;
  margin: 15px;
  text-align: left;
}

.concertDates {
  display: flex;
  /* justify-content: center; */
}

.concertList {
  padding-top: 5%;
  display: flex;
  flex-direction: column;
  align-content: center;
  width: 100%;
}

.concertPoster {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 100%;
}

.poster {
  height: 100%;
  width: fit-content;
}

/* .paraContainer p {
  text-indent: 50px;
} */

.concertSection {
  width: 100%;
  margin: 0 auto;
}

.concertTop {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.concertLeft {
  flex: 1;
  min-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.concertImage {
  flex: 1;
  min-width: 300px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.concertImage img {
  max-width: 100%;
  height: auto;
  border: 3px solid #ccc;
  border-radius: 8px;
}

.indent {
  text-indent: 1.5em;
  margin-bottom: 1em;
}

.concertPerformances h5 {
  color: red;
  margin-bottom: 10px;
}

.concertPerformances ul {
  list-style: disc;
  padding-left: 0;
}

.concertPerformances li {
  margin-bottom: 10px;
}