/* Boden.Ag styles */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Font faces ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@font-face {
	font-family: "GothamLight";
	src: url("../fonts/gotham/gotham-light-webfont.eot");
	src: url("../fonts/gotham/gotham-light-webfont.eot?#iefix") format("embedded-opentype"),
		 url("../fonts/gotham/gotham-light-webfont.woff2") format("woff2"),
		 url("../fonts/gotham/gotham-light-webfont.woff") format("woff"),
		 url("../fonts/gotham/gotham-light-webfont.ttf") format("truetype"),
		 url("../fonts/gotham/gotham-light-webfont.svg#gotham_lightregular") format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "GothamBold";
	src: url("../fonts/gotham/gotham-bold-webfont.eot");
	src: url("../fonts/gotham/gotham-bold-webfont.eot?#iefix") format("embedded-opentype"),
		 url("../fonts/gotham/gotham-bold-webfont.woff2") format("woff2"),
		 url("../fonts/gotham/gotham-bold-webfont.woff") format("woff"),
		 url("../fonts/gotham/gotham-bold-webfont.ttf") format("truetype"),
		 url("../fonts/gotham/gotham-bold-webfont.svg#gotham_boldregular") format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "GothamBook";
	src: url("../fonts/gotham/gotham-book-webfont.woff2") format("woff2"),
		 url("../fonts/gotham/gotham-book-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: "GothamMedium";
    src: url("../fonts/gotham/gotham-medium-webfont.woff2") format("woff2"),
         url("../fonts/gotham/gotham-medium-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal;

}
@font-face {
	font-family: "HemiHead";
	src: url("../fonts/hemihead/hemi_head_bold_italic-webfont.woff2") format("woff2"),
		 url("../fonts/hemihead/hemi_head_bold_italic-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: "Wisdom";
    src: url("../fonts/wisdom/wisdom_script_aj-webfont.woff2") format("woff2"),
         url("../fonts/wisdom/wisdom_script_aj-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

/* General declarations ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
body,
html {
	width: 100%;
	height: 100%;
}

body {
	font-family: "GothamBook", "Helvetica Neue", Arial, sans-serif;
	overflow-x: hidden;
}

hr {
	max-width: 50px;
	border-width: 3px;
	border-color: #F05F40;
}

hr.light {
	border-color: #fff;
}

a {
	color: #fff;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
}

a:hover {
	color: #ff8000;
	text-decoration: none;
}

h1,
h2,
h3 {
	font-family: "HemiHead";
}
h2 {
	font-size: 2.4rem;
}
h4 {
	color: #58595b;
	text-align: left;
	text-transform: uppercase;
}

.bg-primary {
	background-color: #F05F40 !important;
}
.bg-dark {
	background-color: #212529 !important;
}
.text-faded {
	color: rgba(255, 255, 255, 0.7);
}

section {
	padding: 8rem 0;
}
.section-heading {
	margin-top: 0;
}
.container {
	position: relative;
}

::-moz-selection {
	color: #fff;
	background: #212529;
	text-shadow: none;
}
::selection {
	color: #fff;
	background: #212529;
	text-shadow: none;
}
img::selection {
	color: #fff;
	background: transparent;
}
img::-moz-selection {
	color: #fff;
	background: transparent;
}
#lightning {
	position: absolute;
	width: 100%;
}
#lightning img {
	width: 100%;
}
#lightning.lightningLeft {
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";
	left: 0;
}
#lightning.lightningRight {
	right: 0;
}

.invisible {
  transition: opacity 0.5s ease;
  opacity: 0.0;
}
.visible {
  transition: opacity 0.5s ease;
  opacity: 1.0;
}

.hidden {
	display: none;
}

/* 3. Navbar ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#mainNav {
	border-bottom: 1px solid rgba(33, 37, 41, 0.1);
	background-color: #ffd300;
	font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
	z-index: 999;
}
#mainNav .navbar-brand {
	font-weight: 700;
	text-transform: uppercase;
	color: #F05F40;
	font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
}
#mainNav .navbar-brand:focus,
#mainNav .navbar-brand:hover {
	color: #f05f40;
}
#mainNav .nav-link,
#mainNav .nav-link:focus {
	font-size: .9rem;
	font-weight: 700;
	text-transform: uppercase;
	color: #212529;
}
#mainNav .nav-link:hover,
#mainNav .nav-link:focus:hover {
	color: #F05F40;
}
#mainNav .nav-item.active .nav-link {
	border-radius: 8px;
}
#mainNav .navbar-nav > li.nav-item,
#mainNav.navbar-shrink .navbar-nav > li.nav-item {
	text-align: right;
}
#mainNav .navbar-nav > li.nav-item > a.nav-link,
#mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link {
	font-size: 1.1rem;
}
@media (min-width: 992px) {
	#mainNav .navbar-nav > li.nav-item > a.nav-link {
		padding: 1rem 1.2rem;
	}
	#mainNav.navbar-shrink {
		border-bottom: 1px solid rgba(33, 37, 41, 0.1);
		background-color: #ffd300;
	}
	#mainNav.navbar-shrink .navbar-brand {
		color: #F05F40;
	}
	#mainNav.navbar-shrink .navbar-brand:focus, #mainNav.navbar-shrink .navbar-brand:hover {
		color: #f05f40;
	}
	#mainNav.navbar-shrink .navbar-nav > li.nav-item {
		text-align: left;
	}
	#mainNav .navbar-nav > li.nav-item > a.nav-link,
	#mainNav .navbar-nav > li.nav-item > a.nav-link:focus,
	#mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link,
	#mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link:focus {
		color: #58595b;
		font-size: 0.9rem;
	}
	#mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link:hover,
	#mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link:focus:hover {
		color: #F05F40;
	}
	#mainNav .nav-item.active .nav-link {
		color: #ffd300 !important;
		background-color: #58595b;
	}
	#lightning {
		width: 900px;
	}
}
.navbar-brand img {
	padding: 1rem 0;
	width: 110px;
}
.sticky {
	position: fixed;
	top: 0;
	width: 100%;
}

/* Masthead ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
header.masthead {
	background-image: url("../img/backgrounds/masthead.jpg");
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding-top: 1rem;
	padding-bottom: calc(2rem - 56px);
}
header.masthead h2,
header.masthead h2 {
	text-shadow: 0 0 20px rgba(0,0,0,0.5);
}
header.masthead p {
	font-weight: 300;
}
header.masthead > .container {
	padding-bottom: 8rem;
}
.mastheadLogo {
	width: 75%;
}
.mastheadCTA {
	position: absolute;
	bottom: 40px;
	left: auto;
	right: auto;
	width: 100%;
}
.mastheadCTA .btn {
	padding: 1rem 2rem;
}
@media (min-width: 768px) {
	header.masthead p {
		font-size: 1.15rem;
	}
}
@media (min-width: 992px) {
	header.masthead {
		height: 88vh;
		min-height: 650px;
		padding-top: 0;
		padding-bottom: 0;
	}
	header.masthead h1 {
		font-size: 3rem;
	}
}
@media (min-width: 1200px) {
	header.masthead h1 {
		font-size: 4rem;
	}
}

.text-primary {
	color: #F05F40 !important;
}

/* Front page sectional overrides ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#about {
	background: #f1ede2;
	color: #58595b;
	padding: 3rem 0;
}
.about-1 {
	font-family: "GothamBold";
	font-size: 1.75rem;
}
.about-2 {
	font-family: "GothamMedium";
	font-size: 1.35rem;
}
.about-3 {
	font-size: 1.15rem;
}
#benefits {
	font-family: "GothamMedium";
	padding: 2rem 0 4rem 0;
}
#benefits img {
	height: 100px;
	margin-bottom: 25px;
}
#benefits p {
	padding: 0 15px;
}
@media (min-width: 992px) {
	#benefits {
		font-family: "GothamMedium";
		padding: 2rem 0 8rem 0;
	}
}
#testimonial {
	background: #e1c500 url(../img/backgrounds/disking.jpg) no-repeat center center;
	background-size: cover;
	color: #fff;
	font-family: "GothamBold", "Helvetica Neue", Arial, sans-serif;
	font-size: 1rem;
	font-style: italic;
	padding: 3rem 0;
	position: relative !important;
}
#testimonial > .container {
	top: -220%;
}
#testimonial .carousel-item {
	height: auto;
	min-height: auto;
}
@media (min-width: 992px) {
	#testimonial {
		font-size: 1.6rem;
		padding: 8rem 0;
	}
}
#study {
	padding: 3rem 0;
}
@media (min-width: 992px) {
	#study {
		padding: 8rem 0;
	}
}
#barchart {
	overflow: hidden;
	position: relative;
	width: 100%;
}
.barchartScale {
	width: 100%;
}
.barchartExplaination {
	font-size: 0.5rem;
}

.barchartBar {
	background: red;
	bottom: 19%;
	height: 50%;
	position: absolute;
	width: 12%;	
}
.barchartBar:nth-child(1) { left: 14%;  }
.barchartBar:nth-child(2) { left: 26%; }
.barchartBar:nth-child(3) { left: 38%; }
.barchartBar:nth-child(4) { left: 50%; }
.barchartBar:nth-child(5) { left: 62%; }
.barchartBar:nth-child(6) { left: 74%; }
#barControl    { background: #F8EB48; height: 23%; transition-delay: 0s;}
/*#barNZone      { background: #faaf40; height: 43%; transition-delay: 0.1s;}*/
#barInstinct   { background: #fff2aa; height: 56%; transition-delay: 0.2s;}
#barBolt {
	background: -moz-linear-gradient(45deg, #c7161e 0%, #feb71e 50%, #f5e932 100%);
	background: -webkit-linear-gradient(45deg, #c7161e 0%,#feb71e 50%,#f5e932 100%);
	background-image: url("../img/backgrounds/grid.png"), linear-gradient(45deg, #c7161e 0%,#feb71e 50%,#f5e932 100%);
	-moz-box-shadow:	0px 0px 15px rgba(0,0,0,0.333);
	-webkit-box-shadow:	0px 0px 15px rgba(0,0,0,0.333);
	box-shadow:			0px 0px 15px rgba(0,0,0,0.333);
	height: 82%;
	z-index: 99;
	transition-delay: 0.3s;
}
#barBolt img {
	margin-top: 10px;
	opacity: 0.6;
	width: 80%;
}
#barAgrotain   { background: #7d141e; height: 56%; transition-delay: 0.4s; }
#barNutrishere { background: #ec1c24; height: 30%; transition-delay: 0.5s; }


/* "What it is" page sectional overrides ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#carousel {
	margin-top: 113px;
}
#carousel video {
	width: 100% !important;
}
#carousel .carousel-item {
	height: auto !important;
	min-height: auto !important;
}
.carousel-control-next-icon {
	background-image: url("../img/chevron-next.svg");
	height: 32px;
	width: 32px;
}
.carousel-control-prev-icon {
	background-image: url("../img/chevron-prev.svg");
	height: 32px;
	width: 32px;
}
#hardware {
	padding-top: 0;
	padding-bottom: 0;
}
#hardware h4 {
	margin-top: 1.5rem;
	text-align: center;
}
#hardware p {
	text-align: justify;
}
#hardware img {
	margin-top: 6rem;
}
.hardwareFull {
	display: none;
}
.hardwareThumbnail {
	display: inline-block;
	margin: 0 auto;
	max-width: 67%;
}
#hardware .row>div {
	text-align: center;
}
@media (min-width: 992px) {
	#hardware {
		padding-top: 5rem;
		padding-bottom: 5rem;
	}
	#hardware h4 {
		margin-top: 3.5rem;
		text-align: left;
	}
	#hardware .righty h4 {
		margin-top: 2em;
		text-align: right;
	}
	#hardware .righty p {
		text-align: right;
	}
	#hardware img {
		margin-top: 0;
	}
	.hardwareFull {
		display: inline-block;
		width: 100%;
	}
	.hardwareThumbnail {
		display: none;
	}
}
#offers {
	background: #f1ede2;
	padding: 4rem 0;
}
#offers p {
	color: #666;
	font-family: "HemiHead";
	font-size: 1.8rem;
}
#offers p b {
	color: #000;
}

/* "How it works" page sectional overrides ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
header#disking {
	margin-top: 110px;
	-moz-box-shadow:	0px 5px 20px rgba(0,0,0,0.5);
	-webkit-box-shadow:	0px 5px 20px rgba(0,0,0,0.5);
	box-shadow:			0px 5px 20px rgba(0,0,0,0.5);
}
header#disking video {
	width: 100%;
	height: 100%;
}
#science {
	background: #f1ede2;
	-moz-box-shadow:	0px 5px 20px rgba(0,0,0,0.5);
	-webkit-box-shadow:	0px 5px 20px rgba(0,0,0,0.5);
	box-shadow:			0px 5px 20px rgba(0,0,0,0.5);
	padding: 5rem 0;
}
#scienceGraphic,
#scienceGraphic img {
	width: 100%;
}
#science h3 {
	font-family: "GothamBold";
	font-size: 2rem;
	margin-bottom: 1.8rem;
}
#chart {
	background: #e1c500 url(../img/backgrounds/chart.jpg) no-repeat center center;
	background-size: cover;
	min-height: 400px;
	position: relative !important;
	z-index: 99;
}
#safety {
	padding: 5rem 0 6rem 0;
}
#safety h3 {
	font-family: "GothamBold";
	font-size: 2rem;
	padding: 0 15px;
}
#safety h4 {
	font-family: "GothamBold";
	font-size: 1.25rem;
	text-align: center;
}
#safety h4,
#safety p {
	padding: 0 15px;
}
#safety img {
	margin: 0 auto 10px auto;
	max-width: 75px;
}
.alertSign {
	height: 60px;
	position: relative;
	top: -6px;
}

/* Contact ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#contact {
	background: #231f20 url("../img/backgrounds/hexagons.png") repeat bottom left;
	background-size: auto 100%;
	color: #fff;
	padding: 6rem 0;
}
#contactForm input,
#contactForm textarea {
	background: #58595b;
	border: 1px solid #000;
	border-radius: 8px;
	color: #fff;
	margin-bottom: 25px;
	padding: 20px;
	width: 100%;
	-moz-box-shadow:    inset 0 0 5px #111;
	-webkit-box-shadow: inset 0 0 5px #111;
	box-shadow:         inset 0 0 5px #111;
}
#contact h2 {
	text-align: center;
	text-shadow: 0 0 8px #ffff00;
}
#contact .contactText {
	text-align: center;
}
.socialLinks img {
	margin: 0 6px;
	width: 33px;
}
.socialLinks a:hover img {
	fill: red;
}
@media (min-width: 992px) {
	#contact {
	}
	#contact h2 {
		text-align: right;
	}
	#contact .contactText {
		text-align: right;
	}
}

/* Footer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#footer {
	background: #231f20;
	color: #fff;
	padding: 2rem 0 5rem 0;
}
.footerLinks {
	text-transform: uppercase;
}
.footerLinks a {
	padding: 8px;
}
.footerLogo {
	position: absolute;
	text-align: center;
	right: auto;
	top: auto;
	bottom: -50px;
	left: 0;
	width: 100%;
}
.footerLogo a {
	margin: 0 auto;
}
.footerLogo img {
	width: 110px;
}
@media (min-width: 992px) {
	#footer {
		padding: 2rem 0;
	}
	.footerLogo {
		left: auto;
		bottom: auto;
		right: 15px;
		top: 50px;
		width: 110px;
	}
}

.finePrint {
	font-size: 0.9rem;
}

/* Modal signup */
.modal-dialog {
	margin-top: 2rem;
	max-width: 400px;
}
.modal .close {
    background: #58595b;
	border: 1px solid #d6d4c7;
    border-radius: 15px;
    width: 30px;
    height: 30px;
	opacity: 1;
	position: absolute;
	top: -15px;
	right: -15px;
    text-align: center;
	z-index: 99;
}
.modal .close span {
	color: #d6d4c7;
	cursor: pointer;
	text-align: center;
}
.modal .close span img {
	margin: 18% auto 0 auto;
	max-width: 50%;
	vertical-align: top;
}
.modal .close:hover {
    background: #23272b;
}
.modal-content {
	border-radius: 1rem;
	color: #58595b;
}
.modal-header {
	background: #d6d4c7;
}
.modal-body {
	background: #d6d4c7;
	border-radius: 1rem 1rem 0 0;
	min-height: 380px;
}
.modal-body #modalBody1 p {
	font-family: "HemiHead";
	font-size: 1.1rem;
}
.modal-body #modalBody2 h3 {
	font-family: "Wisdom";
	font-size: 3.3rem;
	margin-top: 6rem;
}
.modal-body #modalBody2 p {
	padding: 0 15%;
}
.modal-footer {
	background: #ffd300;
	border-radius: 0 0 1rem 1rem;
	font-size: 0.85rem;
	line-height: 1.2;
}
.modal-footer a {
	color: #58595b;
}
.modal-footer a:hover {
	color: #222;
}
.modal-footer p {
	margin: 0 1rem 0 0 !important;
	width: 70%;
}
.modalLogo {
	margin-top: 0;
	width: 85px;
}
#adviceForm input,
#adviceForm textarea {
	background: #fff;
	border: 0;
	border-radius: 5px;
	color: #58595b;
	margin-bottom: 10px;
	padding: 10px;
	width: 100%;
}

/* Forms and inputs ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #929497;
    opacity: 1; /* Firefox */
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #929497;
}
::-ms-input-placeholder { /* Microsoft Edge */
    color: #929497;
}

/* Buttons ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.btn {
	background: #fdd644 url("../img/backgrounds/button.png") repeat-x;
	background-size: contain;
	border: 0;
	border-radius: 10px;
	box-shadow: 0px 5px 33px rgba(0,0,0,0.5);
	color: #5f541a !important;
	font-family: "HemiHead";
	font-size: 1.2rem;
	line-height: 1.5rem;
	padding: .5rem 2rem;
}
@media (min-width: 992px) {
	.btn {
		font-size: 1.4rem;
	}
}
.btn-large {
	font-size: 2rem;
	padding: 1rem 2rem;
}
.btn-xl {
	padding: 1rem 2rem;
}
.btn:hover, .btn:focus, .btn:active {
	box-shadow: 0 0 8px rgba(255,255,0,0.4);
}
.btn:active {
	box-shadow: 0 0 16px rgba(255,255,0,0.8);
}
.btn-dark {
	background: #58595b;
	box-shadow: none;
	color: #ffd300 !important;
	font-size: 1.2rem;
}

/* Bootstrap boxes ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.service-box {
	max-width: 400px;
}

/* Animations ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.flickerOn {
    animation-name: flickerOn;
    animation-duration: 2s;
    animation-iteration-count: 1;
	opacity: 0;
	transition: all 1s;
}
.flickerOff {
	opacity: 0;
}
@keyframes flickerOn {
    0%	{opacity: 0;}
	1%  {opacity: 0.666;}
	10%  {opacity: 0;}
	
	20% {opacity: 0;}
	21% {opacity: 0.8;}
	24% {opacity: 0;}
	27% {opacity: 0;}
	28% {opacity: 0.8;}
	32% {opacity: 0;}
	
	50% {opacity: 0;}
	51% {opacity: 1;}
	70% {opacity: 1;}
	95% {opacity: 0;}
	96% {opacity: 0.2;}
	100% {opacity: 0;}
}
.fromTopIn {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(0,0);
	opacity: 1.0;
}
.fromTopOut {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(0,-10px);
	opacity: 0.0;
}
.fromBottomIn {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(0,0);
	opacity: 1.0;
}
.fromBottomOut {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(0,10px);
	opacity: 0.0;
}
.fromLeftIn {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(0,0);
	opacity: 1.0;
}
.fromLeftOut {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(-10px,0);
	opacity: 0.0;
}
.fromRightIn {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(0,0);
	opacity: 1.0;
}
.fromRightOut {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: translate(10px, 0);
	opacity: 0.0;
}
.scaleUpIn {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: scale(1.0,1.0);
	opacity: 1.0;
}
.scaleUpOut {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: scale(1.3,1.3);
	opacity: 0.0;
}
.scaleDownIn {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: scale(1.0,1.0);
	opacity: 1.0;
}
.scaleDownOut {
	transition: transform 1.0s ease, opacity 1.0s ease;
	transform: scale(0.7,0.7);
	opacity: 0.0;
}
.slideUpIn {
	transition: transform 0.25s ease, opacity 0.25s ease;
	transform: translate(0,0);
	opacity: 1.0;
}
.slideDownOut {
	transition: transform 0.25s ease, opacity 0.25s ease;
	transform: translate(0,120px);
	opacity: 0.0;
}