.navigationtext:link		{color: #FFF; text-decoration: none;}
.navigationtext:visited	{color: #FFF; text-decoration: none;}
.navigationtext:hover		{color: #2d201b; text-decoration: none;}
.navigationtext:active	{color: #2d201b; text-decoration: none;}

a:link		{color: #FFF; text-decoration: none;}
a:visited	{color: #FFF; text-decoration: none;}
a:hover		{color: #FFF; text-decoration: none;}
a:active	{color: #FFF; text-decoration: none;}

.dotted-link a:link		{border-bottom: 1px dotted #FFF;}
.dotted-link a:visited 	{border-bottom: 1px dotted #FFF;}
.dotted-link a:hover 	{border-bottom: 1px dotted #FFF;}
.dotted-link a:active 	{border-bottom: 1px dotted #FFF;}

html {
	height: 100%;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: 100%;
}

/* Font  boost - Android Chrome */
html * {max-height:1000000px;}


body{
	background-color:#2d201b;
	color:#FFF;
	font-family:arial;
	margin:0;
	padding:0;

}

@media(max-width: 1580px) {
	html {
		font-size: 12.5px;
	}
}
@media(max-width: 980px) {
	html {
		font-size: 10.5px;
	}
}
  
.wrap{
	display: inline-block;
	text-align:center;
	width:100%
}
 
.list-style{
	margin-top:6px;
	margin-bottom:6px;
}

@media screen and (orientation:landscape){
	.list-style{
		margin-left: 6px;
		margin-right: 6px;
	}
}

.headerbox{
	margin-left:auto; 
	margin-right:auto;  
	margin-top:2vh; 
	margin-bottom:2vh; 
	text-align:center; 
	font-size:180%; 
	background-color:rgba(255,255,255,0.3); 
	padding:2vh;
}

@media screen and (max-width: 980px) {
	.headerbox{ display: none; }
}

@media screen and (min-width: 980px)  {
	.mobile-container{ display:none; }
}

.navigationtext{
	margin-left:2em;
	display: inline-block;
	text-transform: uppercase;
	-webkit-transition: color .2s linear;
	-moz-transition: color .2s linear;
	-ms-transition: color .2s linear;
	-o-transition: color .2s linear;
	transition: color .2s linear;
}

.box{
	font-size:200%; 
	line-height: 130%;
	width: 95%; 
	margin-left:auto; 
	margin-right:auto;  
	margin-top:4vh; 
	margin-bottom:4vh; 
	text-align:left; 
	background-color:#000; 
	box-sizing: border-box;
	padding:2vw;
}

@media screen and (orientation: landscape){
	.box{
		width: 75%; 
	}
}

@media screen and (orientation: landscape) and (min-width: 980px){
	.box{
		width: 50%; 
	}
}	


.box-smaller-text{
	font-size:150%; 
}

.box-accordion{
	width:95%;
	margin-left:auto; 
	margin-right:auto;  
	margin-top:4vh; 
	margin-bottom:4vh; 
	text-align:left; 
	box-sizing: border-box;
}

@media screen and (orientation: landscape){
	.box-accordion{
		width: 75%; 
	}
}

@media screen and (orientation: landscape) and (min-width: 980px){
	.box-accordion{
		width: 50%; 
	}
}	

.accordion {
	font-size: 150%;
	color:#FFF;
    background-color: rgba(255,255,255,0.35); 
	cursor: pointer;
	padding-top:3vh;
	padding-bottom:3vh;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	padding-left:2vw;
	padding-right:2vw;
	padding-top:3vh;
	padding-bottom:3vh;
}

.accordion:after {
	content: '+';
	color:#FFF;
	float: right;
	margin-left: 5px;
}

.active:after {
	content: "—";
}

.active, .accordion:hover {
    background-color: #000;
}

.panel {
	font-size:150%;
	line-height: 130%;
	padding-top: 4vh;
	padding-bottom: 8vh;
	padding-left:6vw;
	padding-right:6vw;
	display: none;
	overflow: hidden;
    background-color: #000;
	color:#FFF;
}

.project-testimonial {
	font-size:150%;
	line-height: 130%;
	padding-top: 4vh;
	padding-bottom: 4vh;
	padding-left:6vw;
	padding-right:6vw;
	overflow: hidden;
    background-color: #000;
	color:#FFF;
}


.box-testimonial {
	padding-top: 5vh;
	padding-bottom: 5vh;
	padding-left:2vw;
	padding-right:2vw;
	display: none;
	overflow: hidden;
    background-color: rgba(255,255,255,0.05); 
	color:#FFF;
}

.caption-style-1{
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.caption-style-1 li{
	display: inline-block;
	padding: 0px;
	position: relative;
	overflow: hidden;
}

.caption-style-1 li:hover .caption{
	opacity: 1;
}

.caption-style-1 img{
	padding: 0px;
	margin:0px;
	width:100%;
	float: left;
	z-index: 4;
}

.caption-style-1 .caption{
	position: absolute;
	opacity: 0;
	width:100%;
	-webkit-transition:all 0.45s ease-in-out;
	-moz-transition:all 0.45s ease-in-out;
	-o-transition:all 0.45s ease-in-out;
	-ms-transition:all 0.45s ease-in-out;
	transition:all 0.45s ease-in-out;
}

.caption-style-1 .blur{
	background-color: rgba(255,255,255,0.65);
	width: 100%;
	height: 900px;
	z-index: 5;
	position: absolute;
}

.caption-style-1 .caption-text h1{
	text-transform: uppercase;
	font-size:130%;
	color: #000; 
	text-decoration: underline;
}

.caption-style-1 .caption-text{
	padding: 4px;
	margin:2px;
	z-index: 10;
	color: #000;
	position: relative;
	height: 900px;
	text-align: center;
	top:10vh;
	font-size:200%;
}

@media screen and (orientation: landscape){
	.caption-style-1 img{
		width:calc(48vh + 4.8vw);
	}
	.caption-style-1 .caption{
		width:calc(48vh + 4.8vw);
	}
}

@media screen and (orientation:landscape) and (max-device-width: 980px){
	.caption-style-1 img{
		margin-left:20%;
		width:60%;
	}
	.caption-style-1 .caption{
		left:20%;
		width:60%;
	}
}

.mobile-container {
	width: 95%;
	margin: auto;
	background-color: rgba(255,255,255,0.05);
	color: white;
}

@media screen and (orientation:landscape) and (max-device-width: 980px){
	.mobile-container {
		width:75%;
	}
}

.topnav {
	overflow: hidden;
	position: relative;
}

.topnav #myLinks {
	display: none;
}

.topnav a {
	color: white;
	padding: 14px 16px;
	text-decoration: none;
	font-size: 20px;
	display: block;
}

.topnavactive{
	background-color: rgba(255,255,255,0.10);
	color: white;
	padding: 14px 16px;
	text-decoration: none;
	font-size: 20px;
	display: block;
	height:20px;
}

.topnav a.icon {
	background: rgba(255,255,255,0.00);
	display: block;
	position: absolute;
	right: 0;
	top: 0;
}

.topnav a:hover {
	background-color: #ddd;
	color: black;
}

.active {
	background-color: #000;
	color: white;
}

.project-heading {
	text-transform: uppercase;
	font-family:arial;
	text-align:left;
	font-size:125%; 
	margin-bottom:2vh;
}

.project{
	margin:0; 
	margin-top:4vh; 
	text-align: center;
	width:100%;
	overflow: hidden;
}

.project img{
   margin:0 -20%;
   width:140%;  
}

@media screen and (orientation:landscape){
	.project img{
		margin:0;
		width:75%;
	}
}
@media screen and (orientation:landscape) and (min-width: 980px){
	.project img{
		margin:0;
		width:100%;
		position: relative; 
		width:calc(22vh + 55vw);
	}
}

.project-smaller{
	margin:0; 
	margin-top:4vh; 
	text-align: center;
	width:100%;
	overflow: hidden;
}

.project-smaller img{
	width:100%;
}

@media screen and (orientation:landscape){
	.project-smaller img{
		margin:0;
		width:75%;
	}
}
@media screen and (orientation:landscape) and (min-width: 980px){
	.project-smaller img{
		margin:0;
		width:100%;
		position: relative; 
		width:calc(17.6vh + 44vw);
	}
}

.project-smaller-portrait{
	margin:0; 
	margin-top:4vh; 
	text-align: center;
	width:100%;
	overflow: hidden;
}

.project-smaller-portrait img{
	width:75%;
}

@media screen and (orientation:landscape){
	.project-smaller-portrait img{
		margin:0;
		width:50%;
	}
}
@media screen and (orientation:landscape) and (min-width: 980px){
	.project-smaller-portrait img{
		margin:0;
		width:100%;
		position: relative; 
		width:calc(9.625vh + 24.2vw);
	}
}

.project-links{
	font-size:120%; 
	line-height: 150%;
}