@charset "utf-8";
/* CSS Document */

.bgimg {
  background-image: url('/w3images/forestbridge.jpg');
  height: 100%;
  background-position: center;
  background-size: cover;
  position: relative;
  color: white;
  font-family: "Courier New", Courier, monospace;
  font-size: 25px;
}

.cursor {
  pointer-events: none;
  mix-blend-mode: difference;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
}

.space {
	height: 18px;
	width: 100%; 
	object-fit: cover;
	margin-top: 20px;
}


.mini-video {
	height: 100%;
	width: 100%;
	object-fit: cover;
}



audio, canvas, progress, video {
	display: inline-block;
	vertical-align: baseline;
}



.mini-video-container {
	position: relative;
	/*! left: 4em; */ 
	width: 33%; 
	/*! margin-left: auto; */
	/*! margin-right: auto; */
	/*! margin-top: 152px; */
	/*! margin-bottom: 0em; */  
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}

.ab-mini-video-container {
	position: relative;
	/*! left: 4em; */
	width: 100%; 
	margin-left: auto;
	margin-right: auto;
	margin-top: 116px;
	/* margin-bottom: 0em; */
	/*! position: absolute; */
	/*! top: 50%; */
	/*! left: 35%; */
	/*! transform: translate(-50%, -50%); */
	/*! text-align: center; */
}

.box-video {
	position: absolute;
	left: -5em;
	width: 102%;
	margin-left: auto;
	margin-right: auto;
	margin-top: -70px;
	/*! margin-bottom: 16em; */
	z-index: -1;
	padding-left: -5px;
	padding-right: 41em;
	/*! display: flex; */
}






.indent_txt a {
	color: #F56900;
	/* font-style: italic; */
	font-weight: 800; 
}
.indent_txt a:hover {
	color: #6e6e73;
}

.-button {
    display: block;
    position: relative;
   /* margin: 1em;*/
   /* padding: 0.67em;*/
 	text-align: left;
    overflow: hidden;
    text-decoration: none;
	outline: none;
    background: transparent;
	color: #fff;
	width: 12em; 
	
	
	
	/*! line-height: 28px; */	 
}

.-button span {
	
   /* -webkit-transition: 0.1s;
    -moz-transition: 0.1s;
    -o-transition: 0.1s;
    transition: 0.1s;
    -webkit-transition-delay: 0.1s;
    -moz-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;*/
}

.-button:before,
.-button:after {
	
    content: '';
    position: absolute;
   /* top: 0.67em;
    left: 0;*/
   /* width: 100%;*/
    
    opacity: 0;
}

/* :before */

.-button:before {
    content: attr(data-hover);
	
  /*  -webkit-transform: translate(-150%,0);
    -moz-transform: translate(-150%,0);
    -ms-transform: translate(-150%,0);
    -o-transform: translate(-150%,0);
    transform: translate(-150%,0);*/
}

/* :after */

.-button:after {
    content: attr(data-active);
	
 /*   -webkit-transform: translate(150%,0);
    -moz-transform: translate(150%,0);
    -ms-transform: translate(150%,0);
    -o-transform: translate(150%,0);
    transform: translate(150%,0);*/
}

/* Span on :hover and :active */

.-button:hover span,
.-button:active span {
    opacity: 0;
	
/*    -webkit-transform: scale(0.3);
    -moz-transform: scale(0.3);
    -ms-transform: scale(0.3);
    -o-transform: scale(0.3);
    transform: scale(0.3);*/
}

/*  
    We show :before pseudo-element on :hover 
    and :after pseudo-element on :active 
*/

.-button:hover:before,
.-button:active:after {
    opacity: 1;
	
  /*  -webkit-transform: translate(0,0);
    -moz-transform: translate(0,0);
    -ms-transform: translate(0,0);
    -o-transform: translate(0,0);
    transform: translate(0,0);
    -webkit-transition-delay: .1s;
    -moz-transition-delay: .1s;
    -o-transition-delay: .1s;
    transition-delay: .1s;*/
}



.menu-button {
	color: #ff0c0c;
	/*! background-color: #fff; */
	font-weight: 600;
	transition: background 0.2s ease, color 0.2s ease;
	
	/*! border-color: rgb(255, 255, 255); */
	display: flex;
	align-items:  center;
}

.menu-button:hover {
	color: #fff; 
	background-color: #000;
	
}





/*style="transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg); transform-style: preserve-3d;"*/
.move-link:hover {
	  -webkit-transform: translate(12px,0);
    -moz-transform: translate(12px,0);
    -ms-transform: translate(12px,0);
    -o-transform: translate(12px,0);
    transform: translate(12px,0);
	  opacity: 0.5;
	  /*! filter: invert(70%); */
} 

.move-link {
	opacity: 1;
	   -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
	
} 

.gradient-fill {
	animation: gradient-fill 5s linear infinite;
	transform: translateZ(0);
	background-size: 200% 200%;
	background-image: radial-gradient(circle at 100% 60%, #fc5e9b, #735adb 73%, #3f90e5 88%, #ecedef 165%, #f0eff0 165%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	-webkit-box-decoration-break: clone;
}


.pf-nav-social {
  text-align: left;
	display:   contents;
	margin-left: -55px;
    align-content: center;
  /*! width: 175px; */
  margin-right: 15px;
}


.pf-nav-social:hover {
  /*! text-align: left; */
	/*! display: flex; */
	/*! margin-left: -79px; */
    /*! align-content: center; */
  /*! width: 199px; */
}


a.back-to-site {
  /*! background: none; */
  border-radius: 100em;
  border: 1px solid #fff;
  color: #fff;
  font-size: 14px;  
  height: auto;
  /*! line-height: 1.3; */
  /*! padding: 16px 32px; */
  width: 112px;
  /*! background-color: #fff6; */
  height: 40px;
  display: flex;
  align-items: center;
  font-weight: 600;
  justify-content: center;
}
a.back-to-site:hover, a.back-to-site:focus {
  /*! background: none !important; */
  border: 1px solid #FFF;
  color: #000;
  text-decoration: none;
  background-color: #fff;
}




@media screen and (max-width:512px) {
 
 .menu-button {
	color: #000;
	background-color: #fff;
	font-weight: 600;
	transition: background 0.2s ease, color 0.2s ease;
	border-color: rgb(255, 255, 255);
	display: flex;
	align-items: center;
}
	
	
	
	.pf-nav-social {
	text-align: left;
	display: none;
	margin-left: -55px;
	align-content: center;
	/* width: 175px; */
	margin-right: 15px;
}
	
}



.video-index video {
	position:  absolute; 
	width: 45em; 
	z-index: -1; 
	left: 25.3em; 
	/*! height: 551%; */
	top: -7em;
}




.video-message video {
	position:  absolute; 
	width: 28em; 
	z-index: -1; 
	left: 12em; 
	/*! height: 104%; */
	top: 10em;
}


video {
	/*! max-width: 340%; */
	/*! height: 100%; */
	/*! margin-top: -1em; */
	/*! margin-left: 8em; */
}




@media screen and (min-width:3200px) {
  
.video-message video {
	position:  absolute; 
	width: 25%; 
	z-index: -1;
	left: 12em;
	/*! height: 104%; */
	top: 8em; 
}

	a.back-to-site {
    border-radius: 100em;
    border: 1px solid #fff;
    color: #fff;
    font-size: 22px;
    height: auto;
    padding: 16px 32px;
    height: 50px;
    display: flex;
    align-items: center;
    font-weight: 600;
    left: -16px;
    position: relative;
}
	.-button {
	display: block;
	position: relative;
	/* margin: 1em; */
	/* padding: 0.67em; */
	text-align: left;
	overflow: hidden;
	text-decoration: none;
	outline: none;
	background: transparent;
	color: #fff;
	width: 320px;
	/* line-height: 28px; */
}
	
}	







@media screen and (min-width:2400px) {
  
.video-message video {
	position:  absolute; 
	width: 25%; 
	z-index: -1;
	left: 12em;
	/*! height: 104%; */
	top: 8em; 
}


	.-button {
	display: block;
	position: relative;
	/* margin: 1em; */
	/* padding: 0.67em; */
	text-align: left;
	overflow: hidden;
	text-decoration: none;
	outline: none;
	background: transparent;
	color: #fff;
	width: 403px;
	/* line-height: 28px; */
}
	
}	

@media screen and (max-width:991px) {
	
.video-index video {
	position:  absolute; 
	width: 19rem; 
	z-index: -1;
	left: 4.4rem;
	/*! height: 104%; */
	top: -17rem;
}
	
	.video-message video {
	position:  absolute; 
	width: 24rem; 
	z-index: -1;
	left: 0.8rem;
	/*! height: 104%; */
	top: 13rem;
}
	
	
	.cursor {
	pointer-events: none;
	mix-blend-mode: difference;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* display: flex; */
	align-items: center;
	justify-content: center;
	z-index: 99999;
	display: none;
}
	
	
}


@media screen and (max-width:512px) {
  
.video-message video {
	position:  absolute; 
	width: 61%; 
	z-index: -1;
	left: 4rem;
	/*! height: 104%; */
	top: 10rem;
}

	a.back-to-site {
	/* background: none; */
	border-radius: 100em;
	border: 1px solid #fff;
	color: #fff;
	font-size: 13px;
	/*height: auto;*/
	/* line-height: 1.3; */
	/* padding: 16px 32px; */
	width: 80px;
	/* background-color: #fff6; */
	height: 34px;
	display: flex;
	align-items: center;
	font-weight: 600;
	justify-content: center;
}
	
	
	
	
	
		 
}	
	
/*
@media screen and (min-width:2400px) {
  
.video-index video {
	position:  absolute; 
	width: 25%; 
	z-index: -1;
	left: 12em;

	top: 8em; 
}

		 
}	
*/


@media screen and (max-width:479px) {
  
.video-index video {
	position:  absolute; 
	width: 100%; 
	z-index: -1;
	left: 1em;
	/*! height: 104%; */
	top: -61em;
	max-height: 100%;
}

	.mini-video-container {
	/*position: relative;*/
	/* left: 32em; */
	width: 79%;
	/*margin-left: auto;*/
	/*margin-right: auto;*/
	/*! margin-top: 61px; */
	/*margin-bottom: 5em;*/
}
	
	
	.box-video {
	position: absolute;
	left: 9em;
	width: 73%;
	margin-left: auto;
	margin-right: auto;
	margin-top: -74px;
	/*! margin-bottom: 16em; */
	z-index: -1;
	padding-left: -5px;
	padding-right: 2em;
	/*! display: flex; */
}
	
	
		 
}	
	

@media screen and (max-width:369px) {
  
.mini-video-container {
	/*position: relative;*/
	/* left: 32em; */
	width: 80%;
	/*margin-left: auto;*/
	/*margin-right: auto;*/
	/*! margin-top: 61px; */
	/*margin-bottom: 5em;*/
}
	
	
	.box-video {
	position: absolute;
	left: 11em;
	width: 111%;
	margin-left: auto;
	margin-right: auto;
	margin-top: -70px;
	/*! margin-bottom: 16em; */
	z-index: -1;
	padding-left: -5px;
	padding-right: 41em;
	/*! display: flex; */
}
	

}




	
  body {
  cursor: default;
}



.cursor__ball {
  position: absolute;
  top: -10%;
  left: -10%;
  transform: translate(-50%, -50%);
  background-color: #f7f8fa;
  mix-blend-mode: difference;
  border-radius: 50%;
}

.cursor__ball--big {
  width: 1.875em;
  height: 1.875em;
  z-index: 99999;
}

.cursor__ball--small {
  width: 0.625em;
  height: 0.625em;
  z-index: 99999;
}