@font-face {
    font-family: 'blackletter686_btregular';
    src: url('tt1044m-webfont.woff2') format('woff2'),
         url('tt1044m-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after,
.row:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix,
.row {
    *zoom: 1;
}

html {
	height: 100%;
}

body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: #000;
	color: #fff;
	background: url(../img/oubliette-home.jpg) no-repeat top center;
	background-size: cover;
	height: 100%;
	position: relative;
}

.respImg {
	width: 100%;
	height: auto;
}

p, h1, h2, h3, h4, h6 {
	margin-top: 0;
}

.logo{
	fill:#FFFFFF; 
	font-family:'blackletter686_btregular'; 
	font-size:422.8185px;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.67);
}

.blackletter {
	font-family:'blackletter686_btregular'; 
}



.aspectRatio {
  	width: 100%;
  	position: relative; /* If you want text inside of it */
}

.aspectRatioContentWrap {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
}

#aspectRatio {
	padding-top: 75.066666666%; /* 1:1 Aspect Ratio */
}

.homeContent {
	width: 90%;
	margin: 25vh auto 0 auto;
	text-align: center;
}

.blackletter {
	font-family:'blackletter686_btregular'; 
}

.homeDescription {
	text-align: center;
	font-size: 12vw;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.67);
	margin: -6vw 0 0 0;
	width: 100%;
	background-color: rgba(0,0,0,.4);
}

.opening {
	font-family: Montserrat;
	font-weight: 900;
	color: #fff;
	text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
	width: 100%;
	text-align: center;
	font-size: 5vw;
	margin-top: 5vw;
	margin-bottom: 0;
}

.address {
	font-family: Montserrat;
	font-weight: 700;
	color: #fff;
	text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
	width: 100%;
	text-align: center;
	font-size: 3.5vw;
	margin-top: 1vw;
	margin-bottom: 1vw;
}

.bigLink {
	font-family: Montserrat;
	font-weight: 700;
	text-align: center;
	margin-top: 1vw;
	width: 100%;
	font-size: 2vw;
	margin: 0;
}

.bigLink a:link,
.bigLink a:visited {
	color: #66e4ff;
	text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
}

.bigLink a:active,
.bigLink a:hover {
	color: #fbef6f;
	text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
}


footer {
	position: absolute;
	bottom: 0;
	width: 100%;
}

footer p {
	color: #fff;
	text-align: left;
	font-family: Montserrat;
	font-weight: 600;
	font-size: .6em;
	text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
}

#bottomMenu {
	color: #fff;
	text-align: center;
	font-family: Montserrat;
	font-weight: 600;
	font-size: 1em;
	text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
}

#bottomMenu a:link,
#bottomMenu a:visited {
	color: #fff;
	text-decoration: none;
}

#bottomMenu a:hover,
#bottomMenu a:active {
	color: #fff;
	text-decoration: underline;
}


/* ************************************************************************************************************* */

/* Reusable column setup */
.col {
	border: 0px solid rgba(0,0,0,0);
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-moz-background-clip: padding-box !important;
	-webkit-background-clip: padding-box !important;
	background-clip: padding-box !important;
}

.col {
	margin-left:0%;
	padding:0 1.5%;
}

.col.no-padding {
	padding: 0 !important;
}
    
.row .col:first-child {
	margin-left:0;
}

.row .col .row .col:first-child {
	padding-left:0;
}  

.row .col .row .col:last-child {
	padding-right: 0;
} 



/* ----------------------------------------------------------------------------- 
    
	Column Default Names and Sizes
	
    Span 1:    8.33333333333%
    Span 2:    16.6666666667%
    Span 3:    25.0%
    Span 4:    33.3333333333%
    Span 5:    41.6666666667%
    Span 6:    50.0%
    Span 7:    58.3333333333%
    Span 8:    66.6666666667%
    Span 9:    75.0%
    Span 10:    83.3333333333%
    Span 11:    91.6666666667%
    Span 12:    100%
    
----------------------------------------------------------------------------- */   
    
.span_1 {
	width:100%;
}
.span_2 {
	width:100%;
}
.span_3 {
	width:100%;
}
.span_4 {
	width:100%;
}
.span_5 {
	width:100%;
}
.span_6 {
	width:100%;
}
.span_7 {
	width:100%;
}
.span_8 {
	width:100%;
}
.span_9 {
	width:100%;
}
.span_10 {
	width:100%;
}
.span_11 {
	width:100%;
}
.span_12 {
	margin-left:0;
	width:100%;
}






@media screen and (min-width: 768px)  /* ≥ 768px */
{

	.col {
		margin-left:0%;
		padding:0 1.5%;
	}

	.col.no-padding {
		padding: 0 !important;
	}
        
	.row .col:first-child {
		margin-left:0;
	}    
        
	.span_1 {
		width:8.33333333333%;
	}
	.span_2 {
		width:16.6666666667%;
	}
	.span_3 {
		width:25.0%;
	}
	.span_4 {
		width:33.3333333333%;
	}
	.span_5 {
		width:41.6666666667%;
	}
	.span_6 {
		width:50.0%;
	}
	.span_7 {
		width:58.3333333333%;
	}
	.span_8 {
		width:66.6666666667%;
	}
	.span_9 {
		width:75.0%;
	}
	.span_10 {
		width:83.3333333333%;
	}
	.span_11 {
		width:91.6666666667%;
	}
	.span_12 {
		margin-left:0;
		width:100%;
	}

	.homeContent {
		width: 50%;
		margin: 0 auto;
		text-align: center;
	}

	.homeDescription {
		text-align: center;
		font-size: 8vw;
		color: #fff;
		text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.67);
		margin: -6vw 0 0 0;
		width: 100%;
		background-color: rgba(0,0,0,.4);
	}

	.opening {
		font-family: Montserrat;
		font-weight: 900;
		color: #fff;
		text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
		width: 100%;
		text-align: center;
		font-size: 3vw;
		margin-top: 1vw;
	}

	.address {
		font-family: Montserrat;
		font-weight: 700;
		color: #fff;
		text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
		width: 100%;
		text-align: center;
		font-size: 2vw;
		margin-top: 1vw;
	}


	footer p {
		color: #fff;
		text-align: left;
		font-family: Montserrat;
		font-weight: 600;
		font-size: 1em;
		text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
	}

	#bottomMenu {
		color: #fff;
		text-align: center;
		font-family: Montserrat;
		font-weight: 600;
		font-size: 2em;
		text-shadow: 1px 4px 3px rgba(0, 0, 0, 0.67);
	}

}