body{background:black;background-image:url(assets/images/background.png); background-position:top center; background-repeat:no-repeat;margin:0;padding:0;}


@font-face {
  font-family: 'BebasBook';
  src: url('fonts/BebasNeueBook.otf'); /* IE9 Compat Modes */
 }
 
 @font-face {
  font-family: 'BebasBold';
  src: url('fonts/BebasNeueBold.otf'); /* IE9 Compat Modes */
 }
 

.bebasBook{font-family:'BebasBook';}
.bebasBold{font-family:'BebasBold';}

div.navbar{background:#007ac3;font-family:'BebasBold';margin-bottom:0;}
ul.nav{float:left;border-top:1px solid #007ac3;}
ul.nav li{float:left;display:inline;}
a.mainnav{color:white;font-size:18px;}
li.grey a{color:grey;}
li.grey a:hover{color:grey;background:none;}
a#current, a.mainnav:hover{color:#ffbf00;}
div#ECFHead2018{background-image:url('assets/images/HeaderBack2018.png');background-position:bottom right; background-size:75%;background-repeat:no-repeat;}




@media only screen and (max-width: 480px){
ul.nav{display:none;}
.hideTitle{display:none;}
}

@media only screen and (max-width: 768px){
ul.nav{display:none;}
.hideTitle{display:none;}
}

@media only screen and (max-width: 769px){
	div#ECFHead2018{background-image:url('assets/images/HeaderBack2018.png');background-position:bottom center; background-size:100%;background-repeat:no-repeat;}

	div#ECFHead2018 h1{text-align:center;}
		div.navbar{display:none;}
		
	}
	
	.btn{background:#007ac3;color:white;border-radius:0;font-size:24px;padding:0.5em 1em 0.5em 1em;}
.btn:hover{background:#ffa502;color:white;}


	.btn2{background:#ffa502;color:white;border-radius:0;font-size:24px;padding:0.5em 1em 0.5em 1em;}
.btn2:hover{background:#45b97a;color:white; text-decoration:none;} 

h2.bigTitle{color:white;font-size:60px;text-align:center;padding-top:50px;}


ul.social{float:right; list-style-type:none;margin:0.5em 1em 0 0;}
ul.social li{display:inline;}


 
 div#mainContent{background:white;width:100%;}
 div.pinkBox{width:30px;height:30px;background:#fe0b7d;float:left;margin-right:10px;}
 div.blueBox{width:30px;height:30px;background:#007ac3;float:left;margin-right:10px;}
div.greenBox{width:30px;height:30px;background:#45b97a;float:left;margin-right:10px;}
div.yellowBox{width:30px;height:30px;background:#ffa502;float:left;margin-right:10px;}

.pink{color:#fe0b7d;}
.blue{color:#007ac3;}
.green{color:#45b97a;}
.yellow{color:#ffa502;}

ul#mainLinks{list-style-type:none;width:100%;margin:0;padding:0;}
ul#mainLinks li{display:inline;margin:1%;width:20%;}
ul#mainLinks li.grey{filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
  filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */}
ul#mainLinks li a img{width:20%; height:auto; margin:0;padding:0;}

a#grey{background:grey; color:black;}
a#grey:hover{background:grey; color:black;}

ul#sponsors{list-style-type:none;margin-top:20px; margin-bottom:75px;}
ul#sponsors li{display:inline;margin:10px;}
ul#sponsors li a img{filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
  filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */}
  
  ul#sponsors li a:hover img{filter: none; /* IE6-9 */
  -webkit-filter: grayscale(0); /* Google Chrome, Safari 6+ & Opera 15+ */
  filter: grayscale(0); /* Microsoft Edge and Firefox 35+ */}
  
  div#footer{background:#007ac3;margin:0;padding:0;width:100%;color:white;padding:25px;}
  div#footer dl.footerList{list-style-type:none;}
  div#footer dl dt{margin-top:15px;}
  div#footer dl dd a{color:white;}
  div#footer dl dd a:hover{color:#ffa502;text-decoration:none;}
  
ul.footerList{list-style-type:none;margin:0;padding:0;}
ul.footerList li.grey a{color:#07314a; text-decoration:none;}
ul.footerList li.grey a:hover{color:#07314a;}
ul.footerList li a {color:white;text-decoration:none;}
ul.footerList li a:hover{color:#ffa502;}
ul.footerList img{margin-right:5px;}

ul.fundraising{list-style-type:none;margin:0; padding:0;}
ul.fundraising li{font-family:'bebasBook'; font-size:20px;}
ul.fundraising li.big{background:none; color:#00e181; font-family:'bebasBold';font-size:34px;}

ol.considerations{margin:0; padding:0;}
ol.considerations li{margin:10px 0 0 20px;}

dl.volunteerRoles dt{font-family:'BebasBold';font-size:24px;margin-top:10px;}

ul.connectedList {list-style-type:none;margin:0;padding:0; font-family:'BebasBold'; font-size:24px;text-decoration:none;}
ul.connectedList li{margin-top:10px;}
ul.connectedList li a{color:#007ac3;}
ul.connectedList li a:hover{color:#ffa502;text-decoration:none;}

.performers{width:90%;margin:0;padding:0;}
.popcontainer {padding:10px; text-align:left;margin-top:25px;}
	.popcontainer h2{margin:10px 0 0 0;padding:0;font-size:24px; font-family:'bebasBold';}
	.popcontainer img{border:1px solid black;}
	.popcontainer hr{margin:0;padding:0;margin-top:-5px;}
	
	
	a.popup-trigger{cursor:pointer;color:#007ac3;font-size:18px;}
	
	.popup-btn-close{background:#007ac3;color:white;border-radius:0;font-size:24px;padding-left:20px; padding-right:20px;font-family:'bebasBold';}
	a.popup-btn-close:hover{background:#ffa502;color:white;}

	.popup-btn-close{float:left; margin-top:25px;}
	
a.popup-trigger:hover, .popup-btn-close:hover{color:#ffa502;text-decoration:none; cursor:pointer;}
	
	.performer img{width:100%;height:auto;padding:20px;padding-left:10px;}
	.bio h2{font-family:'bebasBold';color:black;margin-bottom:25px;}
	.bio p{padding-right:50px;}

}


button {
	
	color: #FFFFFF;
	

	&:focus {
		outline: none;
	}

	&:hover {
		background:#ffa502;color:white;
	}
}


.popup{
	
	background: white;
	position: fixed;
	display: none;
	z-index: 5000;
	text-align:left;
	
	-webkit-box-shadow: 10px 10px 0px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 10px 10px 0px 0px rgba(0,0,0,0.5);
box-shadow: 10px 10px 0px 0px rgba(0,0,0,0.5);
border:1px solid black;
	width: 50%;
	height: auto;
	left: 25%;
	top: 25%;

	> div {
		border-radius: 10px;
		position: fixed;
		background: #FFFFFF;
		box-shadow: 0px 0px 15px 0px rgba(#000000, 0.3);
		padding: 30px 15px;
		/* Width of popup can be changed */
		width: 70%;
		max-width: 600px;
		z-index: 5001;
		@include transform(translate(-50%, -50%));
  		left: 50%;
	   top: 50%;
		text-align: center;
		border: 5px solid #9AD3DE;
	}
}

@media only screen and (min-width:769px){
	.dropdown, .dropbtn{display:none;}
	.popcontainer p, .popcontainer h3, .popcontainer ul{display:none;}
	
}

@media only screen and (max-width:769px){
	a.popup-trigger{display:none;}
	.popcontainer p{margin-top:20px;}
	
}

@media only screen and (max-width: 992px){
.popup img{display:none;}


}
.popup{padding-bottom:25px;}

/* Dropdown Button */


.dropbtn {
    color:white;font-size:20px;background:#007ac3;font-family:'BebasBold';margin-bottom:0;padding:10px 20px 10px 20px;}

/* The container <div> - needed to position the dropdown content */
.dropdown {
	margin:20px;
	position: relative;
    display: inline-block;
	font-family:'bebasBold';
	
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #007ac3;
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: white;
    padding: 20px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background:#ffa502;color:white;text-decoration:none;
}


/* Style the tab */
.tab {
	font-family:'bebasBold';
	font-size:20px;
    overflow: hidden;
	border-bottom:1px solid #ffa502;
    background-color: #f1f1f1;
	text-align:left;
}

/* Style the buttons that are used to open the tab content */
.tab button {
    background-color: inherit;
	width:15%;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
	border:1px solid #ffa502;
	border-bottom:none;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ffa502;
	color:white;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #ffa502;
	color:#fff;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding-top: 20px;
border:1px solid #ffa502;
    border-top: none;
	overflow:hidden;
}

.tabcontent {
    animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

h2.title{font-size:40px;margin:0;}
#shows h3{font-size:18px; margin-top:0;}
#media h2{font-family:'bebasBold';color:black;font-size:18px; margin-top:10px;}
#shows p{font-size:12px;}
#media img{border:1px solid black;}
a#tickets{background:#007ac3;color:white;border-radius:0;font-size:20px;padding:5px 10px;}
a#tickets:hover{background:#ffa502;color:white; text-decoration:none;}
.showContainer{float:left;clear:left; margin-bottom:20px;}

div#WinBanners img{margin:2%; width:45%;height:auto;float:left;}

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

	
	
}

@media only screen and (max-width:769px){
	#contestEntry{clear:left; margin-top:20px;}
	div#WinBanners img{width:100%;height:auto;margin:0 0 10px 0;}
}

@media only screen and (max-width: 992px){
	#contestEntry{float:left; clear:left; margin-top:20px;}


}
ol.contestrules{margin:0;padding:0;}
ol.contestrules li{margin:1em;}

ul.appearing{list-style-type:none;margin:0;padding:0;}
ul.appearing li{display:inline;float:left; width:20%;padding:2%;}
ul.appearing li img{width:100%;}

ul.comicShows{list-style-type:none;margin:0;padding:0; text-transform:uppercase;}