/********** Tab Panels **********/
@import url(https://fonts.googleapis.com/css?family=Jacques+Francois);
@import url(https://fonts.googleapis.com/css?family=Quattrocento+Sans);

body {
  background-color: none;
  color: inherit;
  margin: 0em;
  padding: 0em;}

.page {
  max-width: 640px;
  margin: 0px auto 30px auto;}

.panel {
  background-color: #fff;
  color: #7a7a7a;
  box-shadow: 3px 4px 5px rgba(0, 0, 0, 0.2);
  overflow: auto;}

button {
  border: none;}

/********** TYPOGRAPHY **********/
body, button {
    font-family: 'Arial', 'Helvetica', 'serif';}

h2, h3 {
  font-weight: normal;
  margin: 0em;}
	
h2 {
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 230%;
  line-height: 1em;
  padding: 20px 0px 0px 20px;}
	
h3 {
  font-size: 100%;
  letter-spacing: 0.2em;}

h6 {
  font-size: 140%;
  line-height: auto;}

p {
  font-family: 'Arial','Helvetica', 'serif';
  line-height: auto;
  font-size: 120%;}

a {
    text-decoration: inherit;}

button {
  font-size: 100%;
  text-align: left;
  text-transform: uppercase;}

  /*****************  No JS ***************/
#billboard {text-align: center;}
.js-warning {display: none;}

.no-js .js-warning {
  display: block;
  border: 3px solid #fff;
  text-align: center;
  background-color: #fff;
  color: #db5391;
  padding: 10px;}

/********** TABS **********/
.tab-list {
  margin: 0px;
  padding: 0px;}

.tab-list li {
  display: inline-block;
  list-style-type: none;
  background-color: #303030;
  border-bottom: 3px solid #858585;
  font-family: 'Jacques Francois', serif;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 11px;}

.tab-list li a {
  color: #f2f2f2;
  display: block;
  padding: 3px 10px 3px 10px;}


/********** HOVER STATES **********/
.tab-list li.active, .tab-list li.hover {
  background-color: #e5e5e5;
  border-bottom: 3px solid #e5e5e5;}

.tab-list li.active a, .tab-list li a:hover {
  color: #666;
  background-color: #e5e5e5;}


/********** PANELS **********/
.tab-panel {
  display: none;
  background-color: #e5e5e5;
  color: #666;
  min-height: auto;
  overflow: auto;}

.tab-panel.active {
  display: block;}

.tab-panel p {
  margin: 20px;}
	
/********* COLLAPSIBLE PANELS *********/
.panel-2 {
	margin-bottom: 30px;
	overflow: hidden;
	}
	.panel-heading{
		background-color: #D8D8D8;	
		padding: 5px 15px;}		
		.panel-title{
			margin: 0;
			position: relative;
			padding-right: 15px;

			color: #303030;
			text-transform: uppercase;	
			//font-family: 'Open Sans Condensed', sans-serif;
			font-weight: 100;	
			font-size: 1.7em;
		}
		a:hover,
		a:active,
		a:focus{
			text-decoration: none;
		}
	}		
}
	
.panel-collapsible{
	.panel-heading{
		.accordion-toggle{
			.panel-title:after{
				display: inline-block;
			    font: normal normal normal 14px/1 FontAwesome;
			    font-size: inherit;
			    text-rendering: auto;
			    -webkit-font-smoothing: antialiased;
			    -moz-osx-font-smoothing: grayscale;
			    transform: translate(0, 0);	
			    content: "\f107";
			    line-height: inherit;

			    position: absolute;
			    right: 0;
			}
			&.collapsed .panel-title:after{
				content: "\f105";
			}			
		}
	}
}

/************* VIDEO FRAME ***********/
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}	

	.row {
		text-align: justify;
	}

	.flex-row {
		text-align: justify;
	}
	
/************** GALLERY *************/
ul { list-style: none; }
#thumbnails { display: block; background-color: #605F5F;}
#thumbnails ul li { float: left; margin-right: 5px; margin-bottom: 5px; margin-top: 5px; text-align: left;}