@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800&display=swap');

@font-face {
	font-family: 'office_squareregular';
  src: url('../fonts/office_square_df-webfont.woff2') format('woff2'),
       url('../fonts/office_square_df-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

body{
	font-family: 'Open Sans', serif;
	color: #fff;
	overflow: auto!important;
	height: 100vh;
}
html.template-parallax, html.template-parallax body{

}
.wrapall{
	background:url('../images/bg.png');
	background-size: cover;
	background-repeat: no-repeat;
	/* overflow: hidden; */
	height: 100vh;
  width: 100%;
  overflow: hidden;
  margin: 0 !important;
  padding: 0;
}
.text-green{
	color:#20AD92;
}
.text-white{
	color:#ffffff;
}
.text-yellow{
	color:#F9A11C;
}
.text-red{
	color:#F06469;
}
.text-orange{
	color:#f05e22;
}

.text-small{
	font-size: 18px;
}
.text-medium{
	font-size: 80px;
}
.text-large{
	font-size: 100px;
}
.font-family-square{
	font-family: 'office_squareregular';
	line-height: 1;
}



.navbar {
	transition: all .6s;
	backface-visibility: hidden;
	padding: 30px 30px 0;
	/* padding-top: 10px; */
	border-top: 1px solid #000;
}

/* .navbar-brand img.navbar-brand-img-2 {
	display: none;
} */



/* .navbar-brand img{
	display: block;
}

.navbar-brand img.navbar-brand-img-1,.navbar-brand img.navbar-brand-img-2{
	display: inline-block;
	position: absolute;

}
.navbar-brand img.navbar-brand-img-1 {
	display: block;
}
.navbar-brand img.navbar-brand-img-2 {
	display: none;
	opacity: 0;
} */
.navbar-collapse{
		margin: 0 -30px;
}
.navbar-dark .navbar-nav{
	/* background: rgba(24, 22, 24, 0.83); */
	background:rgba(34, 173, 146, 0.9);
	width: 300px;
	height: calc(100vh - 85px);
	/* margin-top: -75px; */
	padding: 50px 30px 0 30px;
}
.navbar-dark .navbar-nav .nav-link {
		color: #fff;
		color: rgba(255, 255, 255, 0.8);
		border: 0;
		text-transform: uppercase;
		cursor: default;
		text-align: right;
}

.navbar-nav ul .nav-item::marker {
  display: none;
	opacity: 0;
	content:'';
}

.bottom-nav{
  position: absolute;
  right: 30px;
  bottom: 0;
}

.bottom-nav a{
  display: block;
	font-size: 14px;
	text-align: right;
	width: 100%;
	padding-top: 0;
	padding-bottom: 10px;
}

.navbar-dark .navbar-nav .nav-link.active {
		font-weight: 900;
}

.navbar-dark .navbar-nav .nav-link:hover {
		color: #fff;
}

.navbar-dark .navbar-nav .nav-link:focus {
		color: #fff;
		outline: 0;
}
.navbar-dark .navbar-toggler {
	/* background-color:#000000; */
	border: none;
	border-color: #444;
	outline: none;
	/* padding-right: 20px; */
}
.navbar-dark .navbar-toggler {
	background-color: transparent;
	border: none;
	border-color: #444;
	/* padding-top: 0px; */
	padding: 0px;
	margin-top: -36px;
}




.navbar-dark .navbar-toggler span {
		display: block;
		width: 30px;
		height: 2px;
		margin: 6px auto;
		background: #fff;
		transition: all .6s cubic-bezier(0.250, 0.100, 0.250, 1.000);
}

.navbar-dark .navbar-toggler:hover span,
.navbar-dark .navbar-toggler:focus span {
		background: #ccc;
}

/* rotate first span */
.navbar-dark .navbar-toggler[aria-expanded="true"] span:first-of-type {
		transform: rotate(45deg) translate(6px, 6px);
}

/* hide second span */
.navbar-dark .navbar-toggler[aria-expanded="true"] span:nth-of-type(2) {
		opacity: 0;
}

/* rotate third span */
.navbar-dark .navbar-toggler[aria-expanded="true"] span:last-of-type {
		transform: rotate(-45deg) translate(5px, -5px);
}

.navbar-dark .navbar-toggler[aria-expanded="false"] span {
		transform: none;
		opacity: 1;
}

.navbar-brand {
		max-width: 192px;
		max-height: auto;
		border: 0;
		/* text-indent: -99999px; */
		/* padding: 20px 0px 0px 20px; */
		margin-right: 0px;
		/* cursor: default; */
}

.navbar-brand svg{
	width: 192px;
	height: auto;
}

.navbar-brand svg .logo-without-leaf{
		width: 192px;
}
.navbar-brand svg .logo-leaf{
		width: 32px;
}



#parallax-container{
	/* display: none; */
	top: 106px!important;
	height: calc(100vh - 106px);
}
/* #parallax-container .parallax-page#how-we-do-it-page{
	top:100px!important;
} */
#parallax-container .parallax-page{
min-height: 400px;
}
#parallax-container .parallax-page .align-middle-wrapper{
	display: table;
	height: 100%
}
#parallax-container .parallax-page .align-middle-inner-wrapper{
	display: table-cell;
	vertical-align: middle;
}
#parallax-container .parallax-page .title-outer-wrapper .title-inner-wrapper .page-title{
	font-size: 20px;
	line-height: 1em;
	padding-bottom: 20px;
	margin-bottom: 0px;
}

#parallax-container .parallax-page .title-outer-wrapper .title-inner-wrapper .page-description{
	font-size: 70px;
  line-height: 1em;
	font-weight: 700;
}
#parallax-container .parallax-page .title-outer-wrapper .title-inner-wrapper .page-description span{
	display: block;
}
#parallax-container .parallax-page .title-outer-wrapper .title-inner-wrapper .page-tagline{
	padding-top: 20px;
}
/* #parallax-container #product-page.parallax-page .title-outer-wrapper .title-inner-wrapper{
	padding-left: 30px;
} */

#parallax-container #reclaim-rubber-page.parallax-page .table-wrapper{
	font-size: 1rem;
}
#parallax-container #product-page.parallax-page .page-content-wrapper{
	font-size: .9rem;

}
#parallax-container #product-page.parallax-page .page-content-wrapper .description{

}
#parallax-container #product-page.parallax-page .page-content-wrapper .description a{
	color: #ffffff;
	text-decoration: underline;
}
#parallax-container .page-content-wrapper .page-content-inner-wrapper {
	padding-bottom: 15px;
	padding-top: 15px;
}
#parallax-container .page-content-wrapper .page-content-inner-wrapper .icon-wrapper{

}
#parallax-container .page-content-wrapper .page-content-inner-wrapper .icon-wrapper img{
	width: 100%
}
#parallax-container .page-content-wrapper p{
	text-align: justify;
}
#parallax-container .page-content-wrapper .page-content-inner-wrapper .gradient-border{
  background: -webkit-linear-gradient(left, #F9A11C 0%, #a0650b 100%);
  display: block;
  height:5px;
  width: 100%;
}
#parallax-container .table-wrapper{
	padding-right: 30px;
}
#parallax-container .table-wrapper .table{
	color: #fff;
}
#parallax-container .table-wrapper .table.table-hover tbody tr:hover{
	color: #fff;
	background-color: rgba(31, 173, 146, .3);
}

#parallax-container .table-wrapper .table .masterhead{
	text-align: center;
	background-color: #1fad92
}
#parallax-container .table-wrapper .table td, #parallax-container .table-wrapper .table th{
	border-color: rgba(165, 168, 171, .2);
}

#parallax-container .parallax-page#contact-page .image{
	width: 30%;
	padding-bottom: 30px;
}

#parallax-container .parallax-page#contact-page .contact-content-wrapper{
	padding-top: 10px;
}
#parallax-container .parallax-page#contact-page .contact-content-wrapper .contact-content-row{
	padding-bottom: 30px;
}

#parallax-container .parallax-page#contact-page .contact-content-wrapper .contact-content-row  span{
	display: block;
}
#parallax-container .parallax-page#contact-page .contact-content-wrapper .contact-content-row a{
 text-decoration: none;
}
#parallax-container .parallax-page#contact-page .contact-content-wrapper .contact-content-row a:hover{
	color:inherit;
}
.reclaimRubber .modal-dialog{
	max-width: 75%;
	border: 1px solid #fff;
}
.reclaimRubber .modal-content{
	background-color: #000;
}
.reclaimRubber .modal-content .modal-header{
	border-bottom: none
}
.reclaimRubber .modal-content .modal-header .close{
	color: #fff;
	outline: none;
}

 /* .reclaimRubber .modal-body {
	background-color: #000;
} */
.reclaimRubber .modal-body .table-wrapper{

}
.reclaimRubber .modal-body  .table-wrapper .table{
	color: #fff;
}
 .reclaimRubber .modal-body  .table-wrapper .table.table-hover tbody tr:hover{
	color: #fff;
	background-color: rgba(31, 173, 146, .3);
}
.reclaimRubber .modal-body  .table-wrapper .table .masterhead{
	text-align: center;
	background-color: #1fad92
}
.reclaimRubber .modal-body  .table-wrapper .table td,.reclaimRubber  .modal-body  .table-wrapper .table th{
	border-color: rgba(165, 168, 171, .2);
}


/* Animation */

.ballon.animate__animated,.helicopter.animate__animated {
  --animate-duration: 5s;
}



.move-left {
	-webkit-animation: move-sleft 2s ease;
	-moz-animation: move-sleft 2s ease;
	-o-animation: move-sleft 2s ease;
	animation-fill-mode: forwards;
}

@keyframes move-sleft{
	0% {transform:translateX(0px)}
	100% {transform:translateX(-32px)}
}

.move-right {
	-webkit-animation: move-sright 2s ease;
	-moz-animation: move-sright 2s ease;
	-o-animation: move-sright 2s ease;
	animation-fill-mode: forwards;
	z-index: 9999;
	/* opacity: 0; */
}

@keyframes move-sright{
	0% {transform:translateX(0px); opacity:0;}
	100% {transform:translateX(0px);opacity:1; }
}


.fade-out {
	-webkit-animation: fade-out 2s ease;
	-moz-animation: fade-out 2s ease;
	-o-animation: fade-out 2s ease;
	animation-fill-mode: forwards;
}

@keyframes fade-out{
	0% {opacity:1;display: block;}
	100% {opacity:0; display: none;}
}

.fade-in {
	-webkit-animation: fade-in 2s ease;
	-moz-animation: fade-in 2s ease;
	-o-animation: fade-in 2s ease;
	animation-fill-mode: forwards;
}

@keyframes fade-in{
	0% {opacity:0;}
	100% {opacity:1;display: block;}
}

.fade-in {
	-webkit-animation: fade-in 2s ease;
	-moz-animation: fade-in 2s ease;
	-o-animation: fade-in 2s ease;
	animation-fill-mode: forwards;
}

@keyframes fade-in{
	0% {opacity:0;}
	100% {opacity:1;display: block;}
}

.fixed-top{
	background: transparent;
}
.scrolled{

	-webkit-animation: scrolledd 5s ease;
	-moz-animation: scrolledd 5s ease;
	-o-animation: scrolledd 5s ease;
	animation-fill-mode: forwards;
	/* background: rgba(0, 0, 0, 0.8); */
}

@keyframes scrolledd{
	0% {background: rgba(0, 0, 0, 0);}
	100% {background: rgba(0, 0, 0, 0.8);}
}


 @keyframes arrow {
	 0% {
		 transform: scale(0.75) rotate(45deg);
		 opacity: 0.5;
	}
	 25% {
		 transform: scale(1) rotate(45deg);
		 opacity: 1;
	}
	 100% {
		 transform: scale(0.75) rotate(45deg);
		 opacity: 0.5;
	}
}




@keyframes scroll_2 {
  0% {
    transform: translateY(0);
    opacity: 1;
  }
  25% {
    opacity: 1;
  }
  75% {
    transform: translateY(0.75em);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 0;
  }
}

.scroll-icon-wrapper {
	position: absolute;
	left: 50%;
	top: 30px;
	z-index: 99;
}

.scroll-icon__dot {
  display: block;
  position: absolute;
  left: 50%;
  background: #fff;
  height: 0.5em;
  width: 0.5em;
  top: 0.6em;
  margin-left: -0.25em;
  border-radius: 50%;
  transform-origin: top center;
  backface-visibility: hidden;
  animation: scroll_2 2s linear infinite;
	animation-fill-mode: forwards;
}

.scroll-icon2 {
  display: block;
  position: relative;
  height: 3em;
  width: 1.8em;
  border: 0.18em solid #fff;
  border-radius: 1em;
}


.scroll-icon {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.page-wrapper{
	background:url('../images/bg.png');
	background-size: cover;
	background-repeat: no-repeat;
  width: 100%;
  margin: 0 !important;
  padding: 0;
	min-height: 100vh;
}
.inner-page-wrapper{
	padding-top: 150px;
	/* text-align: center; */
}

.inner-page-wrapper h1{
	/* text-align: center; */
	padding-bottom: 30px;
}
