/*
CSS-File for n2trans.com
Author: N2 Trans GmbH
Created: November 2022
Description: Template Customizations
*/

*,
*:before,
*:after {
  box-sizing: border-box;
}

#mainNav {
    /*background-color: transparent;*/
}

.navbar-brand.logo-image img {
    width: 200px;
	height: 100%;
}

.nav-item {
    font-weight: 600;
}

.navbar-shrink{    
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.3);
    background-color: #fff !important;
}

@media (min-width: 992px) {
   
    #mainNav .nav-link {
        color: rgba(255, 255, 255, 0.7);
    }    
    #mainNav .nav-link:hover {
        color: rgb(255, 255, 255);
    }
    #mainNav.navbar-shrink .nav-link {
        color: rgba(0, 0, 0, 0.8);
    }
    #mainNav.navbar-shrink .nav-link:hover {
      color: #2b8f34;
    }
    #mainNav.navbar-shrink .nav-link.active {
      color: #2b8f34;
      border-bottom: 0.25rem solid #2b8f34;
    }
}

#mainNav .navbar-toggler {
    color: rgba(0,0,0,0.7);
    border: 1px solid rgba(0,0,0,0.7);
}
#mainNav .navbar-toggler:hover {
    color: rgb(0,0,0);
    border: 1px solid rgb(0,0,0);
}

.nav-link, .navbar-collapse.collapse .nav-link {
    color: rgba(0, 0, 0, 0.8);
}
.nav-link:hover, .navbar-collapse.collapse.show .nav-link:hover {
    color: #2b8f34;
}
.nav-link.active, .navbar-collapse.collapse.show .nav-link.active  {
    color: #2b8f34;
}

.header-img {
    max-height: 120px;
}

.lead {
    font-size: 2.2rem;
    font-weight: 200;
}

.btn-primary , a .btn-primary {
    background: rgb(43,143,52);
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);    
    font-size: 100%;
    font-weight: 500;
    color: rgba(255,255,255,0.8);
    border-radius: 1rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.btn-primary .container {
    font-size: 100%;
    font-weight: 500;
    color: rgba(255,255,255,0.8);
}
.btn-primary:hover, a .btn-primary:hover , .btn-primary:hover .container{
    color: rgba(255,255,255,1);
    font-weight: 500;
    background: linear-gradient(90deg, rgba(54,173,65,1) 0%, rgba(0,132,189,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    box-shadow: none !important;
}

#btn-invest-now, #btn-watch-intro {
    display: block;
    font-size: 100%;
    font-weight: 500;
    border: 1px solid white; /* Remove borders */
    border-right: none;
    outline: none; /* Remove outline */
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    border-radius: 15px 0px 0px 15px; /* Rounded corners */
    padding: 12px 18px 12px 22px;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.8);
    float: right;
    margin-bottom: 10px;
    z-index: 99;
    -webkit-background-clip: padding-box;
}

#btn-invest-now i, #btn-watch-intro i {
    width: 30px;
}
  
#btn-invest-now:hover, #btn-watch-intro:hover {
    background: linear-gradient(90deg, rgba(54,173,65,1) 0%, rgba(0,132,189,1) 100%);
    color: white;
}

h2 {
    font-size: 1.75rem;
}
h3 {
    font-size: 1.5rem;
}
@media (min-width: 770px) {
    h2 {
        font-size: 2.5rem;
    }
    h3 {
        font-size: 2rem;
    } 
}
    
.btn-invest-download{
    background: rgba(255,255,255,0.7);
    border: 2px solid white;
    border-radius: 10px;
    color: #333;
    mix-blend-mode: screen; 
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.1rem;
    padding: 1rem;
    max-width: 500px;
}
.btn-invest-download:hover{
    background: transparent;
    color: #fff;
}

.invest-col-group {
    background: rgba(0,0,0,0.2);
    border-radius: 15px;
    padding: 1rem;
    height: 100%;
}
/*
.invest-eco {
    background: rgba(43,143,52,1);
}
.invest-soc {
    background: rgba(0,110,157,1);
}*/

.navbar-collapse.collapse.show .dropdown-menu[data-bs-popper] {
    border: none;
}

.navbar-collapse.collapse.show .dropdown-item.active, .navbar-collapse.collapse.show  .dropdown-item.active:hover{
    background: none;
    color: #2b8f34;
}

.dropdown-menu[data-bs-popper] {
    margin-top: 0rem;
    border-top: none;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.dropdown-item.active, .dropdown-item.active:hover{
    background: #2b8f34;
    color: #fff;
}

.dropdown-item:hover {
    background: none;
    color: #2b8f34;
}

#hybrid .intext-image-container {
    padding-top: 0.5rem;
    padding-bottom: 1.5rem;

}

#goals .image-container {
    margin-top: -3rem;
    margin-bottom: 2rem;
}

#myTab .nav-link {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
}

#myTab .nav-link.active {
    font-weight: 700;
}

#myTab .nav-link.active span{
    background: linear-gradient(90deg, rgba(54,173,65,1) 0%, rgba(0,132,189,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#myTab .nav-link i{
    padding-right: 0.5rem;
}

.advantage-heading{
    padding: 0.7rem 0rem 0.5rem 0rem;
    color: #fff;
}

#myTab {
    border-bottom: 4px transparent solid;
}

.tab-content {
    background: rgb(255,255,255);
    padding: 1.5rem 1rem;
    border-bottom-left-radius: 1.4rem;
    border-bottom-right-radius: 1.4rem;
}

.tab-content .list-unstyled {
    margin-bottom: 0px;
}
.tab-content .list-unstyled .fas {
    color: rgba(54,173,65,1);
    font-size: 12px;
}
.tab-content .list-unstyled li {
    margin-bottom: 1rem;
    padding-left: 1rem;
    line-height: 20px;
}


@media (min-width: 768px) {
    #goals .image-container {
        margin-top: -4rem;
    }
}

.invest-card {
    padding: 1.5rem 0.8rem;
    border: none;
    border-radius: 15px;
    -webkit-background-clip: padding-box;
    -webkit-text-fill-color: white;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.4);
    margin-bottom: 1rem;
    background: rgba(0, 0, 0, 0.3);
}

.invest-card .card-body{
    background-color: transparent;
    -webkit-background-clip: padding-box;
    -webkit-text-fill-color: white;
    text-shadow: 1px 1px 1px #222;
    padding: 0rem;
    border: none;
}

.invest-contact-card-link {
    text-decoration: none;
}

.invest-contact-card {
    background: rgba(0, 0, 0, 0.3);
    padding: 0.2rem 0.5rem;
    border: none;
    border-radius: 15px;
    -webkit-background-clip: padding-box;
    -webkit-text-fill-color: white;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.4);
    margin-bottom: 1.4rem;
    margin-right:0rem;
}

.invest-contact-card:hover {
    background: rgba(25, 25, 25, 0.25);
}

@media (min-width: 992px) {
    .invest-contact-card {
        margin-right:1.4rem;
    } 
}

.invest-contact-card .card-body {
    padding: 0.5rem;
}

.notify-me {
    background: rgba(0, 0, 0, 0.3);
    border: none;
    padding: 1rem 1rem;
    border-radius: 15px;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.4);
}
@media (min-width: 576px) {
    .notify-me {
        padding: 1rem 3rem;
    }
}

.btn-notify-me {
    background: rgba(255,255,255,0.7);
    border: 2px solid white;
    border-radius: 10px;
    color: #333;
    mix-blend-mode: screen; 
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.1rem;
    padding: 1rem;
    max-width: 300px;
}
.btn-notify-me:hover{
    background: transparent;
    color: #fff;
}



.contact-form {
    background: rgba(0, 0, 0, 0.3);
    color: #fff;
    padding: 1rem 1rem;
    border: none;
    border-radius: 15px;
    height: 100%;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.4);
    padding: 1rem;
}
@media (min-width: 576px) {
    .contact-form {
        padding: 1rem 3rem;
    }
}

.contact-alert {
    display: none;
}

.contact-success, .notify-success{
    display:none;
    position: relative;
    text-align: start;
    color: rgb(15, 81, 50);
    margin-bottom: 1rem;
    background: rgb(209, 231, 221);
    border-radius: 5px;
    border: 1px solid rgb(186, 219, 204);
    padding: 0.2rem 1rem;
}
.contact-success.active , .notify-success.active{
    display: block;
}
#close-contact-success, #close-notify-success{
    position: absolute;
    top:0.2rem;
    right: 0.5rem;
    cursor: pointer;   
}

.contact-error, .notify-error{
    display:none;
    position: relative;
    text-align: start;
    color: rgb(132, 32, 41);
    margin-bottom: 1rem;
    background: rgb(248, 215, 218);
    border-radius: 5px;
    border: 1px solid rgb(245, 194, 199);
    padding: 0.2rem 1rem;
}
.contact-error.active, .notify-error.active{
    display: block;
}
#close-contact-error, #close-notify-error {
    position: absolute;
    top:0.2rem;
    right: 0.5rem;
    cursor: pointer;   
}

.btn-container {
    position: relative;
    display: flex;
}

.input {
    position: relative;
    display: flex;
    margin-bottom: 1rem;
}

.input .form-control {
    display: inline-block;
    max-width: 100%;
    border: 1px solid white;
    background-color: rgba(255,255,255,0.1);
    border-radius: 5px;
    color: #fff;
    padding-left: 40px;
    height: 40px;
}

.input .form-control:focus {
    box-shadow: 0 0 0 0.15rem rgba(255, 255, 255, 0.1);
}

.input textarea.form-control {
    height:200px;
}

.form-control::-moz-placeholder {
    color: #ccc;
    opacity: 0.8;
}
.form-control:-ms-input-placeholder {
    color: #ccc;
    opacity: 0.8;
}
.form-control::placeholder {
    color: #ccc;
    opacity: 0.8;
}

.input-icon {
    position: absolute;
    top: -5px;
    left: 10px;
    height: 48px;
    font-size: 24px;
    line-height: 48px;
    text-align: left;
    color: #fff;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}

.btn-contact-send {
    background: rgba(255,255,255,0.7);
    border: 2px solid white;
    border-radius: 10px;
    color: #333;
    mix-blend-mode: screen; 
    font-size: 1rem;
    font-weight: 600px;
    letter-spacing: 0.1rem;
}

.btn-contact-send:hover{
    background: transparent;
    color: #fff;
}

.btn-secondary {
    background: rgb(43,143,52);
    font-size: 100%;
    font-weight: 500;
    color: rgba(255,255,255,0.8);
    border-radius: 1rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.btn-secondary:hover{
    background: rgb(54,173,65);
    color: rgba(255,255,255,1);
    font-weight: 500;
}
.btn-secondary:focus{
    background: rgb(43,143,52);
    color: rgba(255,255,255,0.8);
    font-weight: 500;
}


.about-section {
    background: white;
    padding-top: 6rem;
    padding-bottom: 4rem;
}

.about-section p {
    margin-bottom: 1rem;
    text-align:left;
}

h2.blue {
    color: #006e9d;
}
span.green {
    color: #2b8f34;
}

h2.main-heading {
    font-size: 2.5rem;
}

.video-section {
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    padding-top: 4rem;
    padding-bottom: 4rem;
}
@media (min-width: 992px) {
    nav .container {
      max-width: 100%;
    }
}
@media (min-width: 1200px) {
    nav .container {
      max-width: 1140px;
    }
}
@media (min-width: 1400px) {
    nav .container {
      max-width: 1320px;
    }
}

.light-section {
    background: #fff;
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
}

.dark-section {
    background: #f3f3f3;
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
}

.color-section {
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
}

.private-security-section {
    background: #fff;
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.investment-projection-section {
    background: #f3f3f3;
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.strategy-section {
    background: #fff;
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.team-section {
    background: #f3f3f3;
    padding-top: 4rem;
    padding-bottom: 0rem;
}

.team-pic {
    background-color: #fff;
    background-image: url(../assets/img/team_crop.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-attachment: fixed; 
    background-size: 300px auto;
    height: 200px;
    max-width: 1920px;
    margin: 0px auto;
}
@media (min-width: 300px) {
    .team-pic {
        background-size: 400px auto;
        height: 300px;
    }    
}
@media (min-width: 410px) {
    .team-pic {
        background-size: 500px auto;
    }    
}
@media (min-width: 500px) {
    .team-pic {
        background-size: 600px auto;
        height: 350px;
    }    
}
@media (min-width: 500px) {
    .team-pic {
        background-size: 600px auto;
        height: 350px;
    }    
}
@media (min-width: 600px) {
    .team-pic {
        height: 400px;
        background-size: 700px auto;
    }    
}
@media (min-width: 700px) {
    .team-pic {
        background-image: url(../assets/img/team.jpg);
        background-size: 900px auto;
    }    
}
@media (min-width: 900px) {
    .team-pic {
        height: 500px;
        background-size: 1200px auto;
    }    
}
@media (min-width: 1200px) {
    .team-pic {
        height: 550px;
        background-size: 1600px auto;
    }    
}
@media (min-width: 1600px) {
    .team-pic {
        height: 600px;
        background-size: 1920px auto;
    }    
}

.roadmap-section {
    background: #fff;
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.cta-section {
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    padding-top: 0rem;
    padding-bottom: 5rem;
}

h2 span.cta {
    font-size: 4rem;
    font-weight: 800;
    text-transform: uppercase;
    color:#fff;
    display: inline-block;
    height:4.5rem;
    border-bottom: 5px solid #fff;
}

a.no_underline {
    text-decoration: none;
}

.contact-section {
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
}

.contact-section .card {
    border-bottom: none;
}

.contact-section .card i, .contact-section .card h4{
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.contact-section .social a {
    background: rgba(255, 255, 255, 0.3);
    color: rgba(255, 255, 255, 0.7);
}

.logo-container {
    padding: 2rem;
    margin-left: auto;
    margin-right: auto;
    max-width: 400px;
}

.footer {
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    padding: 2.5rem 0 0 0;
    color: #fff;
    font-weight: 500;
}
.footer .container{
    width: 100%;
    max-width: 100%;
    background: rgba(0,0,0,0.5);
    padding-bottom: 1rem;
}

i.fixsize {
    width: 50px;
}

#scroll-btn-box {
    position: fixed;
    bottom: 10%;
    right: 0px;
    z-index: 99;
    display: none;
}

tr {
    border-bottom: 1px solid #666;
    border-top: none;
}

/*td {
    white-space: nowrap;
}*/

#table-heading {
    background-color: #2b8f34;
    color: white;
    border-bottom: 2px solid #333;
}

#table-heading th {
    border-bottom: none;
}

.table > :not(:first-child) {
    border-top: none;
}
  

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color: rgba(12, 155, 216, 0.3);
}

.table > :not(caption) > * > * {
    padding: 1rem 0.5rem;
  }

#btn-invest-now, #btn-watch-intro {
    display: block;
    border: 1px solid white; /* Remove borders */
    border-right: none;
    outline: none; /* Remove outline */
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    border-radius: 15px 0px 0px 15px; /* Rounded corners */
    padding: 12px 18px 12px 22px;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.8);
    float: right;
    margin-bottom: 10px;
    z-index: 99;
    -webkit-background-clip: none;
}

#btn-invest-now i, #btn-watch-intro i {
    width: 30px;
}
  
#btn-invest-now:hover, #btn-watch-intro:hover {
    background: linear-gradient(90deg, rgba(54,173,65,1) 0%, rgba(0,132,189,1) 100%);
    color: white;
    -webkit-background-clip: none;
    -webkit-text-fill-color: white;
}

a.glightbox {
    cursor: zoom-in;
}

.chart-legend-text {
    display: inline-block;
}

.chart-legend-row {
    border-bottom: 1px solid #ddd;
}

.chart-legend-color-box {
    display: inline-block;
    width: 15px;
    height: 15px;
    min-width: 15px;
    min-height: 15px;
    border: 1px solid #333;
    margin-left: 8px;
}
.color-box-c1 {
    background-color: #FF595E;
}
.color-box-c2 {
    background-color: #FF924C;
}
.color-box-c3 {
    background-color: #FFCA3A;
}
.color-box-c4 {
    background-color: #8AC926;
}
.color-box-c5 {
    background-color: #52A675;
}
.color-box-c6 {
    background-color: #1982C4;
}
.color-box-c7 {
    background-color: #4267AC;
}
.color-box-c8 {
    background-color: #6A4C93;
}

.chart-legend-border {
    border: 1px solid #333;
    display: inline-block;
    padding: 0.5rem 1rem;
    margin: 0rem 1rem;
}

/*********************************************************
*                      VIDEO HEADER                      *
**********************************************************/
header {
    position: relative;
    background-color: black;
    height: 90vh;
    min-height: 550px;
    min-width: 390px;
    width: 100%;
    overflow: hidden;
}

header video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 0;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

header .container {
    position: relative;
    z-index: 2;
}

header .overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: black;
    opacity: 0.6;
    z-index: 1;
}

.video-background-holder {
    position: relative;
    background-color: black;
    height: calc(100vh - 72px);
    min-height: 25rem;
    width: 100%;
    overflow: hidden;
}

.counter-box {
	display: block;
	background: #f6f6f6;
    padding-top: 40px;
    padding-bottom: 37px;
    padding-left: auto;
    padding-bottom: auto;
	text-align: center;
    background: #2b8f34;
    max-width: 250px;
    margin-top: 10px;
    margin-bottom: 10px;   
    margin-left:auto;
    margin-right:auto;
}

.counter-box.color1 {
    background: #2b8f34;
}

.counter-box.color2 {
    background: #167F69;
}

.counter-box.color3 {
    background: #006e9d;
}

.counter-box p {
	margin: 5px 0 0;
	padding: 0;
	color: #909090;
	font-size: 18px;
	font-weight: 500;
}

.counter-box i {
	font-size: 60px;
	margin: 0 0 15px;
	color: #d2d2d2;
}
.counter-box .unit {
	color: #fff;
    font-size: 0.75rem;
}

.counter { 
	display: block;
	font-size: 32px;
	font-weight: 700;
	color: #666;
	line-height: 28px;
}
.counter2 { 
	display: block;
	font-size: 32px;
	font-weight: 700;
	color: #fff;
	line-height: 28px;
}

.counter-box p,
.counter-box i,
.counter-box .counter {
	color: #fff;
}
.advantage-box {
    background-color: #fff;
    border-bottom-left-radius: 1.4rem;
    border-bottom-right-radius: 1.4rem;
}

.advantage-border h2{
    font-size: 1.85rem;
}

.advantage-border {
    position: relative;
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    padding: 4px;
    border-radius: 1.5rem;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.3);
}

.advantage-box i {
    font-size: 1.75rem;
}

.advantage-box li {
    font-size: 1.25rem;
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    border-style: dotted;
}

.advantage-box li:hover {
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    -webkit-text-fill-color: #fff;
    -webkit-background-clip: none;
    border: none;
}

.advantage-box .list-group {
    border-top-left-radius: 0rem;
    border-top-right-radius: 0rem;
    border-bottom-left-radius: 1.3rem;
    border-bottom-right-radius: 1.3rem;
}

.share-btn{
    position: relative;
    border: none;
    background: rgba(0,0,0,0.3);
    color: rgba(255,255,255,0.8);
    text-align: center;
    border-radius: 10px;
    font-size: 18px;
    padding: 1rem 3rem;
    cursor: pointer;
    z-index: 2;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.4);
    font-family: "Varela Round", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.15rem;
}

.share-btn i {
    padding-right: 15px;
}

.share-btn:hover {
    background: rgba(25, 25, 25, 0.25);
    color: rgba(255,255,255,1);
}

.share-options{
    position: absolute;
    bottom: 70%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    width: 350px;
    min-width: 350px;
    height: auto;
    transform-origin: bottom left;
    transform: scaleY(0);
    border-radius: 20px;
    background: rgba(15, 15, 15, 0.7);
    color: #fff;
    padding: 20px;
    font-family: 'roboto';
    transition: .5s;
    transition-delay: .5s;;
}

.share-options.active{
    transform: scaleY(1);
    transition-delay: 0s;
}

.title{
    opacity: 0;
    transition: .5s;
    transition-delay: 0s;
    font-size: 20px;
    text-transform: uppercase;
    border-bottom: 1px solid #fff;
    width: fit-content;
    padding: 0 0 1px 0;
    text-align: center;
    font-family: Nunito, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    margin-bottom: 0;
}

.social-media{
    opacity: 0;
    transition: .5s;
    transition-delay: 0s;
    width: 300px;
    height: 60px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin: 10px 0;
}

.social-media-btn{
    border: none;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #000;
    color: #fff;
    line-height: 50px;
    font-size: 25px;
    cursor: pointer;
    margin: 0 5px;
    text-align: center;
}

.social-media-btn:nth-child(1){
    background: #25D366;
}

.social-media-btn:nth-child(2){
    background: #0088cc;
}

.social-media-btn:nth-child(3){
    background: #1DA1F2;
}

.social-media-btn:nth-child(4){
    background: #1877F2;
}

.social-media-btn:nth-child(5){
    background: #0A66C2;
}

.link-container{
    opacity: 0;
    transition: .5s;
    transition-delay: 0s;
    width: 100%;
    position: relative;
    height: 40px;
    display: flex;
    align-items: center;
    border-radius: 40px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    background-color: #fff;
    overflow: hidden;
    padding: 0 10px;
}

.link-field{
    height: 100%;
    line-height: 40px;
    color: #000;
    margin-bottom: 0px;
    font-size: 12px;
    text-align: start;
    letter-spacing: 0.01rem;
}

.share-container {
    position: relative;
}

#close-share-options {
    opacity: 0;
    transition: .5s;
    transition-delay: 0s; 
    position: absolute;
    top:15px;
    right: 15px;
    cursor: pointer;   
}

.copy-btn{
    position: absolute;
    right: -1px;
    cursor: pointer;
    background: #666;
    color: #fff;
    border: none;
    height: 100%;
    width: 50px;
    text-transform: capitalize;
    font-size: 16px;
    padding: 0;
}

.share-options.active .title,
.share-options.active .social-media,
.share-options.active .link-container,
.share-options.active #close-share-options {
    opacity: 1;
    transition: .5s;
    transition-delay: .5s;
}

.plyr--full-ui input[type=range] {
    color: #2b8f34;
}
  
.plyr__control--overlaid {
    background: rgba(43, 143, 52, .8);
}
  
.plyr--video .plyr__control.plyr__tab-focus,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control[aria-expanded=true] {
    background: #2b8f34;
}
  
.plyr__control.plyr__tab-focus {
    box-shadow: 0 0 0 5px rgba(43, 143, 52, .5);
}
  
.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before {
    background: #2b8f34;
}

.main-timeline7{overflow:hidden;position:relative}
.main-timeline7 .timeline{width:50%;float:left;z-index:1;position:relative}
.main-timeline7 .timeline:after,.main-timeline7 .timeline:before{content:"";display:block;clear:both}
.main-timeline7 .timeline:before{content:"";width:40px;height:90%;background:#0070c0;position:absolute;top:10%;right:-20px}
.main-timeline7 .timeline:last-child:before{height:100%}
.main-timeline7 .timeline-icon{width:80px;height:80px;border-radius:50%;background:#0070c0;overflow:hidden;text-align:center;position:absolute;top:0;right:-40px;z-index:3}
.main-timeline7 .timeline-icon:before{content:"";width:60px;height:60px;border-radius:50%;background:#fff;border:2px solid #0070c0;box-shadow:0 0 0 4px #5ea7db;margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}
.main-timeline7 .timeline-icon i{font-size:35px;color:#5c5c5c;line-height:80px;z-index:1;position:relative}
.main-timeline7 .year{display:block;padding:0 60px 0 30px;font-size:30px;color:#0070c0;text-align:right;border-bottom:2px solid #303a3b;z-index:2;position:relative}
.main-timeline7 .year:before{content:"";display:block;width:30px;height:30px;border-radius:50%;background:#0070c0;border:5px solid #fff;box-shadow:0 0 0 4px #0070c0;margin:auto;position:absolute;bottom:-15px;left:4px}
.main-timeline7 .year:after{content:"";border-left:10px solid #303a3b;border-top:10px solid transparent;border-bottom:10px solid transparent;position:absolute;bottom:-11px;left:50px}
.main-timeline7 .timeline-content{padding:18px 60px 18px 40px;text-align:right;position:relative;z-index:1}
.main-timeline7 .timeline-content:after,.main-timeline7 .timeline-content:before{content:"";width:80px;height:150px;border-radius:50%;background:#fff;position:absolute;top:-7%;right:15px;z-index:-1}
.main-timeline7 .timeline-content:after{left:auto;right:-95px}
.main-timeline7 .timeline:last-child .timeline-content:after,.main-timeline7 .timeline:last-child .timeline-content:before{content:"";width:80px;height:150px;border-radius:50%;background:transparent;position:absolute;top:-7%;right:15px;z-index:-1}
.main-timeline7 .title{font-size:22px;font-weight:700;color:#0070c0;margin-top:0;text-transform: uppercase;}
.main-timeline7 .description{font-size:15px;color:#59595a;line-height:25px}
.main-timeline7 .timeline:nth-child(2){margin-top:140px}
.main-timeline7 .timeline:nth-child(even){margin-bottom:80px}
.main-timeline7 .timeline:nth-child(odd){margin:-140px 0 0}
.main-timeline7 .timeline:first-child,.main-timeline7 .timeline:last-child:nth-child(even){margin:0!important}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon,.main-timeline7 .timeline:nth-child(2n):before{right:auto;left:-20px;background:#e77e21}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon{left:-40px}
.main-timeline7 .timeline:nth-child(2n) .year{padding:0 30px 0 60px;text-align:left}
.main-timeline7 .timeline:nth-child(2n) .year:before{left:auto;right:3px}
.main-timeline7 .timeline:nth-child(2n) .year:after{border-left:none;border-right:10px solid #303a3b;right:50px}
.main-timeline7 .timeline:nth-child(2n) .timeline-content{padding:18px 40px 18px 60px;text-align:left}
.main-timeline7 .timeline:nth-child(2n) .timeline-content:before{left:-95px}
.main-timeline7 .timeline:nth-child(2n) .timeline-content:after{left:15px}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon:before{border-color:#e77e21;box-shadow:0 0 0 4px #f1a563}
.main-timeline7 .timeline:nth-child(2n) .year:before{background:#e77e21;box-shadow:0 0 0 4px #e77e21}
.main-timeline7 .timeline:nth-child(2n) .title{color:#e77e21}
.main-timeline7 .timeline:nth-child(2n) .year{color:#e77e21}
.main-timeline7 .timeline:nth-child(3n) .timeline-icon,.main-timeline7 .timeline:nth-child(3n):before{background:#ca2263}
.main-timeline7 .timeline:nth-child(3n) .timeline-icon:before{border-color:#ca2263;box-shadow:0 0 0 4px #ec6f9f}
.main-timeline7 .timeline:nth-child(3n) .year:before{background:#ca2263;box-shadow:0 0 0 4px #ca2263}
.main-timeline7 .timeline:nth-child(3n) .title{color:#ca2263}
.main-timeline7 .timeline:nth-child(3n) .year{color:#ca2263}
.main-timeline7 .timeline:nth-child(4n) .timeline-icon,.main-timeline7 .timeline:nth-child(4n):before{background:#d6aa54}
.main-timeline7 .timeline:nth-child(4n) .timeline-icon:before{border-color:#d6aa54;box-shadow:0 0 0 4px #ecd29c}
.main-timeline7 .timeline:nth-child(4n) .year:before{background:#d6aa54;box-shadow:0 0 0 4px #d6aa54}
.main-timeline7 .timeline:nth-child(4n) .title{color:#d6aa54}
.main-timeline7 .timeline:nth-child(4n) .year{color:#d6aa54}
.main-timeline7 .timeline:nth-child(5n) .timeline-icon,.main-timeline7 .timeline:nth-child(5n):before{background:#68b818}
.main-timeline7 .timeline:nth-child(5n) .timeline-icon:before{border-color:#68b818;box-shadow:0 0 0 4px #91d050}
.main-timeline7 .timeline:nth-child(5n) .year:before{background:#68b818;box-shadow:0 0 0 4px #68b818}
.main-timeline7 .timeline:nth-child(5n) .title{color:#68b818}
.main-timeline7 .timeline:nth-child(5n) .year{color:#68b818}
.main-timeline7 .timeline:nth-child(6n) .timeline-icon,.main-timeline7 .timeline:nth-child(6n):before{background:#087979}
.main-timeline7 .timeline:nth-child(6n) .timeline-icon:before{border-color:#087979;box-shadow:0 0 0 4px #48a1a1}
.main-timeline7 .timeline:nth-child(6n) .year:before{background:#087979;box-shadow:0 0 0 4px #087979}
.main-timeline7 .timeline:nth-child(6n) .title{color:#087979}
.main-timeline7 .timeline:nth-child(6n) .year{color:#087979}
.main-timeline7 .timeline:nth-child(7n) .timeline-icon,.main-timeline7 .timeline:nth-child(7n):before{background:#8b1f1f}
.main-timeline7 .timeline:nth-child(7n) .timeline-icon:before{border-color:#8b1f1f;box-shadow:0 0 0 4px #ac4e4e}
.main-timeline7 .timeline:nth-child(7n) .year:before{background:#8b1f1f;box-shadow:0 0 0 4px #8b1f1f}
.main-timeline7 .timeline:nth-child(7n) .title{color:#8b1f1f}
.main-timeline7 .timeline:nth-child(7n) .year{color:#8b1f1f}
@media only screen and (max-width:990px){.main-timeline7 .timeline{width:100%}
.main-timeline7 .timeline:nth-child(even),.main-timeline7 .timeline:nth-child(odd){margin:0}
.main-timeline7 .timeline:before,.main-timeline7 .timeline:nth-child(2n):before{width:30px;height:100%;left:25px}
.main-timeline7 .timeline-icon,.main-timeline7 .timeline:nth-child(2n) .timeline-icon{left:0}
.main-timeline7 .timeline:nth-child(2n) .year,.main-timeline7 .year{text-align:left;padding:0 30px 0 100px}
.main-timeline7 .timeline:nth-child(2n) .year:before,.main-timeline7 .year:before{left:auto;right:4px}
.main-timeline7 .year:after{left:auto;right:50px;border-right:10px solid #303a3b;border-left:none}
.main-timeline7 .timeline-content .description{color:#666}
.main-timeline7 .timeline-content,.main-timeline7 .timeline:nth-child(2n) .timeline-content{text-align:left;padding:18px 40px 18px 100px}
.main-timeline7 .timeline-content:after,.main-timeline7 .timeline-content:before{width:0;height:0}
}
/* ---------- AWG - Atmospheric Water Generation ---------- */
.awg-subtitle {
    color: #006e9d;
    font-size: 1.25rem;
    font-weight: 600;
}

.awg-drop-img {
    max-height: 320px;
    border-radius: 1.5rem;
}

.awg-rounded-img {
    border-radius: 1.5rem;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}

.awg-check-list li {
    position: relative;
    padding-left: 1.75rem;
    margin-bottom: 0.6rem;
}
.awg-check-list li i {
    position: absolute;
    left: 0;
    top: 0.3rem;
    color: #2b8f34;
}

.awg-feature {
    height: 100%;
    padding: 1.5rem 1rem;
    background: #fff;
    border-radius: 1.5rem;
    border-bottom: 0.25rem solid #2b8f34;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}
.awg-feature img {
    height: 90px;
    margin-bottom: 1rem;
}
.awg-feature h5 {
    color: #006e9d;
    font-weight: 700;
}
.awg-feature p {
    margin-bottom: 0;
    font-size: 0.95rem;
}

.awg-stat {
    padding: 1rem;
}
.awg-stat .awg-stat-value {
    display: block;
    font-size: 3.5rem;
    font-weight: 800;
    line-height: 1.1;
    color: #006e9d;
}
.awg-stat .awg-stat-label {
    display: block;
    font-size: 1.15rem;
    font-weight: 600;
}
@media (min-width: 992px) {
    .awg-stat .awg-stat-value {
        font-size: 4.5rem;
    }
}

.awg-tier-heading {
    color: #006e9d;
    font-weight: 700;
}
.awg-tier-heading .awg-tier-capacity {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.15rem 0.75rem;
    border-radius: 1rem;
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 600;
    vertical-align: middle;
}

.awg-model {
    height: 100%;
    padding: 1.5rem 1.25rem;
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}
.awg-model .awg-model-img {
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}
.awg-model .awg-model-img img {
    max-height: 100px;
    max-width: 100%;
}
.awg-model h4 {
    color: #2b8f34;
    font-weight: 700;
}
.awg-model .awg-model-capacity {
    font-size: 1.5rem;
    font-weight: 800;
    color: #006e9d;
}
.awg-model table {
    width: 100%;
    margin: 0.75rem 0;
    font-size: 0.9rem;
    text-align: left;
}
.awg-model table td {
    padding: 0.3rem 0;
    border-bottom: 1px solid #e5e5e5;
}
.awg-model table td:last-child {
    text-align: right;
    font-weight: 600;
}
.awg-model p {
    margin-bottom: 0;
    font-size: 0.9rem;
}

.awg-compare {
    height: 100%;
    padding: 1.5rem;
    border-radius: 1.5rem;
    text-align: left;
}
.awg-compare h4 {
    text-align: center;
    margin-bottom: 1rem;
}
.awg-compare ul {
    margin-bottom: 0;
}
.awg-compare-old {
    background: #f3f3f3;
    border: 2px solid #d5d5d5;
}
.awg-compare-old h4, .awg-compare-old li i {
    color: #9b2c2c;
}
.awg-compare-new {
    background: #fff;
    border: 2px solid #2b8f34;
}
.awg-compare-new h4 {
    color: #006e9d;
}

.awg-highlight {
    padding: 1.25rem 1.5rem;
    border-radius: 1.5rem;
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    color: #fff;
}

/* ---------- N2life - Biomass to Electricity ---------- */
.n2l-icon {
    color: #2b8f34;
    margin-bottom: 1rem;
}

.n2l-stage {
    height: 100%;
    overflow: hidden;
    background: #fff;
    border-radius: 1.5rem;
    border-bottom: 0.25rem solid #2b8f34;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}
.n2l-stage img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    background: #283038;
}
.n2l-stage-body {
    padding: 1.25rem 1rem;
}
.n2l-stage-no {
    display: inline-block;
    margin-bottom: 0.5rem;
    padding: 0.15rem 0.75rem;
    border-radius: 1rem;
    background: linear-gradient(90deg, rgba(43,143,52,1) 0%, rgba(0,110,157,1) 100%);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
}
.n2l-stage h5 {
    color: #006e9d;
    font-weight: 700;
}
.n2l-stage p {
    margin-bottom: 0;
    font-size: 0.9rem;
}

.n2l-flow {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 1.5rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style-position: inside;
    font-size: 0.9rem;
    font-weight: 600;
    color: #006e9d;
}

.n2l-table-wrap {
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}
.n2l-table {
    font-size: 0.9rem;
    vertical-align: middle;
}
.n2l-table thead th {
    background: #006e9d;
    color: #fff;
    font-weight: 600;
    white-space: nowrap;
    border: none;
}
.n2l-table td, .n2l-table tbody th {
    white-space: nowrap;
}
.n2l-table tbody td strong {
    color: #2b8f34;
}
.n2l-table .n2l-table-group td {
    background: #f3f3f3;
    color: #006e9d;
    font-weight: 700;
    text-align: left;
}
.n2l-cmp td, .n2l-cmp tbody th {
    white-space: normal;
    text-align: left;
}
.n2l-cmp td.n2l-cmp-best {
    background: rgba(43, 143, 52, 0.08);
    color: #1f6b26;
    font-weight: 600;
}

.n2l-app {
    height: 100%;
    padding: 1.25rem 0.5rem;
    background: #fff;
    border-radius: 1.5rem;
    box-shadow: 0 0.0625rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}
.n2l-app i {
    display: block;
    margin-bottom: 0.75rem;
    color: #2b8f34;
}
.n2l-app span {
    font-size: 0.9rem;
    font-weight: 600;
}

.n2l-emis .awg-stat .awg-stat-value {
    font-size: 3rem;
}
@media (min-width: 992px) {
    .n2l-emis .awg-stat .awg-stat-value {
        font-size: 3.5rem;
    }
}