html{scroll-behavior: smooth;}
::selection {background: #f4f9f5; color: #06201b; text-shadow: none;}
::-moz-selection {background: #f4f9f5; /* Firefox */ color: #06201b; text-shadow: none;}
::-webkit-selection {background: #f4f9f5; /* Safari */ color: #06201b; text-shadow: none;}

body{font-family: 'Roboto', sans-serif; font-size:14px; line-height: 22px; color:#06201b; margin: 0px; padding: 0px; background-color:#ffffff; -webkit-font-smoothing: antialiased;}
ul {list-style: none; margin:0;	padding:0;}
ul,li{padding:0; margin:0;}
li{list-style-type: none; font-size: 14px; text-transform: uppercase; font-weight: bold;}
.navbar-nav{margin: 0 0 0 0;}
.navbar-nav li a:hover,
.navbar-nav li a:focus {outline:none;	outline-offset: 0;text-decoration:none; background: transparent;}
a {color: #4f4f4f;	text-decoration: none;-webkit-transition: 300ms;	-moz-transition: 300ms;	-o-transition: 300ms;	transition: 300ms;}
a:focus, a:hover {color: #23527c; text-decoration: underline;}
a:active, a:hover {outline: 0;}
span{font-size: 18px; line-height: 30px; color: #778e89;}

h1{font-family: 'Outfit', sans-serif; font-size:68px; color: #06201b; line-height: 84px; font-weight: normal; margin: 0 0 0 0; padding: 0 0 0 0;}
h2{font-family: 'Outfit', sans-serif; font-size:48px; color: #06201b; line-height: 58px; font-weight: normal; margin: 0 0 0 0; padding: 0 0 0 0;}
h3{font-family: 'Outfit', sans-serif; font-size:38px; color: #06201b; line-height: 48px; font-weight: normal; margin: 0 0 0 0; padding: 0 0 0 0;}
h4{font-family: 'Outfit', sans-serif; font-size:28px; color: #06201b; line-height: 38px; font-weight: normal; margin: 0 0 0 0; padding: 0 0 0 0;}
h5{font-family: 'Outfit', sans-serif; font-size:18px; color: #06201b; line-height: 22px; font-weight: normal; margin: 0 0 0 0; padding: 0 0 0 0;}
h6{font-family: 'Roboto', sans-serif; font-size:18px; color: #06201b; line-height: 28px; font-weight: normal; margin: 0 0 0 0; padding: 0 0 0 0;}
p{font-family: 'Roboto', sans-serif; font-size:14px; line-height: 24px; color:#06201b; margin:0px 0 0 0; padding: 0 0 0 0;}
/* font-family: 'League Gothic', sans-serif; */

@media (max-width:767px){
  h1{ font-size: 12vw; margin: 0 0 0 0; line-height: normal;}
  h2{ font-size: 9vw; margin: 0 0 0 0;}
  /* h3{ font-size: 22px !important; } */
  /* h4{ font-size: 6vw !important; } */
  p{font-size: 16px;}
}
mark, .mark{background: rgb(19, 111, 245); color: #ffffff;}
.padding-hundred{padding: 100px;}
.padding-top {padding-top:150px;}
.padding-bottom{padding-bottom:150px;}
.padding-none{padding: 0 0 0 0;}
.space-50{padding-top:50px;}
.space-bottom-50{padding-bottom:50px;}

.navbar-toggle {/*border:1px solid #fff;*/	margin-top:15px;}
.navbar-toggle i{color: #ffffff; font-size: 34px;}
.main-nav {left: 0;	position: absolute;	top: 0;	width: 100%; z-index: 1000; border: 0px;}
.top-bar-hide {display: none;}
.top-bar {position:absolute; right:30px;	top:35px;	z-index: 10;}
.top-bar span {margin-left:10px; float: left;}
.top-bar span a {color: #ffffff; font-size: 14px; float: left; background: #00745c; padding: 10px 35px; -webkit-border-radius: 36px; -moz-border-radius: 36px; border-radius: 36px;}
/* .top-bar span a:hover {color:rgb(255 255 255 / 65%); border: 0;} */
.top-bar span a:hover {color: #179753; text-decoration: none; background: #17ea7b; }
/* .top-bar span a.active-sub {border-bottom: 2px solid #ffffff; color: rgb(255 255 255 / 85%); text-decoration: none;} */

#navigation .container {position:relative;}
.navbar-brand {width: 300px; height:auto; padding: 0px; margin:15px 0 0 0;}
.navbar-brand a:hover{border: 0px;}
#navigation .navbar-right {margin-top: 60px; margin-right: 0px;}
#navigation .navbar-right li a {color:#ffffff; height: 100%; font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: normal; text-transform: none; margin: 0 3px; padding:3px 10px;}
#navigation .navbar-right li a.active,
#navigation .navbar-right li a:hover,
#navigation .navbar-right li a:focus,
#navigation .navbar-right li.active a{border-bottom: 3px solid #f9068b;}

.primary-btn{width: auto; float: left; margin: 0; padding: 16px 30px; background: none; color: #06201b; -webkit-font-smoothing:auto; font-size: 14px; line-height: normal; -webkit-border-radius:75px; moz-border-radius: 75px; border-radius:75px; border: 2px solid #06201b; text-align:center; display:block;}
.primary-btn:hover{text-decoration: none; background: #06201b; color: #ffffff;}
.primary-btn i{font-size: 16px; padding: 0 0 0 12px;}
.secondary-btn{padding: 16px 30px; float: left; line-height: normal; border: 2px solid #98989a; font-size: 14px; color: #000000; margin: 0 0 0 0; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.secondary-btn:hover{color: #fff; background: #f727b5; border: 2px solid #f727b5; text-decoration: none; border:1px solid #f727b5; text-decoration: none; -webkit-box-shadow: 0px 10px 18px -11px rgb(139 139 139); -moz-box-shadow: 0px 10px 18px -11px rgb(139 139 139); box-shadow: 0px 10px 18px -11px rgb(139 139 139);}
.submit-btn{padding: 16px 30px; background: #06201b; color: #ffffff; font-family: 'Roboto', sans-serif; -webkit-font-smoothing:auto; font-size: 14px; line-height: normal; -webkit-border-radius:6px; moz-border-radius: 6px; border-radius:6px; border: 0px; text-align:center;}
.submit-btn:hover{text-decoration: none; background: #00745c; color: #fffde8;}
.underline-btn{width: auto; float: left; margin: -15px 0 0 30px; padding: 0px 10px; border-bottom: 2px solid #17ea7b; font-size: 14px; color: #06201b;}
.underline-btn:hover{text-decoration: none; border-bottom: 3px solid #98989a; color: #98989a;}
.roundshadow-btn{width: auto; height: auto; padding: 15px 45px 15px 35px; text-align: center; text-decoration: none; -webkit-border-radius: 36px; -moz-border-radius: 36px; border-radius: 36px; box-shadow: -1px 2px 20px -9px rgb(193 193 193); -webkit-box-shadow: -1px 2px 20px -9px rgb(193 193 193); -moz-box-shadow: -1px 2px 20px -9px rgb(193 193 193);}
.roundshadow-btn span{position: absolute; padding-left: 5px}
.roundshadow-btn:hover{text-decoration: none; background: #06201b; color: #ffffff;}
.logoelement-btn{width: auto; float: left; margin: 0; padding: 10px 40px 10px 25px; background: none; color: #17ea7c; -webkit-font-smoothing:auto; font-size: 14px; line-height: normal; -webkit-border-radius:75px; moz-border-radius: 75px; border-radius:75px; border: 2px solid #17ea7c; text-align:center; display:block;}
.logoelement-btn:hover{text-decoration: none; background: #17ea7c; color: #06201b;}
/*++++++++++++++++
Footer CSS
+++++++++++++++++*/
.footer-logo-typo{width: 100%; height: auto; float: left;}
.footer {width: 100%; height: auto; float: left; background: #ffffff; padding: 40px 0 0 0;}
.footer .container .row{border-top: 1px solid #b3c6c2; border-bottom: 1px solid #b3c6c2;}
.footer h4{font-size: 16px; padding-bottom: 10px;}
.foot-readmore-link{font-size:14px; text-decoration: none; float: left; color: #464646;}
.foot-readmore-link:hover {color: #8e90a3; text-decoration: underline; text-decoration-color: #17ea7c; text-decoration-thickness: 2px;}
/* .foot-readmore-link:hover{color: #8e90a3; text-decoration-color: #17ea7c; text-decoration-thickness: 2px;} */
.logofooter {width: 100%; height: auto; float: left; padding:0 0;}
.logofooter span{width: 100%; height: auto; float: left; padding:10px 0 30px 0; font-size:12px; line-height: 22px;}
.logofooter img{width: 70px; padding: 10px;}
.footer-col{float: left;}
.footer-ul {list-style-type:none; padding-top:20px; margin-left:0px; float: left; margin-bottom:0px;}
.footer-ul li {width:auto; float: left; font-size:14px; list-style: none; padding: 0px 15px;}
.footer-ul li:last-child{border-right: 0px;}
.footer-ul li a {text-transform: none; font-weight: normal; color: #06201b;}
.footer-ul li a:hover {color: #8e90a3; text-decoration: underline; text-decoration-color: #17ea7c; text-decoration-thickness: 2px;}
.social-links{margin: 0 0 0 0;}
.social-links h4{padding: 0 0 0 0;}
.social-links P{padding-bottom: 20px;}
.social-links ul{width: auto; height:  auto; float: right; padding: 20px 0 0 0px;}
.social-links ul li{width: auto; height:  auto; float: left; padding-top: 0px; padding-right: 10px; list-style: none;}
.social-links ul li a{width: auto; height: auto; font-size:14px; color: #19ea7c; background: #00745c; padding: 8px 10px; border-radius: 36px;}
.social-links ul li a svg{fill:#19ea7c;}
.social-links ul li a svg:hover{fill:#17ea7c;}
.copyright {width: 100%; float: left; background: none; padding: 25px 0; margin: 0px 0 0 0;}
/* .copyright .container{border-top: 1px solid #000000} */
.copyright .col-md-6{padding: 0px;}
.copyright p { text-align:left; font-size: 14px; padding:10px 20px 10px 0px; margin-bottom:0; float: left;}
.post{width: 100%; height: auto; float: left; padding: 0px 0 0 0;}
.post p { font-size:14px; padding-bottom: 30px; text-transform: capitalize;}
.email-call{width: 100%; height: auto; float: left; padding: 0px 10px 30px 0px;}
.email-call span{width:100%; height: auto; float: left; padding: 0 15px 0 0;}
.email-call i {color:#464646; font-size:18px; padding-right:5px;}
.email-call a { color:#464646; font-size:15px;}
.email-call a:hover {color: #8e90a3; text-decoration: underline; text-decoration-color: #17ea7c; text-decoration-thickness: 2px;}

footer .email-call span{width:auto; height: auto; float: left; font-size: 12px;}
footer .email-call i {font-size:18px; padding-right: 15px;}
footer .email-call a {font-size:14px;}
footer .email-call a:hover {color: #8e90a3; text-decoration: underline; text-decoration-color: #17ea7c; text-decoration-thickness: 2px;}

.bottom_ul { list-style-type:none; float: left; padding-top:14px; padding-bottom: 14px; margin-bottom:0;}
.bottom_ul li {color: #000000; float:left; line-height:18px; font-size: 12px; text-transform: none; font-weight: normal; list-style: none; border-right: 1px solid #000000; padding: 0 5px;}
.bottom_ul li:last-child{border-right: 0px;}
.bottom_ul li a { color:#000000;  font-size:12px;}

/* kreativemug styles */
.kreativemug{width:auto; float: right; margin-top: 0;}
.kreativemug span{text-align: left; color: #00755d; font-size: 12px; padding: 10px 0; margin-bottom: 0; float: left;}
.kreativemug a{text-align: left; color: #00755d; font-size: 12px; padding: 13px 0 0 0; margin-bottom: 0; float: left;}
.kreativemug i{font-size: 16px; color: #00755d; float: left; padding: 17px 6px 0 6px;}
.kreativemug a:hover{opacity: 0.8; text-decoration: underline;}
/* subpage css */
.sub-pg-banner{width:100%; height: 500px; background:url("../images/packages-pg-bnr.jpg") no-repeat center bottom #fafafc; background-size: cover;}
.subpg-bnr-content{width: 75%; height: auto; padding: 14em 0px 10em 0; margin: 0 auto;}
.subpg-bnr-content h1{font-family: 'League Gothic', sans-serif; font-size: 150px; line-height: 130px; color: #06201b; text-transform: uppercase;}
/* .ten h1 {
  font-size:34px; font-weight:500; text-transform:uppercase;
} */
.subpg-bnr-content h1:before {background-color: #17ea7c; content: ''; display: block; height: 8px; width: 150px; margin-bottom: 0.25rem;}
.subpg-bnr-content h3{color: rgb(0 116 92);}
.subpg-bnr-content h3 a{text-decoration: underline; text-decoration-color: #17ea7c; color: inherit;}
.subpg-bnr-content h3 a:hover{text-decoration: underline; text-decoration-color: #17ea7c; color:#ffffff; background: #f4f9f5;}
.contact-banner{width:100%; height: auto; background:url("../images/contact-bnr-2.jpg") no-repeat center bottom #f4f9f5; background-size: cover;}
.about-banner{width:100%; height: auto; background:url("../images/about-bnr-2.jpg") no-repeat center bottom #f4f9f5; background-size: cover;}
.growmeticway-banner{width:100%; height: auto; background:url("../images/growmeticway-bnr-img.jpg") no-repeat center bottom #f4f9f5; background-size: cover;}
.c2c-banner{width:100%; height: auto; background:url("../images/c2c-bnr-img.jpg") no-repeat center bottom #f4f9f5; background-size: cover;}
.contact-sec{width: 100%; height: auto; float: left;}
.contact-main-text {padding: 0 0 50px 0;}
.contact-main-text span{color: inherit;}
.contact-main-text h2{padding-bottom: 15px;}
.contact-main-text h3{padding-bottom: 10px;}
.contact-main-text h5{padding-bottom: 10px;}
.building-box{ padding: 0 0 0 0; margin: 0 0 0 0;}
.building-box span{font-weight: bold; color: inherit;}
.address-box {background: rgb(242 242 242); padding: 30px 30px 20px 30px; float: left; height: auto}
.address-box h4{padding: 0 0 15px 0;}
.address-box h5{padding: 0 0 15px 0;}
.address-box p{padding: 10px 0 35px 0;}
.info-box {background: rgb(238 238 238); padding: 30px; float: left; height: auto}
.info-box h4{padding: 0 0 15px 0;}
.info-box h5{padding: 0 0 15px 0;}
.info-box p{padding: 0 0 35px 0;}
.contact-form{padding: 15px 0 0 0; /*float: left;*/}
.contact-form .form-group{margin-bottom: 25px;}
.input-box{padding: 0 30px;}
.form-group span{font-size:14px; line-height:24px; color:#1b002e; }
.form-group label{color: #ff0000; background: none; padding: 0 0 0 0;}
.form-box{padding:0 48px; margin: 0 0 0 0; }
.form-box h4{padding: 0 0 20px 0;}
.form-box h6{padding: 0 0 20px 0;}
.form-box h6 a{color: inherit; text-decoration: underline; text-decoration-color: #17ea7c; text-decoration-thickness: 3px;}
.form-box h6 a:hover{background:#17ea7c;}
.form-group input {width: 100%; height: 42px; background: #ffffff; border: 0px; border-bottom: 1px solid #8c8c8c; box-shadow: none; border-radius: 0;}
.form-group select {width: 100%; height: 38px; font-size: 14px; color: #868686; border-radius: 0px;background: none; border: 1px solid #bfbfbf; box-shadow: none;}
.form-group textarea{border: 1px solid #bfbfbf; border-radius: 6; background: #ffffff; }
.career-img-box{padding: 10px;}
/*========================
g-map styles
===========================*/
.g-map{ margin-bottom: 0px; margin-top:0px;}
/* .g-map img{width: 100px;} */
#map {width: 100%; height: 330px; margin-top: 0px; margin-bottom: 0px;}
.info-window {font-family: 'Roboto', sans-serif; font-size:14px;}
.info-content {color: #999;}
.info-window p{ padding: 0  0;}
/*========================== MEDIA QUERY CSS FOR RESPONSIVE
 Extra small devices (phones, 600px and down)
 ================================ */
  @media only screen and (max-width: 600px) {
    .navbar-brand {width: 225px; margin:10px 10px;}
    .navbar-brand a img{width:160px;}
    #navigation .navbar-right li a{color: #}
    .banner-text h1 {margin: 0 0 20px 0; height: 21px;}
    .form-box{padding: 30px;}
    .input-box{padding: 0 0px;}
    .form-group{padding: 0px;}
    .contact-form .form-group{margin-bottom: 15px;}
    .intro-bullet-parent{padding: 20px 0px 0 10px}
    .footer .container{padding-left:25px; padding-right: 25px;}
    .method-clickarea{padding: 50px 0 !important;}
    .growmetic-waybox-content {padding: 2em !important;}
    .text-black {font-size: 70px !important; line-height: 60px !important;}
    .text-black-2 {font-size: 70px !important; line-height: 60px !important;}
    .subpg-bnr-content{width: 90%;}
    .subpg-bnr-content h1{font-size: 70px !important; line-height: 60px !important;}
    .subpg-bnr-content h3{font-size: 28px; line-height: 28px; padding-top: 15px;}
    .grow-way-details h1{font-size: 70px !important; line-height: 60px !important;}
    .address-box{width: 100%;}
    .slider h4 a{font-size: 12px;}
    .growmetic-in-numbers h6{padding: 0 0 50px 0;}
    .abt-team-img{padding: 0px !important; top: 18em !important; margin-bottom: 180px;}
  }
  /* Small devices (portrait tablets and large phones, 600px and up) */
  @media only screen and (min-width: 600px) {
    .sub-pg-text{width: 100%; padding-top: 10em;}
  }
  /* Medium devices (landscape tablets, 768px and up) */
  @media only screen and (min-width: 768px) {
    /* .navbar-brand{width: 180px;} */
    .top-bar {top:40px; right: 0px;}
  }
  /* Large devices (laptops/desktops, 992px and up) */
  @media only screen and (min-width: 992px) {

  }
  /* Extra large devices (large laptops and desktops, 1200px and up) */
  @media only screen and (min-width: 1200px) {

  }

  /*+++++++++++++++++
  nav with dropdowns
  ++++++++++++++++++ */
.toggle, [id^=drop] {display: none;}
.toggle i{font-size: 28px; float: right; padding: 10px 5px 0 0;}
nav {display: block; margin-left: auto; margin-right: auto; width:50%;}
nav:after {content:""; display:table; clear:both;}
nav ul {float: right; padding:0; margin:0; list-style: none; position: relative; top:50px;}
nav ul li {text-transform: none; margin: 0px; display:inline-block; float: left;}
nav a {margin: 0 10px; padding:3px 10px; color: #06201b; font-size: 14px; font-weight: 500; display:block; text-decoration:none; line-height: normal;}
/* nav ul li ul li:hover { border-bottom: 3px solid #f9068b; } */
.menu ul li .active{text-decoration: none; border: 0; text-decoration: none;}
nav ul li ul li:hover{text-decoration: none; border: 0; text-decoration: none;}
nav a:hover {border-bottom: 2px solid #17ea7b; color: rgb(134 155 151); text-decoration: none;}
nav a.active {border-bottom: 2px solid #17ea7b; color: rgb(134 155 151); text-decoration: none;}
nav ul ul {display: none; position: absolute; top:35px; background: #26a888;}
nav ul li:hover > ul {display:inherit;}
nav ul ul li {width:100%; float:none; display:list-item; position: relative; padding: 3px 0;}
nav ul ul li a{color: #fffde8;}
nav ul ul li a:hover{color: #79e7cc; text-decoration: none; border-bottom: 0px;}
nav ul ul ul li {position: relative; top:-60px; left:170px; }
li > a:after { content:  ''; }
li > a:only-child:after { content: ''; }
@media all and (max-width : 768px) {
nav {width: 100%; margin: 0; background: #f4f9f5;}
	.toggle + a,
	.menu {display: none;}
  .toggle {display: block; padding:0 0; color:#332537; font-size:14px; text-decoration:none; border:none;}
  .toggle .fa-bars {display: block; padding:20px 10px; color:#00745c; text-decoration:none; border:none;}
  .toggle .fa-caret-down {display: block; padding: 0 0 0 0; color:#332537; text-decoration:none; border:none;}
  .toggle:hover {background-color: none;}
  [id^=drop]:checked + ul {display: block;}
  nav ul{top: 0;}
	nav ul li {display: block; width: 100%; padding: 5px 10px;}
	nav ul ul .toggle,
	nav ul ul a {padding: 0 40px;}
  nav ul ul ul a {padding: 0 80px;}
	nav a:hover,
 	nav ul ul ul a {}
	nav ul li ul li .toggle,
	nav ul ul a,
  nav ul ul ul a{margin: 0 3px; padding:3px 10px; color:#FFF; font-size:14px;}
	nav ul li ul li .toggle,
	nav ul ul a {}
	/* Hide Dropdowns by Default */
	nav ul ul {
		float: none;
		position:static;
		color: #ffffff;
		has to be the same number as the "line-height" of "nav a"
	}

	/* Hide menus on hover */
	nav ul ul li:hover > ul,
	nav ul li:hover > ul {
		display: none;
	}

	/* Fisrt Tier Dropdown */
	nav ul ul li {
		display: block;
		width: 100%;
	}

	nav ul ul ul li {position: static;}
  #btn{display: none;}
}
@media all and (max-width : 330px) {
 	nav ul li {display:block; width: 94%;}

}

.text-black{font-family: 'League Gothic', sans-serif; font-weight: normal; font-size: 150px; line-height: 130px; text-transform: uppercase; color: #ffffff !important; padding:30px 0 40px 0; float: left;}
.text-black-2{width: 100%; float: left; font-family: 'League Gothic', sans-serif; font-weight: normal; font-size: 150px; line-height: 130px; text-transform:uppercase; padding:0px 0 10px 0; float: left;}

.hrtext {display: flex; flex-direction: row; align-items: center; width: auto;}
.hrtext span {font-size: 16px; color: #17ea7c; flex-grow: 0;}
.hrtext {flex-grow: 0;}
/* .headerhr {flex-grow: 1; height: 4px; margin: 0 0 0 0.8rem; padding: 0 0 0 5rem; background-color: #ff2ab1;} */
.headerhr {width: 20%; height: 2px; margin: 1rem 0 0 0.8rem; padding: 0 0 0 5rem; background-color: #17ea7c;}

.address {padding:20px;}
.address h4 {color: #1c022e;}
.address p {color: #1c022e; font-size: 14px; margin:0 0 30px 0;}
.address a{font-size: 14px; color: #1c022e; display:block; line-height:normal; float: left; margin: 0 25px 0 0;}
.address a i{padding-right: 12px; font-size: 16px; color: #ff2ab1;}
.address a:hover{color: #adadad; text-decoration: underline; text-decoration-color: #ff2ab1; text-decoration-thickness: 2px;}

/*  ==== page Progress scroll load === */
.blok:nth-of-type(odd) {background-color:white;}
.blok:nth-of-type(even) {background-color:black;}
@-webkit-keyframes border-transform{

  0%,100% { border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%; }
	14% { border-radius: 40% 60% 54% 46% / 49% 60% 40% 51%; }
	28% { border-radius: 54% 46% 38% 62% / 49% 70% 30% 51%; }
	42% { border-radius: 61% 39% 55% 45% / 61% 38% 62% 39%; }
	56% { border-radius: 61% 39% 67% 33% / 70% 50% 50% 30%; }
	70% { border-radius: 50% 50% 34% 66% / 56% 68% 32% 44%; }
	84% { border-radius: 46% 54% 50% 50% / 35% 61% 39% 65%; }
}
/* .paginacontainer {height: 3000px;} */
.progress-wrap {position: fixed; right: 30px; bottom: 30px; height: 46px; width: 46px; cursor: pointer; display: block; border-radius: 50px; box-shadow: inset  0 0 0 2px rgba(0,0,0,0.1); z-index: 10000; opacity: 0; visibility: hidden; transform: translateY(15px); -webkit-transition: all 200ms linear; transition: all 200ms linear;}
.progress-wrap.active-progress {opacity: 1; visibility: visible; transform: translateY(0);}
.progress-wrap::after {position: absolute; font-family: 'unicons'; content: '\e84b'; text-align: center; line-height: 46px; font-size: 24px; color: rgba(0, 0, 0, 0.3); left: 0; top: 0; height: 46px; width: 46px; cursor: pointer; display: block; z-index: 1; -webkit-transition: all 200ms linear; transition: all 200ms linear;}
.progress-wrap:hover::after {opacity: 0;}
.progress-wrap::before {position: absolute; font-family: 'unicons'; content: '\e84b'; text-align: center; line-height: 46px; font-size: 24px; opacity: 0; background: black; /* --- Pijl hover kleur --- */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; left: 0; top: 0; height: 46px; width: 46px; cursor: pointer; display: block; z-index: 2; -webkit-transition: all 200ms linear; transition: all 200ms linear;}
.progress-wrap:hover::before {opacity: 1;}
.progress-wrap svg path {fill: none;}
.progress-wrap svg.progress-circle path {stroke: #17ea7c; stroke-width: 4px; box-sizing:border-box; -webkit-transition: all 200ms linear; transition: all 200ms linear;}



.contact-form {margin-top: 0px;}
.contact-form .input-block {border: solid 1px #989898; width: 100%; height: 40px; padding: 20px; position: relative; margin-bottom: 15px; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.contact-form .input-block.focus {border: solid 1px #eeeeee;}
.contact-form .input-block.textarea {height: auto;}
.contact-form .input-block.textarea .form-control {height: auto; resize: none;}
.contact-form .input-block label {padding: 0 10px; background: #fff; position: absolute; left: 8px; top: 15px; display: block; margin: 0; z-index: 1; color: #999; font-size: 14px; font-weight: normal; line-height: 10px;}
.contact-form .input-block .form-control {background-color: transparent; border: medium none; border-radius: 0; box-shadow: none; color: #333; font-size: 14px; height: 40px; padding: 0; position: relative; top: -20px; z-index: 2;}
.contact-form .input-block .form-control:focus label {top: 0;}
.contact-form .square-button {background: #000000; color: #fff; font-size: 26px; text-transform: uppercase; text-align: center; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; padding: 0 60px; height: 60px; border: none; width: 100%;}
.contact-form .square-button:hover,
.contact-form .square-button:focus {background-color: red;}
.contact-form .input-block span{font-size: 12px; position: absolute; top: 38px; color: #7e7e7e;}
.contact-form .input-block.textarea{margin-top: 10px;}
/* a:visited{ color: red } */
/* parallax css */
.parallax-item {display: flex; align-items: center; justify-content: center; font-weight: bold; font-family: Montserrat, sans-serif; width: 100%; min-height: 50vh;}

.socialbtns{width: 100%; height: auto; float: left; padding-top: 30px !important;}
.socialbtns h5{padding-bottom: 20px;}
.socialbtns, .socialbtns ul, .socialbtns li {margin: 0; padding: 0px;}
.socialbtns li {list-style: none outside none; display: inline-block;}
.socialbtns a {width: auto; height: auto; font-size: 22px; color: #464646; padding:10px;}
.socialbtns a svg{  fill: #464646;}
/* .socialbtns a:hover{  fill: white;} */
.socialbtns a svg:hover {fill: #cacaca;}
.growmetic-offices{padding: 50px 0 0 0; margin: 0;}
.growmetic-offices h4{padding-bottom: 30px; }
.right-border:before {content :""; position: absolute; right: 0; top: 0; height: 80px; width: 50%; border-right:3px solid #17ea7c;}
.right-border2:before {content :""; position: absolute; right: 0; top: 0; height: 120px; width: 50%; border-right:3px solid #17ea7c;}
.right-border3:before {content :""; position: absolute; right: 0; top: 0; height: 160px; width: 50%; border-right:3px solid #17ea7c;}

.about-pg-intro{width: 100%; height: auto; float: left;}
.about-intro-box {padding: 0px 0 50px 0;}
.about-intro-box h1{padding: 0px 0 30px 0;}
.about-intro-box h1 a{color: inherit; text-decoration: underline; text-decoration-thickness: 5px; text-decoration-color: #17ea7c;}
.about-intro-box h1 a:hover{color: #ffffff; background: #17ea7c; text-decoration: underline; text-decoration-thickness: 5px; text-decoration-color: #17ea7c;}
.about-intro-box-img img{padding-bottom: 2em;}
.about-intro-box-img p{font-family: 'League Gothic', sans-serif; font-weight: normal; font-size:18px; text-transform: uppercase;}
.reasons-tochoose{padding: 0px; margin-bottom: 3em;}
.reasons-tochoose h1{font-family: 'League Gothic', sans-serif; font-weight: normal; font-size:70px; padding-bottom: 30px;}
.reasons-visadiv{padding: 0px; float: left;}
.reasons-visadiv img{width: 100%; height: auto; float: left; margin-bottom: 0px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.reasons-visadiv h4{padding:20px 0; }
.reasons-visadiv p{padding-bottom:20px; }
.reasons-visadiv a{width: auto; height: auto; float: left; padding-top: 0px; margin: 0 0 0 0;}
.reasons-visadiv a span{color: #17ea7c; font-size: 20px; padding-right: 5px;}
/* .reasons-visadiv a i{padding:0 0px 0px 5px;} */
.reasons-subdiv{padding: 30px; border: 1px solid #dddddd; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; float: left;}
.reasons-subdiv img{width: 186px; height: auto; float: left; padding-bottom: 30px;}
.reasons-subdiv h4{width: 100%; height: auto; float: left; padding-bottom: 20px;}
.reasons-subdiv p{width: 100%; height: auto; float: left; padding-bottom: 10px;}
.reasons-subdiv a{width: auto; float: left; margin-top: 20px;}
.reasons-subdiv a span{color: #17ea7c; font-size: 20px; padding-right: 5px;}
.team-section{width: 100%; height: auto; float: left;}
.position-bg-colour{padding:3em 3em 5em 3em; background:#00745c; position: absolute; z-index:-0; color: #ffffff; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.position-bg-colour h2{color: #ffffff; padding-bottom: 10px;}
.position-bg-colour h3{color: #ffffff; padding-bottom: 10px;}
.position-bg-colour span{color: #ffffff; padding-bottom: 10px;}
.abt-team-img{padding: 30px;  position: relative; z-index: 0; top: 11em; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.abt-team-img img{-webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.abt-team-img h4{padding-bottom: 20px;}
.were-defined{width: 100%; height: auto; float: left; margin-top: 5em; background:no-repeat top center #f6f6fa;}
.were-defined h4{font-family: 'League Gothic', sans-serif; font-weight: normal; font-size: 70px; line-height:70px;  color: #ffffff; padding:30px 0 20px 0;}
.were-defined img{padding-bottom: 0px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.were-defined p{color: #ffffff;}
.growmetic-in-numbers h3{font-family: 'League Gothic', sans-serif; color: #17ea7c; font-weight: normal; text-transform: uppercase; font-size: 90px;}
.growmetic-in-numbers h3 span{color: #ffffff; font-size: 90px;}
.growmetic-in-numbers h6{font-family: 'League Gothic', sans-serif; font-size: 42px; line-height: 42px; padding-top: 20px; font-weight: normal; text-transform: uppercase; color: #ffffff;}
.our-people{width: 100%; height: auto; float: left;}
/* growmetic css */
.intro-sec {width: 100%; height: auto; float: left; padding-bottom: 50px;}
.intro-sec h1{width: 100%; height: auto; float: left; margin-bottom: 1em;}
.intro-sec h1 a{color: inherit; text-decoration: underline; text-decoration-thickness: 5px; text-decoration-color: #17ea7c;}
.intro-sec h1 a:hover{color: #ffffff; background: #17ea7c; text-decoration: underline; text-decoration-thickness: 5px; text-decoration-color: #17ea7c;}
.intro-sec h1 span{color: #17ea7c; font-size: 136px; line-height: 30px;}
.subheader-withline{width: 100%; height: auto; float: left; padding: 0px 0; margin: 0px 0 30px 0; border-bottom: 1px solid #b3c6c2;}
.subheader-withline span{font-size: 16px; color: #778e89;}
.subheader-withline-2{width: 100%; height: auto; float: left; padding: 0px 0; margin: 0px 0 30px 0; border-bottom: 1px solid #a2e5c5;}
.subheader-withline-2 span{font-size: 16px; color: #a2e5c5;}
.subheader-withline-3{width: 100%; height: auto; float: left; padding: 0px 0; margin: 0px 0 30px 0; border-bottom: 1px solid #d8b1f0;}
.subheader-withline-3 span{font-size: 16px; color: #d8b1f0;}
.subheader-withline-4{width: 100%; height: auto; float: left; padding: 0px 0; margin: 0px 0 30px 0; border-bottom: 1px solid #88a9ff;}
.subheader-withline-4 span{font-size: 16px; color: #88a9ff;}
.introbox{width: 100%; height: auto; float: left; padding: 0 50px 0 0;}
.introbox img{width: auto; height: auto; float: left; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.img-wrapper {overflow: hidden; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.inner-img {transition: 0.3s;}
.inner-img:hover {transform: scale(1.1); -webkit-filter: contrast(0.5); filter: contrast(0.5);}
.introbox h3{width: 100%; height: auto; float: left; padding: 0.8em 0;}
.introbox p{width: 100%; height: auto; float: left; padding:0;}
.service-intro{width: 100%; height: auto; float: left;}
.service-intro h2 a{color: inherit; text-decoration: underline; text-decoration-thickness: 5px; text-decoration-color: #17ea7c;}
.service-intro h2 a:hover{color: #ffffff; background: #17ea7c; text-decoration: underline; text-decoration-thickness: 5px; text-decoration-color: #17ea7c;}

.service-box{float:left; margin: 0px 10px 0px 0px; /*border-bottom: 1px solid #b3c6c2; padding: 0 0 20px 0;*/}
.service-box h4{padding-bottom:20px;}
.service-box img{-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.service-box p{padding: 15px 0;}
.growmetic-waybox{padding:0px; float: left; background: #06201b; -webkit-border-radius: 32px; -moz-border-radius: 32px; border-radius: 32px;}
.growmetic-waybox-content{padding: 5em;}
.growmetic-waybox-content h2{color: #ffffff; padding:0 0 30px 0;}
.growmetic-waybox-content h6{color: rgb(255 255 255 / 80%); padding-bottom: 20px;}
.growmetic-waybox-content p{color: rgb(255 255 255 / 80%); }
.growmetic-way-imgbox{padding:0px;}
.growmetic-way-imgbox img{-webkit-border-radius: 32px; -moz-border-radius: 32px; border-radius: 32px;}
.whyus-sec{width: 100%; height: auto; float: left; background: #00745c;}
.section-background-parallax {background-attachment: fixed; background-position: center; background-size: cover; width: 100%; color: #FFFFFF; display: flex; justify-content: center; align-items: center;}
.parallax1 {background-image: url("../images/whyus-bg.jpg");}
.whyus-box{padding: 30px 0 0 0;}
.whyus-box img{padding: 0px 0 30px 0;}
.whyus-box h4{padding: 0px 0 30px 0; color: #ffffff;}
.whyus-box p{color: #ffffff;}
.decision-sec{width: 100%; height: auto; float: left; background: #f4f9f5;}
.section-background-parallax2 {background-attachment: fixed; background-position: center; background-size: cover; width: 100%; color: #FFFFFF; display: flex; justify-content: center; align-items: center;}
.parallax2 {background-image: url("../images/decision-sec-bg.jpg");}
.section-background-parallax3 {background-attachment: fixed; background-position: center; background-size: cover; width: 100%; color: #FFFFFF; display: flex; justify-content: center; align-items: center;}
.parallax3 {background-image: url("../images/mission-bg.jpg");}
.section-background-parallax4 {background-attachment: fixed; background-position: center; background-size: cover; width: 100%; color: #FFFFFF; display: flex; justify-content: center; align-items: center;}
.parallax4 {background-image: url("../images/team-img-bg.jpg");}
/* .precision-box{float: left;} */
.precision-box h2{width: 100%; height: auto; color: #ffffff; padding-bottom: 20px;}
.precision-box span{width: 100%; height: auto; font-size: 20px; line-height: 28px; color: #ffffff; padding-bottom:20px;}
.precision-box p{width: 100%; height: auto; color: #ffffff; padding-bottom: 20px;}
.corporate-boarding-sec{width: 100%; height: auto; float: left; background: #f4f9f5;}
.section-background-parallax5 {background-attachment: fixed; background-position: center; background-size: cover; width: 100%; color: #FFFFFF; display: flex; justify-content: center; align-items: center;}
.parallax5 {background-image: url("../images/job-onboarding.jpg");}
.ind-inter-sec{width: 100%; height: auto; float: left; background: #f4f9f5;}
.section-background-parallax6 {background-attachment: fixed; background-position: center; background-size: cover; width: 100%; color: #FFFFFF; display: flex; justify-content: center; align-items: center;}
.parallax6 {background-image: url("../images/internship-img.jpg");}
.job-placement{width: 100%; height: auto; float: left; background: #f4f9f5;}
.section-background-parallax7 {background-attachment: fixed; background-position: center; background-size: cover; width: 100%; color: #FFFFFF; display: flex; justify-content: center; align-items: center;}
.parallax7 {background-image: url("../images/job-place-img.jpg");}

.grow-way-details h1{font-family: 'League Gothic', sans-serif; font-size: 150px; line-height: 140px; float: left; padding-top: 0px; font-weight: normal; text-transform: uppercase; color: #ffffff;}
.grow-way-details h1:before {
    background-color: #17ea7c;
    content: '';
    display: block;
    height: 8px;
    width: 150px;
    margin-bottom: 0.25rem;
}
.grow-way-details p{font-size: 18px; line-height: 28px; color: rgb(255 255 255 / 70%); padding: 1em 0;}

/* Float animate button */
.float {position:fixed; bottom:92px; right:24px; text-align:center; z-index:1000;}
.float .trigger {border-radius:50%; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); position:relative; background:#42cf47; color:#fff; height:60px; width:60px; vertical-align:middle; animation: 1.5s linear 0s infinite normal pulse; transition: ease-in-out 0.2s; cursor: pointer;}
.float .trigger a i{color: #ffffff;}
.float .trigger:hover{transform:scale(1.1);}
.float.open .trigger .fa::before{content: "\f00d";}
.float .trigger .fa::after{transition: ease-in-out 1s;}
.fab.open .trigger i{transition: all 0.4s ease; transform: translateY(5px) rotate(360deg);}
.float i{font-size:28px; line-height:58px;}
.float .actions{opacity:0; transition: opacity 0.4s ease;}
.float.open .actions{opacity:1;}
.float .p-whatsapp a{position: absolute; opacity:0; background: #fff; color: #333; height: 60px; width: 60px; line-height: 40px; transition: transform 0.4s ease; right: 80px; transform: translateY(50px); transition: all 0.4s ease; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); border-radius: 50%; right:-50px; transition-delay:0.3s; transform-origin: right center 0;}
.float.open .p-whatsapp a{position: absolute; top: 0; opacity:1; background: #fff; color: #333; height: 60px; width: 60px; line-height: 40px; transition: transform 0.4s ease; right: 0px; transform: translateY(50px); transition: all 0.4s ease; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); border-radius: 50%; transition-delay:0.2s;}
.float.open .p-whatsapp a:hover{background:#25d366; color:white;}
.float .actions .p-info:nth-child(1){transform: translateY(-180px)}
@keyframes pulse {
    0% {box-shadow: 0px 1px 0px 3px #42cf477a, 0px 0px 0px 0px #42cf4742;}
    30% {box-shadow: 0px 1px 0px 3px #42cf477a, 0px 0px 0px 5px #42cf4742;}
    70% {box-shadow: 0px 1px 0px 3px #42cf477a, 0px 0px 0px 15px #42cf4742;}
    100% {box-shadow: 1px 1px 2px 1px #42cf477a, 0px 0px 0px 20px transparent;}
  }

.c2c-details-sec{width: 100%; height: auto; float: left;}
.c2c-details-sec h1{font-family: 'League Gothic', sans-serif; font-size: 150px; line-height: 140px; padding-top: 0px; font-weight: normal; text-transform: uppercase;}

.c2c-detail-box{padding: 30px; background: #f4f9f5; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; margin: 0 20px 20px 0px; display: block; top: 0px; position: relative; z-index: 0; overflow: hidden;}
.c2c-detail-box:hover {transition: all 0.2s ease-out; background: #f7faff; -webkit-box-shadow: 3px 3px 46px 0px rgb(184 184 184 / 44%); -moz-box-shadow: 3px 3px 46px 0px rgb(184 184 184 / 44%); box-shadow: 3px 3px 46px 0px rgb(184 184 184 / 44%); top: -4px;}
.c2c-detail-box h4{padding-bottom: 15px;}
.method-clickarea{width: 100%; height: auto; float: left; padding:30px 100px 100px 100px;}
.form-box-homepage{padding:20px 40px 0 40px; background: #ffffff; -webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;}
/* Form radio btn css */
.radio-btn{width: auto; height: auto; float: left; border: 1px dashed #8c8c8c;}
.radio-btn input{width: auto; height: auto; float: left;}
.form-row {background: #ffffff; border-radius: 50px; height: auto; margin: -5px 10px 20px 0px; overflow: hidden; position: relative; width: 150px;}
.form-input {-webkit-appearance: none; appearance: none;}
.form-input::before {content: ''; cursor: pointer; height: 100%; left: 0; position: absolute; top: 0; width: 100%;}
.form-input:checked::before {background: #00755d;}
.form-input::after {content: ''; cursor: pointer; height: 15px; border-radius: 50px; border: 4px solid #00745c; left: 10%; position: absolute; top: 50%; transform: translate(0, -50%); width: 15px;}
.form-input:checked::after {border: 4px solid #ffffff;}
.radio-btn .form-label {color: #06201b; font-size: 1.3rem; font-weight: normal; margin-left: 40px; margin-top: 5px; /* z-index: 1; position: absolute; This is an alternative option */}
.form-input:checked ~ .form-label {color: #ffffff; position: relative;}
.affiliate-box{width: 90%; height: auto; float: left; padding:20px; margin-top: 40px; background: #ffffff; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;}
.affiliate-box h6{padding-bottom: 10px;}
.affiliate-box img{-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}