.stageCurtainBackground {
    background: url("/img/stage-curtain-background.jpg") no-repeat center center fixed;
    background-size: cover;
    color: white;
}
a {
    color: #ffffff;
}

/* Bootstrap striped table */

#eventsTable>thead>tr {
    background-color: hsla(2, 80%, 15%, 1 );
    font-weight: bold;
    color: white;
}

#eventsTable>tbody>tr:nth-child(odd)>td, 
#eventsTable>tbody>tr:nth-child(odd)>th {
   background-color: hsla(2, 90%, 18%, 1 );
 }


#eventsTable>tbody>tr:nth-child(even)>td, 
#eventsTable>tbody>tr:nth-child(even)>th {
   background-color: hsla(2, 80%, 15%, 1 );
 }

 


#eventsTable {
    color: #C0C0C0;
}

#eventsTable a {
    color: white;
}

#eventsTable>thead>tr>th {
}

.thumbnailBox {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
    align-items: stretch;
    background-color: rgba (128, 128, 128, 0.7 );
	
}

.myThumbnail {
	width: 275px;
	height: 100%;
	text-align: center;
	border: none; /* solid 1px gray; */
	border-radius: 5px;
	padding-top: 15px;
	margin-top: 10px;
	margin-right: 10px;
}

.thumbnailImage {
	border-radius: 5px;
    box-shadow: 0px 0px 15px 2px #404040;
}

/* Background for text-heavy pages */
.opaque-background {
    margin-top: 20px;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 10px;
}

/* Footer */

.footer-left {
	text-align: center;
}

.footer-centre {
	text-align: center;
}

.footer-right {
	text-align: center;
}
/* End of footer */


/* Experiment to see if we can make the navigation links larger on mobile */

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

	
	h5 { font-size: 1.6em; 
	padding-top: 10px;
	padding-bottom: 10px;
	border-style: solid;
	border-width: 1px;
	border-color: #ffffff;
	
	}
}

@media only screen and (min-width: 769px ) {



	h5 { 	
	font-size: 2.0em;
	padding-top: 10px;
	padding-bottom: 10px;
	border-style: solid;
	border-width: 1px;
	border-color: #ffffff;
	height:110px;

}


/* End of Experiment to see if we can make the navigation links larger on mobile */





/* Navbar */

#custom-bootstrap-menu.navbar-default .navbar-brand {
    color: #ffffff;
}


#custom-bootstrap-menu.navbar-default {
    font-size: 14px;
    background-color: rgba(31, 1, 1, 1);
    background: linear-gradient(to bottom, hsla(2, 90%, 25%, 1) 0%, hsla(2, 80%, 5%, 1) 100%);
    border-width: 0px;
    border-radius: 4px;
}
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a {
    color: #ffffff;  /* rgba(119, 119, 119, 1);*/
    background-color: rgba(248, 248, 248, 0);
}
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a:hover,
#custom-bootstrap-menu.navbar-default .navbar-nav>li>a:focus {
    color:  #ffffff;  /* rgba(51, 51, 51, 1); */
    background-color: hsla(2, 90%, 25%, 1);  /* rgba(248, 248, 248, 0);  */
}
#custom-bootstrap-menu.navbar-default .navbar-nav>.active>a,
#custom-bootstrap-menu.navbar-default .navbar-nav>.active>a:hover,
#custom-bootstrap-menu.navbar-default .navbar-nav>.active>a:focus {
    color: #ffffff;
    background-color: hsla(2, 90%, 35%, 1);  /* linear-gradient(to bottom, hsla(82, 90%, 25%, 1) 0%, hsla(82, 90%, 50%, 1) 100%); */
}
#custom-bootstrap-menu.navbar-default .navbar-toggle {
    border-color: #ddd;
}
#custom-bootstrap-menu.navbar-default .navbar-toggle:hover,
#custom-bootstrap-menu.navbar-default .navbar-toggle:focus {
    background-color: #ddd;
}
#custom-bootstrap-menu.navbar-default .navbar-toggle .icon-bar {
    background-color: #888;
}
#custom-bootstrap-menu.navbar-default .navbar-toggle:hover .icon-bar,
#custom-bootstrap-menu.navbar-default .navbar-toggle:focus .icon-bar {
    background-color: #1f0101;
}

/* end navbar */


/* Contact Form */
.contactForm {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
}

.flexFormRow {
    display: flex;             /* Makes it a flexbox */
    flex-direction: row;       /* This is a row */
    align-items: flext-start;  /* Align with the top of the field */
}

.contactFormTitle {
    width: 20%;
}

.contactFormField {
    width: 60%;
}

.contactFormValidator {
    padding-left: 15px;
    width: 20%;
    color: red;
}

input.ng-dirty.ng-invalid {
    border-color: red;
}

.contactFormObject {
    width: 100%;
    color: black;
}

input {
	color: black;
}