.navbar-outer {
	position: fixed;
	top: 0;
	left: calc((100vw - 1440px)/2);
	width: 100%;
	max-width: 1440px;
	height: 80px;
	margin: 0 auto;
	background-color: rgba(255,255,255,.8);
	z-index: 100;
	//transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
	//transition: all .5s;
	z-index: 500;
}

.navbar-outer.white-nav {
	border-bottom: 1px solid #cacaca;
	max-width: none;
	left: 0;
}

.navbar-outer.white-nav .navbar-inner {
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	border: 0px solid blue;
}

body.contact .navbar-outer {
	position: absolute;
	max-width: none;
	left: 0;
}

@media only screen and (max-width: 1440px)  {
	.navbar-outer {
		left: 0;
	}
}

@media only screen and (max-width: 640px)  {
	.navbar-outer {
		background-color: rgba(255,255,255,.85);
	}
}

.navbar-inner {
	width: 100%;
	height: 100%;
	border: 0 solid red;
	display: flex;
	flex-direction: row;
	align-items: center;
}

body.contact .navbar-inner,
body.bio .navbar-inner {
	max-width: 1440px;
	margin: 0 auto;
}

.navbar-subnav {
	position: fixed;
	top: 80px;
	//left: -50vw;
	//left: calc(((100vw - 1440px)/2) + 65px);
	right: calc(((100vw - 1440px)/2) + 45px);
	width: auto;
	height: 0px;
	border-radius: 0 0 8px 8px;
	border: 0 solid red;
	background-color: rgba(255,255,255,.8);
	display: flex;
	flex-direction: row;
	align-items: center;
	transition: height .1s;
	border-left: 0 solid #f52f28;
	overflow: hidden;
	z-index: 100;
}

.navbar-subnav.activated {
	//left: calc(((100vw - 1440px)/2) + 60px);
	height: 65px;
	transition: all .5s;
	transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}

@media only screen and (max-width: 1440px)  {
	.navbar-subnav {
		//left: 65px;
		right: 45px;
	}
}



@media only screen and (max-width: 640px)  {
	.navbar-subnav {
		position: fixed;
		top: 80px;
		left: -420px;
		left: 2.5vw;
		width: 95vw;
		border-left: 0 solid #f52f28;
		background-color: rgba(255,255,255,.85);
	}

	.navbar-subnav.activated {
	
	}
}


.navbar-title {
 	width: auto;
 	position: absolute;
 	left: 5%;
    font-family: 'centraNo2-thin';
	font-size: 40px;
	line-height: 1;
	font-weight: 200; 
	letter-spacing: -.5px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	min-height: 0vw;
	border: 0 solid green;
	transition: all .5s;
}

a.navbar-homeIcon {
	width: 28px;
	//width: 45px;
	margin: 5px 0 0 4%;
}

a.navbar-homeIcon img {
	width: 100%;
}

.navbar-burger {
	display: flex;
 	width: 40px;
 	height: 30px;
 	margin-top: 3px;
 	gap: 4px;
 	position: absolute;
 	border: 0 solid #000;
 	right: 3%;
 	flex-wrap: wrap;
 	//justify-content: row;
 	cursor: pointer;
	//transition: all .5s;
	opacity: 1;
}

.navbar-outer.white-nav .navbar-burger {
	//position: relative;
}

body.contact .navbar-burger,
body.bio .navbar-burger {
	//position: relative;
}

.navbar-burger.activated {
	//opacity: .5;
}

.navbar-burger div {
 	width: 12px;
 	height: 12px;
 	position: relative;
	background-color: #f52f28;
	transition: all .5s;
}

.navbar-burger:not(.activated):hover div:nth-of-type(1)  {
	//transform: scale(1.5);
	animation: zoomUpDown .5s forwards;
}
.navbar-burger:not(.activated):hover div:nth-of-type(2)  {
	//transform: scale(1.5);
	animation: zoomUpDown .5s forwards;
	animation-delay: .12s;
}
.navbar-burger:not(.activated):hover div:nth-of-type(3)  {
	//transform: scale(1.5);
	animation: zoomUpDown .5s forwards;
	animation-delay: .24s;
}
.navbar-burger:not(.activated):hover div:nth-of-type(4)  {
	//transform: scale(1.5);
	animation: zoomUpDown .5s forwards;
	animation-delay: .36s;
}



@media only screen and (min-width: 1440px)  {
	body.bio .navbar-burger,
	body.contact .navbar-burger,
	body.work-home .navbar-burger {
		right: calc(((100vw - 1440px)/2) + 45px);
	}
}


.bouncing-element:hover {
  transform: scale(1.1); /* Scale up on hover */
  animation: bounceScale 0.6s forwards; /* Apply bounce animation */
}

@keyframes zoomUpDown {
  0% { width: 12px; height: 12px; } /* Start at the scaled-up size */
  50% { width: 15px; height: 15px; } /* Slightly undershoot */
  100% { width: 12px; height: 12px; } /* Return to the final scaled-up size */
}



.navbar-inner ul {
	display: flex;
	position: absolute;
	width: auto;
	right: 5%;
	margin: 0;
	flex-direction: row;
	justify-content: end;
	font-family: 'centraNo2-light';
	font-size: 20px;
	line-height: 1;
	list-style: none;
	border: 0 solid green;
}

.navbar-inner li {
	margin-left: 12%;
	text-align: right;
	white-space: nowrap;
	transition: font-size .5s;
	//transition: border-bottom .2s;
	cursor: pointer;
	border-bottom: 1px solid rgba(0,0,0,0)
}

.navbar-subnav.white-nav {
	border-right: 1px solid #cacaca;
	border-bottom: 1px solid #cacaca;
	border-left: 1px solid #cacaca;
}


.navbar-subnav ul {
	display: flex;
	width: auto;
	margin: 0;
	flex-direction: row;
	justify-content: center;
	font-family: 'centraNo2-lightitalic';
	font-style: italic;
	font-size: 17px;
	line-height: 1;
	list-style: none;
	padding: 0 20px;
	border: 0 solid green;
}

.navbar-subnav ul a {
	text-decoration: none;
	color: unset;
	z-index: 10;
}

.navbar-subnav li {
	text-align: center;
	white-space: nowrap;
	margin: 0 0;
	padding: 4px 25px;
	transition: font-size .5s;
	transition: border-bottom .2s;
	cursor: pointer;
	border: 0 solid red;
	//border-bottom: 1px solid rgba(0,0,0,0);
}

.navbar-inner li:hover,
.navbar-subnav li:hover  {
	//border-bottom: 1px solid rgba(0,0,0,1)
}

@media only screen and (min-width: 641px)  {
	.navbar-subnav ul a:nth-of-type(1):hover ~ .navbar_bg_rollover_slider  {
		left: 33px;
		width: 145px;
		opacity: 1;
		transition-delay: 0s, 0s, 0s;
	}
	.navbar-subnav ul a:nth-of-type(2):hover ~ .navbar_bg_rollover_slider  {
		left: 205px;
		width: 86px;
		opacity: 1;
		transition-delay: 0s, 0s, 0s;
	}
	.navbar-subnav ul a:nth-of-type(3):hover ~ .navbar_bg_rollover_slider  {
		left: 323px;
		width: 116px;
		opacity: 1;
		transition-delay: 0s, 0s, 0s;
	}
}

.navbar-subnav ul a.active {
	opacity: .5;
	pointer-events: none;
}

.navbar_bg_rollover_slider {
	position: absolute;
	background-color: rgba(255,255,255,.75);
	width: 33%;
	height: 25px;
	top: 20px;
	left: 0px;
	z-index: 5;
	border-radius: 7px;
	pointer-events: none;
	transition: all .5s;
	transition: opacity 0.25s, width .5s, left .5s;
	transition-delay: 0s, .5s, .5s;
	opacity: 0;
}

body.contact .navbar_bg_rollover_slider {
	background-color: rgba(222,222,222,.5);
}

.navbar-subnav.white-nav .navbar_bg_rollover_slider,
.navbar-subnav.dark-slider .navbar_bg_rollover_slider {
	background-color: rgba(222,222,222,.5);
}


@media only screen and (max-width: 640px)  {
	.navbar-subnav ul {
		width: 100%;
		font-size: 15px;
		padding: 0 4%;
		display: flex;
		justify-content: space-between;
	}
	.navbar-subnav li {
		margin: 0 0 0 0;
		padding: 4px 0;
	}
	
	.navbar-outer.white-nav {
		border-bottom: 0 solid #cacaca;
	}
	
	.navbar-subnav.white-nav {
		border-right: 0 solid #cacaca;
		border-bottom: 0px solid #cacaca;
		border-left: 0 solid #cacaca;
	}
	
	.navbar-burger {
		right: 4px;
	}
}


.bottom_nav_container {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	background-color: #fff;
	width: 90%;
	max-width: 1350px;
	margin: 0px auto 60px;
	padding-top: 30px;
	font-family: centraNo2-extrabold, sans-serif;
	font-size: 16px;
	transition: opacity .2s;
    -webkit-backface-visibility: hidden;
    -webkit-transform:translate3d(0,0,0);
}

@media only screen and (max-width: 640px)  {
	.bottom_nav_container {
	  width: 95%;
	  padding-top: 15px;
	  margin: 0px auto 30px;
	}
}

.bottom_nav_container a.bottom_nav-prev {
	position: relative;
	padding: 10px 10px 10px 0;
	left: 0;
	text-decoration: none;
	color: #000;
}

.bottom_nav_container a.bottom_nav-next {
	position: relative;
	right: 0;
	padding: 10px 0px 10px 10px;
	text-decoration: none;
	color: #000;
}

.bottom_nav-caret {
	font-family: centraNo2-light, sans-serif;
	color: #666;
	font-weight: 300;
	position: relative;
    vertical-align: top;
    top: .1em;
}

@media only screen and (min-width: 769px)  {
    a.bottom_nav-next:hover,
    a.bottom_nav-prev:hover {
        opacity: .6;
    }

}



.workTitleScroller_outer {
  max-width: 50%;
  height: auto;
  border: 0 solid red;
  margin: 0 auto;
  overflow: hidden;
  margin-left: calc(21% - 28px);
  animation: marqueexx 10s linear infinite;
}

@media only screen and (max-width: 640px)  {
	.workTitleScroller_outer {
	  max-width: 68%;
	  //margin-right: 7.5%;
	  margin-left: calc(13% - 35px);
	  border: 0 solid red;
	}
	
	.navbar-burger {
		//left: 12%;
	}
	
	a.navbar-homeIcon {
		//margin: 3px 0 0 15px;
		width: 30px;
		margin: 7px 0 0 4%;
	}
	
}

.workTitleScroller_inner {
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
  
}

.workTitleScroller_inner p {
  display: inline-block;
  font-family: 'centraNo2-thin';
  align-items: center;
  justify-content: center;
  font-size: 30px;
  line-height: 1.3;
  margin: 0;
}

@keyframes marquee {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-50%, 0, 0);
  }
}


.animated-text-strip {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  overflow: hidden;
}
.animated-text-strip p {
  white-space: nowrap;
  animation: marquee2 10s linear infinite;
  max-width: none;
  font-family: 'centraNo2-thin';
  font-size: 30px;
  line-height: 1;
}

.white-nav .animated-text-strip p {
  animation: marquee2 5s linear infinite;
}


body.contact .animated-text-strip p {
  animation: marquee2 4s linear infinite;
}

.animated-text-strip.faster p {
  animation: marquee2 5s linear infinite;
}



@media only screen and (max-width: 640px)  {
	.animated-text-strip p {
		  font-size: 22px;
		}

}

@keyframes marquee2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-100%, 0);
  }
}