html body {
	font-family: 'Roboto Condensed', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese', Arial, Helvetica, sans-serif !important;
	font-size: 16px;
}
body, html {
	height: 100%;
	padding: 0;
	margin: 0;
}
body {
	position: relative; /* for scrollspy */
}
header {
	height: 0;
}

/* overwrite bootstrap */
.container-fluid {
	padding-left: 0;
	padding-right: 0;
}
ul, ol {
	margin-bottom: 0;
	margin-left: 0;
	padding-left: 0;
}
button:focus, button:active, button:hover { /*remove the button hover blue outline */
	outline: 0px !important;
	-webkit-appearance: none;
	appearance: none;
}
nav.navbar.affix-bottom {
	position: absolute;
	top: 0;
}
.nav>li>a {
	padding-bottom: 0;
}
/* links and hover effects */
a {
	color: rgba(0,0,0,0.7);
	background: transparent;
	border-bottom: dotted 1px;
	outline: none;
	-o-transition: color .2s ease-out, background .5s ease-in;
	-ms-transition: color .2s ease-out, background .5s ease-in;
	-moz-transition: color .2s ease-out, background .5s ease-in;
	-webkit-transition: color .2s ease-out, background .5s ease-in;
	transition: color .2s ease-out, background .5s ease-in;
}
a:link, a:visited {
	border-bottom: dotted 1px;
	text-decoration: none;
	color: rgba(0,0,0,0.7);
}
a:active, a:hover {
	border-bottom: dotted 1px;
	text-decoration: none;
	color: rgba(255,165,0,1);
	background: transparent;
}
section#about a:active, section#about a:hover {
	border-bottom: dotted 1px;
	text-decoration: none;
	color: rgba(255,125,0,1);
	background: transparent;
}

#main_img ul#carousel li a, #main_img ul#carousel li a:active, #main_img ul#carousel li a:hover,
.navbar-nav li a:active, .navbar-nav li a:hover,
.underline a:link, .underline a:active, .underline a:hover, .underline a:visited,
.button_div a,
a.navbar-brand  {
	border: none;
	text-decoration: none;
	background: transparent;
}
.button_div a button.btn:active, .button_div a button.btn:hover,
.button_div button.btn:active, .button_div button.btn:hover {
	color: rgba(0,0,0,0.5);
	background: rgba(255,165, 0, 0.5);

	-o-transition: color .5s ease-in-out, background .1s ease-in-out;
	-ms-transition: color .5s ease-in-out, background .1s ease-in-out;
	-moz-transition: color .5s ease-in-out, background .1s ease-in-out;
	-webkit-transition: color .5s ease-in-out, background .1s ease-in-out;
	transition: color .5s ease-in-out, background .1s ease-in-out;
}
div#about_button.button_div a, div#about_button.button_div a {
	border: none;
	text-decoration: none;
}
#about_button.button_div a button.btn:active, #about_button.button_div a button.btn:hover,
 #about_button.button_div button.btn:active, #about_button.button_div button.btn:hover {
	color: rgba(0,0,0,0.5);
	background: rgba(255,165, 0, 1.0);

	-o-transition: color .5s ease-in-out, background .1s ease-in-out;
	-ms-transition: color .5s ease-in-out, background .1s ease-in-out;
	-moz-transition: color .5s ease-in-out, background .1s ease-in-out;
	-webkit-transition: color .5s ease-in-out, background .1s ease-in-out;
	transition: color .5s ease-in-out, background .1s ease-in-out;
}

/* colors and spacings*/
.black-10 {
	color:rgba(0,0,0,0.5);
}
.black-50 {
	color:rgba(0,0,0,0.5);
}
.white-fg {
	color:rgba(255,255,255,1.0);
}
.emerald-fg {
	color:rgba(41,183,151,1.0);
}
.emerald-50 {
	color:rgba(41,183,151,0.5);
}
.orange-fg {
	color: rgba(255,165,0,1.0)
}
.orange-bg {
	background: rgba(255,165,0,0.25)
}

.padding-top {
	padding-top: 2em;
}
.padding-topx2 {
	margin-top: 4em;
}
.padding-bottom {
	padding-bottom: 2em;
}
.padding-left {
	padding-left: 2em;
}
.padding-right {
	padding-right: 2em;
}
.padding-rightxhalf {
	padding-right: 1em;
}
.margin-top {
	margin-top: 4em;
}
.margin-bottom {
	margin-bottom: 4em;
}
.margin-bottomxhalf {
	margin-bottom: 1em;
}
.remove-margin-top {
	 margin-top: 0;
}

/* nav */
#logo {
	height: 20px;
	padding-bottom: 0;
}

.navbar {
	border: none;
}
.navigation {
	height:100px;
	background:rgba(255, 255, 255, 0);
	border-bottom: rgba(0,0,0,0) 1px solid;
}
.navigation .container {
	padding-top:1em;
}
.nav {
	border: none;
	text-transform: uppercase;
	background:transparent;
	background-color: transparent;
	padding: auto 2em; /* spacing between nav items */
	line-height: 1em;
}
.nav li a:active, .nav li a:hover {
	background-color:rgba(0,0,0,0);
}
.nav li.active a {
	background-color:rgba(0,0,0,0);
	color: rgba(255,165,0,1.0)
}
.underline {
	margin: 0 auto;
	position: inline-block;
}
.underline a::after, a.underline::after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 4px;
	background: rgba(255,165,0,0.75);
	content: '';
	opacity: 0;

	-o-transition: opacity 0.3s, -o-transform 0.3s;
	-ms-transition: opacity 0.3s, -ms-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;

	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
}
.underline a:hover::after, .underline a:focus::after {
	opacity: 1;

	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}
a#currentpage {
	color: rgba(255, 165, 0, 1);
}

/* for sticky */
.navScroll{
	height:80px;
	background:rgba(255, 255, 255, 0.9);
	border-bottom: rgba(0,0,0,0.1) 1px solid;

	-o-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}
#sticky {
	width: 100%;
	z-index: 999;
}

/*FONT - based off of 1.5 em from p line height*/
h1 {
	font-size: 2em;
	line-height: 1em;
	padding-top: 2em;
	padding-bottom: 0;
	margin: 0;
	font-weight: 700;
	text-align: left;
	text-transform: uppercase;
}
h1 img {
	text-align: left;
	padding-bottom: 0;
	margin: 0;
	max-width: 60%;
	}
h2 {
	font-size: 1.5em;
	line-height: 1em;
	font-weight: 300;
	text-align: left;
	padding-top: 1em;
	padding-bottom: 2em;
	margin: 0;
}
h3 {
	font-size: 1.5em;
	line-height: 1em;
	font-weight: 300;
	font-style: italic;
	text-align: left;
	padding-top: 0;
	padding-bottom: 1em;
	margin: 0;
}
h4 {
	font-size: 1.25em;
	line-height: 1em;
	padding-top: 1.66em;
	padding-bottom:0.83em;
	margin: 0;
	font-weight: 300;
}
p {
	font-size: 1em;
	line-height: 1.5em;
	padding-top: 0;
	padding-bottom:1em;
	margin: 0;
	font-weight: 300;
}
.navbar-nav li a {
	font-size: 1em;
	padding-left: 0;
	padding-right: 0;
	margin-left: 1.75em;
	margin-right: 1.75em;
}
.navbar-nav li a.float-right {
	margin-right: 0;
}
.jp-container {
	position: relative;
}
.jp-container div.jp {
	font-size: 0.85em;
	vertical-align: bottom;
}
#lang-option {
	text-transform: uppercase;
	cursor: pointer;
}
	#lang-option .en{
		font-weight: 700;
	}
	#lang-option .jp {
		font-weight: 300;
	}
#lang-text {
	margin: 0;
	padding: 0;
	float: left;
	display: flex;
	flex-direction: column;
	width: 100%;
}
#lang-text > *:not(.button_div) {
	top: 0;

	-o-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
}
#lang-text .en {
	opacity: 1.0;
	width: 100%;
}
#lang-text .jp {
	opacity: 0.0;
	display: none;
	width: 100%;
}
img {
	padding-bottom: 2em;
	display: block;
}

.embed-responsive.embed-responsive-16by9, .embed-responsive.embed-responsive-4by3 {
	margin-bottom: 2em;
	position: relative;

}
#project .container img {
	padding: 1em auto;
}
	#project section {
		margin: 4em auto;
		background: rgba(0,0,0,0.1);
	}
	#project section.container-fluid .container {
		margin: 4em auto;
	}


.gfy > img, .gfy > div {
	width: 100%;
}

.hideGfycatBar{
	position:absolute;
	bottom: 0;
	left:0;
	width:100%;
	height:40px;
	background-color: white;
}

/* index page */
#scroll-arrow-container {
	position: absolute;
	top: 65%;
	width: 100%;
}
#project #main_img #scroll-arrow-container {
	position: absolute;
	top: 80%;
}
#scroll-arrow {
	font-size: 100px;
	position: absolute;
	/* for center positioning */
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	padding: 0;
	text-align: center;
}
#about {
	background: #ffd07f; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffd07f 0%, #ffb83f 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffd07f), color-stop(100%,#ffb83f)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffd07f 0%,#ffb83f 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffd07f 0%,#ffb83f 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffd07f 0%,#ffb83f 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffd07f 0%,#ffb83f 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd07f', endColorstr='#ffb83f',GradientType=0 ); /* IE6-9 */
}
#about div h1, #awards h1 {
	text-align: center;
	margin-bottom: 1em;
	margin-top: 0;
}
h1#about-title {
	margin-top: 0;
	padding-top: 0;
	margin-bottom: 1em;
	font-weight: 700;
	text-transform: uppercase;
	text-align: left;
}
	.x {
		text-transform: lowercase;
		vertical-align: 10%;
	}
	h1#about-title .subtitle {
		font-weight:100;
	}
#awards p {
	text-align: left;
	padding-bottom: 1em;
}
#bio {
	padding-top: 8em;
}
#jp_bio {
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese'
}
#bio h2 {
	padding-top: 2em;
	padding-bottom: 1em;
	display: inline-block;
}
#bio ul {
	display: flex;
	flex-direction: column;
}
#bio ul:last-child {
		margin-bottom: 4em;
}
#bio ul li {
	list-style-type: none;
}
#bio ul li * {
	padding-left: 0;
	padding-right: 0;
}
.small p {
	color: rgba(0,0,0,0.7);
	padding-bottom: 0em;
}
.contact {
	padding-left: 1em;
}
.clear {
	clear:both;
}

/* index */
.tagline {
	position: absolute;
	left: 0;
	right:0;
	top: 45%;
	text-align: center;
	font-size: 2em;
}
.index_images img {
	display: inline-block;
	position: relative;
	z-index: 2;
	padding: 0;
}
.index_images div {
		vertical-align: middle;
}
.image_title {
	z-index: 1;
	color: rgba(0,0,0,0.5);
	font-weight: 700;
	-moz-transform: translate(-100%, 0);
	transform: translate(-100%, 0);
}
.index_images a:link, .index_images a:visited {
	text-decoration: none;
	border: 0;
}
.index_images a:hover, .index_images a:active, span .subtitle a:hover, span .subtitle a:active {
	text-decoration: none;
	border: 0;
	background: transparent;
	color: rgba(0,0,0,0.5);
}
.category {
	font-weight: 500;
	position: absolute;
	padding: 0.5em 1em 0.5em 0em;
	height: 37px; /* so the border will be covered too */
	top:190px;
	opacity: 0;
	left: -30%;
	color: rgba(0,0,0,0.7);
	background: rgba(255,255,255,1);

	-o-transition: all .6s ease-out;
	-ms-transition: all .6s ease-out;
	-moz-transition: all .6s ease-out;
	-webkit-transition: all .6s ease-out;
	transition: all .6s ease-out;
}
.item:hover .category {
	opacity: 1;
	left:0;
	z-index:3;
}
.scroll_main {
	position: relative;
	top: -40px;
	bottom: 0;
	max-width: 10%;
	padding: 0;
}
.isotope {
	margin: 0 auto;
}

#filters ul {
	margin-top: 4em;
	margin-bottom: 4em;
	padding-left: 0;
	text-align:center;
}
#filters ul li {
	display: inline-block;
	margin: 0 auto;
	text-align: center;
}
#filters ul li button {
	border-radius: 6px;
	border: 3px solid white;
	outline: none;
	cursor: pointer;
	margin: 0;
	padding: 0.3em 1em 0.2em 1em;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 1em;
	line-height: 1.5em;
	color: rgba(0,0,0,0.7);
	background: transparent;
}
#filters ul li button:hover, #filters ul li button:active {
	color: rgba(255,255,255,1);

	-o-transition: color 0.2s ease-in-out 0.2s;
	-ms-transition: color 0.2s ease-in-out 0.2s;
	-moz-transition: color 0.2s ease-in-out 0.2s;
	-webkit-transition: color 0.2s ease-in-out 0.2s;
	transition: color 0.2s ease-in-out 0.2s;
}
#filters ul li button:after {
	width: 100%;
	height: 0;
	bottom: 0;
	left: 0;

	-o-transition: height 0.3s ease-in-out;
	-ms-transition: height 0.3s ease-in-out;
	-moz-transition: height 0.3s ease-in-out;
	-webkit-transition: height 0.3s ease-in-out;
	transition: height 0.3s ease-in-out;
}
#filters ul li button:hover:after {
	height: 100%;
	background: rgba(255,165,0,0.5);
}

/* uwg */
#rotating-item-wrapper {
	position: relative;
	padding-left: 0;
	padding-right: 0;
}
.rotating-item {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}
/* aff */
.quotes {
	padding-top: 2em;
	padding-bottom: 1em;
	margin-left: 0;
}
.quote-text {
	font-style: italic;
	padding-bottom: 2em;
}
/*space robot page */
#spaceRobot .tint {
	overflow: hidden;
	float: left;
	margin: 0 20px 20px 0;
}
#spaceRobot img:hover {
	filter: saturate(300%);
	-webkit-filter: saturate(300%);
	-moz-filter: saturate(300%);
	-o-filter: saturate(300%);
	-ms-filter: saturate(300%);

	-o-transition: all 0.3s, -o-transform 0.3s;
	-ms-transition: all 0.3s, -ms-transform 0.3s;
	-moz-transition: all 0.3s, -moz-transform 0.3s;
	-webkit-transition: all 0.3s, -webkit-transform 0.3s;
	transition: all 0.3s, transform 0.3s;
}
#spaceRobot img {
	width: 100%;
	padding-bottom: 0;
}
#spaceRobot div.row .button_div {
	margin-top: 0;
	margin-bottom: 2em;
}
/*umc website */
.mediumContainer {
	width: 900px;
}
/*ISOTOPE*/
.item {
	width: 300px;
	height: 300px;
	overflow: hidden;
}

/*BUTTONS */
.btn {
	border: 3px solid rgba(0,0,0,0.3);
	font-family: inherit;
	font-size: inherit;
	color: rgba(0,0,0,0.3);
	background: none;
	cursor: pointer;
	padding: 1.5em 2em;
	margin-top: 1em;
	margin-bottom: 2em;
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	outline: none;
	position: relative;
	white-space:normal !important;
	width: 100%;
	max-width: 450px;
	border-radius: 6px;

	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.btn:after {
	content: '';
	position: absolute;
	z-index: -1;

	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.btn:before {
	/* speak: none; */
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	position: relative;

	-webkit-font-smoothing: antialiased;
}
.button_div {
	margin-top: 4em;
	text-align: center;
}
.button_div a button  {
	margin: 0;
	padding: auto;
}
.button_detail {
	text-align: center;
	margin-top: 0.5em;
	color: rgba(0,0,0,0.7);
}
.about_button {
	margin-top: 0;
}

/*BUTTON FOR PROJECTS */
.related {
	font-weight:500;
}

/*project page */
#abstract p span.role {
	color: rgba(0,0,0,.5);
	font-weight: 500;
	display: block;
	font-size: 0.85em;
}
#details p span.role {
	color: rgba(255,165,0,1);
	font-weight: 500;
	display: block;
	font-size: 0.85em;
}
.image_caption_heading {
	padding-bottom: 0;
	margin-bottom: 0;
	font-weight: 700;
	color: rgba(0, 0, 0, 0.5);
}
/* blog */
#blog {
	padding-top: 6em; /* top is + 2em on the first one */
}
#blog-text div {
	margin-top: 2em;
}
#blog-text div h1 {
	padding-top: 4em;
	border-top: dotted rgba(0,0,0,0.3) 1px;
	line-height: 1.25em;
	text-transform: none;
}
#blog-list {
	padding-top: 2em;
}
/* footer */
#footer-left {
	/* display: inline-block; */ /* 2023.11.07: Conflicts with float */
	float: left !important;
}
div#footer-connect.black-50{
	/* display: inline-block; */ /* 2023.11.07: Conflicts with float */
	float: right !important; /* so as not to be overwritten by col-md-6 */
}
.issuu {
	position: absolute;
	margin: auto;
	top: 7px;
	left: 8px;
	width: 16px;
}
/* images*/
img.tag-below {
	padding-bottom: 0;
}
.tag {
	padding-bottom: 2em;
	text-align: left;
	font-style: italic;
	color: rgba(0,0,0,0.5);
	width: 100%;
}

#project #main_img {
	height: 800px;
	width: 100%;
	max-height: 100%;
	max-width: 100%;
	position: relative;
	margin:auto;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center top;

	background-color: transparent;
	background-blend-mode: none;

	-o-background-size: 100% auto;
	-webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	background-size: 100% auto;
}
#main_img #carousel {
	height: 800px;
	width: 100%;
	position: relative;
	margin:auto;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center top;
	color:rgba(255, 255, 255, 0.9);
}
#carousel li {
	height: 800px;
	width: 100%;
	max-height: 100%;
	max-width: 100%;
	margin:auto;

	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center top;

	-o-background-size: 100% auto;
	-webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	background-size: 100% auto;

	position: absolute;
	opacity: 0;

	-webkit-animation: webkit-imageCarousel 20s linear infinite 0s;
	-moz-animation: moz-imageCarousel 20s linear infinite 0s;
	-o-animation: o-imageCarousel 20s linear infinite 0s;
	animation: imageCarousel 20s linear infinite 0s;
}

#carousel li:nth-child(1) {
	background-image: url('../../images/projects/index/carousel/bloom_installation.jpg?v=1.3');
}
#carousel li:nth-child(2) {
	background-image: url('../../images/projects/index/carousel/digiPop_abstract.jpg?v=1.1');

	-webkit-animation-delay: 5s;
	-moz-animation-delay: 5s;
	-o-animation-delay: 5s;
	animation-delay: 5s;
}
#carousel li:nth-child(3) {
	background-image: url('../../images/projects/index/carousel/swing_time_northwest2.jpg');

	-webkit-animation-delay: 10s;
	-moz-animation-delay: 10s;
	-o-animation-delay: 10s;
	animation-delay: 10s;
}
#carousel li:nth-child(4) {
	background-image: url('../../images/projects/index/carousel/diffusion_choir_3f.jpg');

	-webkit-animation-delay: 15s;
	-moz-animation-delay: 15s;
	-o-animation-delay: 15s;
	animation-delay: 15s;
}

/* Animation for the slideshow images */
@keyframes webkit-imageCarousel {
	0% { opacity: 0; animation-timing-function: ease-in-out; }
	3% { opacity: 1; animation-timing-function: ease-in-out; }
	28% { opacity: 1 }
	31% { opacity: 0 }
}

@keyframes moz-imageCarousel {
	0% { opacity: 0; animation-timing-function: ease-in-out; }
	3% { opacity: 1; animation-timing-function: ease-in-out; }
	28% { opacity: 1 }
	31% { opacity: 0 }
}

@keyframes o-imageCarousel {
	0% { opacity: 0; animation-timing-function: ease-in-out; }
	3% { opacity: 1; animation-timing-function: ease-in-out; }
	28% { opacity: 1 }
	31% { opacity: 0 }
}

@keyframes imageCarousel {
	0% { opacity: 0; animation-timing-function: ease-in-out; }
	3% { opacity: 1; animation-timing-function: ease-in-out; }
	28% { opacity: 1 }
	31% { opacity: 0 }
}

.no-cssanimations #main_img ul#carousel li {
	opacity: 1;
}

.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
  }


/* responsiveness */
/* mobile portrait + landscape */
@media (max-width: 500px) {
	#main_link #main_img {
		height: 500px;
		max-height: 767px;
		max-width: 767px;
		top: 50px;
	}
	#main_img #carousel {
		height: 500px;
		max-height: 767px;
		max-width: 767px;
	}
	#main_img #carousel li {
		background-position: center 50px;
	}
	#project #main_img {
		height: 500px;
		width: 100%;
		max-height: 100%;
		max-width: 100%;
		position: relative;
		margin:auto;
		background-repeat: no-repeat;
		background-attachment: fixed;
		color:rgba(255, 255, 255, 0.9);
		top: 0;
		background-position: center 50px;

		background-color: transparent;
		background-blend-mode: none;

		-o-background-size: 100% auto;
		background-size: 100% auto;
		-moz-background-size: 100% auto;
		background-size: 100% auto;
	}
	#project #main_img #scroll-arrow-container {
		position: absolute;
		top: 70%;
	}
}
@media (max-width: 767px) {
	#main_img {
		height: 500px;
		max-height: 767px;
		max-width: 767px;
	}
	.tagline {
		font-size: 1em;
		top: 45%;
	}
	#scroll-arrow-container {
		position: absolute;
		top: 65%;
	}
	#project #scroll-arrow-container {
		top: 70%;
	}
	#scroll-arrow {
		width: 10%;
	}
	#filters.button-group {
		margin-top: 2em;
		margin-bottom: 2em;
		text-align:center;
		font-size: 0.75em;
		color: white;
	}
	#footer-left {
		display: block;
	}
	div#footer-connect.black-50 {
		display: block;
		margin-top: 1em;
		float: left !important;
	}

	/*nav */
	a.navbar-brand {
		padding-left: 0;
		padding-right: 5px;
	}
	#logo {
		height: 10px;
		padding-bottom: 0;
	}
	div.navigation {
		height: 50px;
		background-color: rgba(255,255,255,0.9);
		border-bottom: rgba(0,0,0,0.1) 1px solid;
	}
	.navigation .container {
		padding-top: 0.5em;
	}
	ul.nav.navbar-nav.underline.navbar-right>li {
		display: inline-block;
		font-size: 0.82em;
	}
	.nav.navbar-nav.underline.navbar-right>li a {
		padding: 0;
		margin: 0 .5em;
	}
	.nav.navbar-nav.underline.navbar-right>li a.float-right {
		margin-right: 0;
	}
	#sticky {
		background-color:transparent;
	}
	.nav {
		line-height: 2.67em;
	}
	.nav li a {
		font-size: 0.75em;
		padding: 0;
		margin: 0;
	}
	.navbar-right {
		float: right;
	}
	#blog {
		padding-top: 2em;
	}
	#blog-list:first-child a p {
		margin-top: 4em;
	}
	.blog-dates {
		padding-bottom: 0;
	}
}
/* up to ipad tablet portrait */
@media (min-width:768px) and (max-width:1023px) {
	#main_img {
		height: 500px;
		width: 100%;
		max-width: 100%;
	}
	.tagline {
		font-size: 1.5em;
		top: 45%;
	}
	#scroll-arrow-container {
		top: 65%;
	}
	#project #scroll-arrow-container {
		position: absolute;
		top: 80%;
	}
	#scroll-arrow {
		width: 10%;
	}
	#filters.button-group {
		margin-top: 4em;
		margin-bottom: 4em;
		text-align: left;
		font-size: 0.75em;
		color: white;
	}
}
@media (min-width:1024px) {
	#scroll-arrow {
		max-width: 5%;
	}
	/* project */
	#abstract {
		padding-right: 4em;
	}
	/* vertically center align */
	/* swingtime */
	.img-responsive.adjustImageTop {
		transform: translateY(25%);
	}
}