@media(max-width:350px){

	#title .tagline {
		display:none;
	}
}

@media (max-width: 479.98px) {
#title h1, #title .tagline {
		text-align:left;
	}
	#title h1 {
		padding-left:0.2em;
	}
	#title .tagline {
		margin-top:0;
	}
	#title .tagline a span {
		padding-top:0.3em;
		padding-bottom:0.15em;
	}
	#title .tagline a span::before {
		padding-top:0.3em;
		padding-bottom:0.15em;
	}
}

@media (max-width: 991.98px) {
	#work .fp-tableCell{
		 vertical-align: top;
	}

	#work .slide {
		--overlay-bottom: 16px;
	}
	#work .slider-nav {
		top:auto !important;
		bottom:0;
		width:100% !important;
		height:var(--work-nav-h) !important;
	}
	#work .slider-nav .button-wrapper {
		width:50%;
		height: var(--work-nav-h) !important;
		background: rgba(239, 164, 32, 0.9);
	}
	#work .slider-nav .button-wrapper:hover, #work .slider-nav .button-wrapper:focus {
		background: rgba(239, 164, 32, 1);
	}

	#work .slider-nav .button-wrapper[aria-disabled="true"]:hover,
	#work .slider-nav .button-wrapper[aria-disabled="true"]:focus {
		background: rgba(239, 164, 32, 0.9);
	}
	#work .slider-nav .button-wrapper:first-of-type {
		float:right;
		border-left:1px solid #021d30;
	}
	#work .slider-nav .button-wrapper .curtain {
		display:none;
	}
	#work .slider-nav .arrow-prev {
		border-left:2px solid #021d30;
		border-bottom:2px solid #021d30;
	}
	#work .slider-nav .arrow-next {
		border-right:2px solid #021d30;
		border-bottom:2px solid #021d30;
		top:18px;
					left:50%;
					margin-left:-7px;
					height:15px;
					width:15px;

	}
	#work .slider-nav .arrow-prev {
		top:18px;
					left:50%;
					margin-left:-7px;
					height:15px;
					width:15px;
	}

	.showcase {
		margin-top:15px;
		margin-bottom:25px;
	}
	#work .content-area > * {
		display: block;
		max-width:500px;
		margin-left:auto;
		margin-right:auto;
	}
	.port-iphone {
		right:15px;
	}
}
@media(max-height:320px){
	#mainnav .button-wrapper {
		height: 25%;
	}
	#photo .slider-nav {
		height:50%;
		top:25%;
		margin:0;
	}
	#photo .slider-nav .button-wrapper {
		height:50%;
	}

}
@media(max-height:400px){
#menu-container ul li a {
	font-size: 1.8em;
	line-height:1.8em;
    letter-spacing: 0.2em;
}

}
@media(max-height:550px){
#portrait {
	display:none;
}
#title .tagline {
		display:none;
	}
textarea.form-control {
	height:150px;
}

}

#photo.photo-nav-bottom .slide {
	height: calc(100% - var(--photo-nav-h));
}

#photo.photo-nav-bottom .nav-side-bar {
	display:none;
}

#photo.photo-nav-bottom .slider-nav {
	top:auto;
	bottom:0;
	left:0;
	right:var(--photo-nav-h);
	width:auto;
	height:var(--photo-nav-h);
	margin-top:0;
}
#photo.photo-nav-bottom .slider-nav .button-wrapper {
	position:relative;
	float:left;
	width:50%;
	height:var(--photo-nav-h);
	background: rgba(239, 164, 32, 0.9);
}
#photo.photo-nav-bottom .slider-nav .button-wrapper:hover,
#photo.photo-nav-bottom .slider-nav .button-wrapper:focus {
	background: rgba(239, 164, 32, 1);
}
#photo.photo-nav-bottom .slider-nav .button-wrapper[aria-disabled="true"]:hover,
#photo.photo-nav-bottom .slider-nav .button-wrapper[aria-disabled="true"]:focus {
	background: rgba(239, 164, 32, 0.9);
}

#photo.photo-nav-bottom .slider-nav .button-wrapper:first-of-type {
	float:right;
	border-left:1px solid #021d30;
}

#photo.photo-nav-bottom .slider-nav .button-wrapper .curtain {
	display:none;
}

#photo.photo-nav-bottom .slider-nav .arrow-next {
	border-right:2px solid #021d30;
	border-bottom:2px solid #021d30;
}
#photo.photo-nav-bottom .slider-nav .arrow-prev {
	border-left:2px solid #021d30;
	border-bottom:2px solid #021d30;
}
#photo.photo-nav-bottom .slider-nav .arrow-next,
#photo.photo-nav-bottom .slider-nav .arrow-prev {
	top:18px;
	left:50%;
	margin-left:-7px;
	height:15px;
	width:15px;
}

#photo.photo-nav-bottom .button-photo-menu {
	top:auto;
	bottom:0;
	right:0;
	width:var(--photo-nav-h);
	height:var(--photo-nav-h);
	background: rgba(239, 164, 32, 0.9);
	border-left:1px solid #021d30;
}
#photo.photo-nav-bottom .button-photo-menu:hover,
#photo.photo-nav-bottom .button-photo-menu:focus {
	background: rgba(239, 164, 32, 1);
}
#photo.photo-nav-bottom .button-photo-menu .curtain {
	display:none;
}

#photo.photo-nav-bottom .button-photo-menu .window {
	top:calc((var(--photo-nav-h) - 22px) / 2);
	left:calc((var(--photo-nav-h) - 30px) / 2);
}
#photo.photo-nav-bottom .button-photo-menu .window span,
#photo.photo-nav-bottom .button-photo-menu:hover .window span {
	background:#021d30;
}

@media (max-width: 479.98px) {
  #info h2 {
    margin-top: 0;
  }

  #info .header-circle {
    margin-bottom: 4px;
  }

  #info .call-to-action {
    margin-top: 8px;
  }
}