/* Header */
.header {display:flex; align-items:center; -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition:all .3s; -o-transition:all .3s; -o-transition:all .3s}
.navbar-fixed-top {position:fixed;top:0;z-index:999}
.nav-link {padding-right: .7rem !important; padding-left: .7rem !important; font-weight:700}
.navbar-collapse {flex-grow: unset;}
.navbar {-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out}
.bg-white .nav-link {color:#333}
.nav-link:hover, .bg-white .nav-link:hover, .bg-white .active .nav-link {color:#81B827}
.logo {width:200px}
.nav-lang, .bg-white .nav-lang {color:#81B827}
.nav-lang span {border:2px solid #81B827; border-radius:.3rem; padding:5px}

/* Bg */
.nn-bg {padding:100px 15px; background:#231F20 url(../img/gt.jpg) no-repeat 50% 50%; position:relative}
.nn-bg-caption {padding-top:120px; text-align:center}
.nn-bg-caption h1 {font-size:3rem; font-weight:700; color:#FFF; margin:0}
.nn-bg-caption h2 {color:#81B827; font-weight:700; margin-top:.5rem}
.nn-bg-caption p {font-size:1.6rem; color:#FFF; margin:2rem 0}
p.nn-btn {text-shadow:none; font-size:1.4rem}
p.nn-btn a {border-radius:.3rem; text-transform:uppercase; color:#FFF; display:inline; padding:10px 15px; border:2px solid #FFF; text-decoration:none}
p.nn-btn a:hover {background-color:#FFF; color:#333}
p.nn-btn a.nn-btn-full {background-color:#81B827; border:2px solid #81B827; color:#FFF}
p.nn-btn a.nn-btn-full:hover {background-color:#4F814E; border:2px solid #4F814E}
p.nn-btn a.nn-btn-outl {background:none; border:2px solid #231F20; color:#231F20}
p.nn-btn a.nn-btn-outl:hover {background:none; border:2px solid #81B827; color:#81B827}

/* Breadcrumbs */
.bread {margin-top:30px}
.bread p {padding:10px 20px; margin:0}
.bread p a {background:url(../img/bc.png) center right no-repeat; padding-right:24px; margin-right:5px}

/* Content */
.nnco {padding:30px 15px 50px 15px}
.nn-content {background-color:#FFF; border:1px solid rgba(0,0,0,.125); border-radius:.25rem; padding:25px 50px 50px 50px}
.nn-content h2 {color:#81B827; margin:3rem 0 1rem 0; font-weight:700}
.nn-content h2:after {content: ""; display: block; width: 50px; border-top: 6px dotted #81B827; margin: 15px 0 10px}
.nn-content h3 {margin:4rem 0 1rem 0; font-weight:700}
.nn-content h3:after {content: ""; display: block; width: 50px; border-top: 6px dotted #E5E5E5; margin: 15px 0 10px}
.nn-content ol li::marker {color:#81B827}
.nn-content ul li::marker {color:#EAEAEA}

/* Video */
.videoWrapper {position:relative; padding-bottom:56.25%; /* 16:9 */ height:0}
.videoWrapper iframe {position:absolute; top:0; left:0; width:100%; height:100%}

/* Contact form */
.nn-form {padding: 50px; background: #81B827 url(../img/form.jpg) no-repeat 50% 50%}
.nn-form h2 {font-weight:700; margin:3rem 0; color:#FFF}
.nn-form label {color:#FFF; font-size: 1.2rem}
.nn-form p, .nn-form a {color:#FFF}

/* Green Technology */
.gt {padding:50px 0}
.gt h2 {text-align:center; font-weight:700; margin:3rem 0 .5rem 0}
.gt h3 {text-align:center; font-weight:700; color:#81B827}

/* News */
.news {padding:50px 0}
.news h2 {text-align:center; font-weight:700; margin:3rem 0}
.news h3 {font-size: 1.4rem; margin:1rem 0}
.ncb h2 {margin:0}

/* Benefits */
.benefits {margin:4rem 0}
.benefits p {text-align:center}
.benefits p.ben-ico {font-size:3rem; color:#81B827; margin:0}

/* Services */
.services {padding:50px 0}
.services h2 {text-align:center; font-weight:700; margin:3rem 0}
.services p {text-align:center}
.services p.serv-icon {font-size:4rem; color:#81B827}
.services p.serv-title {font-size:1.4rem; font-weight:700}

/* Calculator advertisement */
.calcadv {padding: 50px; background: #81B827 url(../img/calcadv.jpg) no-repeat 50% 50%}
.calcadv .card {background:#FFF url(../img/symbbl.png) no-repeat center center}
.calcadv h2 {text-align:center; font-weight:700; margin:3rem 0 1.5rem 0}
.calcadv h2 i {color:#81B827; margin-right:.5rem}
.calcadv p {text-align:center}
.calcadv p a i {margin-right:.5rem}

/* Interest */
.fyi {padding: 50px; background: #81B827 url(../img/serv.jpg) no-repeat 50% 50%}
.fyi .card {background:#FFF url(../img/symbbl.png) no-repeat center center}
.fyi h2 {text-align:center; font-weight:700; margin:3rem 0 1.5rem 0}
.fyi h2 i {color:#81B827; margin-right:.5rem}
.fyi p {text-align:center}
.fyi p a i {margin-right:.5rem}

/* Technology */
.tech {padding:50px 0; background: #F8F9FA url(../img/tech.jpg) no-repeat 50% 50%}
.tech h2 {text-align:center; font-weight:700; margin:3rem 0}
.tech p {text-align:center}
.tech p.serv-icon {font-size:4rem; color:#81B827}
.tech p.serv-title {font-size:1.4rem; font-weight:700}

/* Refs */
.refs {padding:50px 0}
.refs h2 {text-align:center; font-weight:700; margin:3rem 0}
.refs p {font-style:italic}
.refs p.lead {text-align:right; font-style:normal}
.refs .card {background:#FFF url(../img/symbbl.png) no-repeat center center}

/* Stats */
.stats {background:#81B827 url(../img/symbbl.png) no-repeat 75% center !important; padding:50px; text-align:center}
.stats p {color:#FFF; padding:0; margin:0; font-size:1.4rem}
.stats p.stat-title {font-size:3rem; font-weight:700}

/* Googlemap */
#map {width:100%; height:500px}
.mapinfo {padding:15px}
.mapinfo p {font-size:1rem; line-height:2rem}

/* Footer */
.bg-nn {background-color:#231F20 !important}
.footer {padding:50px 0; background:url(../img/symbwh.png) no-repeat 25% center}
.footer p {color:#FFF}
.footer p.text-gray:after {content: ""; display: block; width: 38px; border-top: 3px solid #4d4d4d; margin: 5px 0 5px}
.footer-links a {text-transform:uppercase; color:#FFF; text-decoration:none}
.footer-links a:hover {color:#81B827}
a.maplink {color:#FFF; text-decoration:none}
a.maplink:hover {color:#FFF; text-decoration:underline}
.footer-newsletter {margin-top:40px}
.footer-newsletter p a {text-transform:none}
.copyright {padding:20px 0 10px 0; background-color:#322E2F}
.copyright p {color:#999}
.soc-icons a {font-size:1.5rem; margin-right:10px}

/* Sticky Bar */
.stickybar {display:block; top:150px; right:0; bottom:auto; left:auto; position:fixed; z-index:1000}
.stickybar p {padding:0; margin:5px 0}
.stickybar a {display:block; padding:10px; font-size:0.9rem}
.stickybar a i {font-size:2rem}

/* Dropdown menu */
.dropdown-item {font-size: 1.1rem; font-weight:700}
.dropdown-item:focus {background-color:#81B827}
.dropdown-submenu {position:relative}
.dropdown-submenu> a:after {float:right; display:inline-block; width:0; height:0; margin-left:.255em; margin-top:7px; vertical-align:0; content:""; border-top:.3em solid transparent; border-bottom:.3em solid transparent; border-left: .3em solid; color:#999}
.dropdown-submenu>.dropdown-menu {top:0; left:100%; margin-top:0px; margin-left:0px}
.dropdown-submenu:hover>.dropdown-menu {display:block}

/* Modal */
.modal-header h1 {font-weight:700}
.modal-body button {text-transform:none}
.modal-footer {display:inline}
.modal-footer p {text-align:center; font-size:1.2rem}

/* Colorize */
.bw {-webkit-filter: grayscale(100%); -webkit-transition: .3s ease-in-out; -moz-filter: grayscale(100%); -moz-transition: .3s ease-in-out; -o-filter: grayscale(100%);  -o-transition: .3s ease-in-out}
.bw:hover {-webkit-filter: grayscale(0%); -webkit-transition: .3s ease-in-out; -moz-filter: grayscale(0%); -moz-transition: .3s ease-in-out; -o-filter: grayscale(0%); -o-transition: .3s ease-in-out}

/* Typography */
a, button {font-weight:700; -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition:all .3s; -o-transition:all .3s; -o-transition:all .3s}
a {color:#81B827}
a:hover {color:#4F814E}
strong, .btn {font-weight:700}
button {text-transform:uppercase}
.text-gray {color:#999 !important}
.wrap-link {overflow-wrap:break-word; word-wrap: break-word}
.btn-nn {background-color:#81B827; border:2px solid #81B827; color:#FFF}
.btn-nn:hover {background-color:#4F814E; border:2px solid #4F814E; color:#FFF}
hr.hs {border:3px solid #81B827; width:50px; text-align:left; margin-left:0; margin-bottom:2rem; opacity:0.5}
hr.hs2 {border:3px solid #E5E5E5; width:50px; text-align:left; margin-left:0; margin-bottom:2rem; opacity:0.8}
p.bigt {text-align:center; font-size:1.4rem; font-weight:700}

body {font-size:1.2rem; font-family:'Titillium Web', sans-serif}
h1, h2, h3, h4, h5, h6 {font-family:'Dosis', sans-serif}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {  
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .nn-bg {padding:100px 15px 60px 15px}
    .nn-bg-caption {padding-top:50px}
    .nn-bg-caption h1 {font-size:2rem}
    .nn-bg-caption p {font-size:1.3rem; line-height:1.6rem}
    .nn-content {padding:0 25px 25px 25px}
    .logo {width:80px}
    .stickybar {bottom:75px; top:auto}
    .stickybar span {display:none; visibility:hidden}
}