/* =Import Required styles
========================================================================================*/
@import url(normalize.css);
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600&family=Poppins:wght@300;400;700&display=swap');
:root {
	--primarycolor:#7DBE7D;
	--secondarycolor:#0D190D;
	--black:#000;
	--white:#fff;
  }

/* =Box Sizing 
========================================================================================*/
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], textarea, select, input[type="button"], input[type="submit"], button { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;  }


/* =Deafult Tag & General Classes
========================================================================================*/
html, body { -webkit-font-smoothing:antialiased; -moz-font-smoothing:antialiased; -ms-font-smoothing:antialiased; font-smoothing:antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust:100%; }
body { font:18px/1.8 'Poppins', Arial, Helvetica, sans-serif; color: var(--secondarycolor); overflow-x: hidden; }
img { vertical-align:top; border:0; }
a, input[type="button"], input[type="submit"], button, table th, table td { -moz-transition:background-color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000), color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition:background-color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000), color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -o-transition:background-color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000), color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition:background-color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000), color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition:background-color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000), color 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); }
.allanim, .mainmenucontentleft, .menuactive #mainmenu, .menuactive #wrapper, #menilinks li a, .commonbutton img, .commonbutton:before, .menucircle em, .menutrigger .menucircle:before, .menutrigger .menucircle:after, #logo, #header, .commonbuttonsecondary img { -moz-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -o-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); }
a { color:#f34834; text-decoration:none;}
@media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) {
	a:active{ background-color:transparent;}
}
strong { font-weight:bold; }
small, .small { font-size: 85%; }
sub, sup { font-size:80% }
p { margin:0; }
h1,h2, h3, h4, h5, h6 { font-family: 'Outfit', sans-serif; line-height:1.3; margin:0 0 10px; font-weight:600; color: var(--primarycolor) !important; }
h1,h2 { font-size:3.75vw; }
h3 { font-size:3.6458333333333335vw; }
h4 { font-size:2.6041666666666665vw; }
h5 { font-size:2.0833333333333335vw; }
h6 { font-size:1.5625vw; }

ul { list-style: none; margin: 0; padding: 0; }
ul li { line-height:24px; }
figure { margin: 0; }

.cf:before, .cf:after,.wrap:after,.wrap:before { content:""; display:table; }
.cf:after,.wrap:after { clear:both; }
.cf,.wrap { zoom:1; }
.nodisplay { display:none; }
.nodisplay_strict { display:none !important; }
.alignleft { float:left; }
.alignright { float:right; }
:focus { outline:none; }
.text_cont p { padding:0 0 10px 0; }
.nopad p, p.nopad { padding:0; }
.dflex { display: flex; }
.align-center { align-items: center; }
.justify-content-between { justify-content: space-between; }

.cols { display: flex; *zoom:1; margin-left:-20px; margin-right:-20px; clear:both; flex-wrap: wrap; }
.cols:after {content:""; display:table; clear:both; }
.cols .col { min-height:1px; padding-left:20px; padding-right:20px; }
.cols1 .col { width:100% }
.cols2 .col { width:50% }
.cols3 .col { width:33.333333333333%; }
.cols4 .col { width:25%; }

.custom-arrow-list { margin:0 0 35px; padding:0; list-style:none; }
.custom-arrow-list li { position:relative; padding-left:26px; margin-bottom: 20px; }
.custom-arrow-list li:before { content:''; border:solid 2px var(--white); border-left:0; border-top:0; position:absolute; left:1px; top:8px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); width:10px; height:10px; }

.darkbg { background: var(--secondarycolor); }
.darkbg * { color: var(--white); }

::selection { color: var(--secondarycolor); background:var(--primarycolor); }

/* =Layout Width
========================================================================================*/
#wrapper {  }
.wrap { max-width:1460px; width:100%; margin:0 auto; padding-left:30px; padding-right:30px; }
.secpadding { padding: 120px 0; }
#main { position: relative; z-index: 1; }
#primary { float:left; width:700px; }
#sidebar { float:right; width:200px; }
.one-column { width:auto !important; float:none !important; }

/* =Common (common classes)
========================================================================================*/
#header { position: fixed; top: 0; left: 0; right: 0; margin: 0 auto; padding:26px 0; background: transparent; z-index: 9; }
#header.headerfixed { background: var(--secondarycolor); padding: 24px 0; }
#logo { display: inline-block; width:222px; position:relative;  overflow: hidden; }
#logo img { max-width:222px; height:auto; width:222px; }
#header.headerfixed #logo { width: 69px; transition-delay: 0.2s; }

.sectitle { margin-bottom: 60px; }
.sectitle h3 { position: relative; max-width: 38%; flex:0 0 38%; }
.sectitle h3:after { content: ''; position: absolute; top: 50%; right: 50px; background: url(../images/titleicon.svg) no-repeat 0 0 / cover; width: 310px; height: 262.18px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); opacity: 0.12; }
.sectitle p { flex: 0 0 44%; max-width: 44%; width: 100%; }

.menutrigger { display: inline-block; position: relative; padding-right: 60px; }
.menutrigger em { font-family: 'Outfit', sans-serif; font-size: 18px; font-weight: 600; display: block; color: transparent; font-style: normal; position: relative; }
.menutrigger em:before, .menutrigger em:after { content:attr(data-letters); position: absolute; top: 0; left: 0; color: var(--white); font-family: 'Outfit', sans-serif; font-size: 18px; font-weight: 600; }
.menucircle { position: absolute; top: 50%; right: 0; width: 44px; height: 44px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.menucircle:before { content: ''; position: absolute; top: 50%; left: 0; right: 0; background: var(--white); width: 20px; height: 20px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; z-index: 1; }
.menucircle:after { content: ''; position: absolute; top: 50%; bottom: 0; right: 0; left: 0; width: 100%; height: 100%; background: var(--primarycolor); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.menucircle em { position: relative; width: 44px; height: 44px; display: inline-block; }
.menucircle em:before { content: ''; position: absolute; top: 50%; left: 0; right: 0; background: var(--primarycolor); width: 20px; height: 20px; transform: translateY(-50%) scale(0); -webkit-transform: translateY(-50%) scale(0); -moz-transform: translateY(-50%) scale(0); -ms-transform: translateY(-50%) scale(0); -o-transform: translateY(-50%) scale(0); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; z-index: 1; }
.menucircle em:after { content: ''; position: absolute; top: 50%; bottom: 0; right: 0; left: 0; width:100%; height:100%; background: var(--white); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; transform: translateY(-50%) scale(0); -webkit-transform: translateY(-50%) scale(0); -moz-transform: translateY(-50%) scale(0); -ms-transform: translateY(-50%) scale(0); -o-transform: translateY(-50%) scale(0); }

#footer { padding: 320px 0 80px; background:var(--secondarycolor) url(../images/background-pattern.png) no-repeat center / contain;  }
.flogo { width: 250px; }
.flogo img { width: 100%; max-width: 100%; height: auto; }
.footertop span, .footertop a { font-size: 1.875vw; font-weight: 500; font-family: 'Outfit', sans-serif; }
.footertop span { color: var(--primarycolor); }
.footertop span a { color: var(--white); }
.footertop span a:hover { color: var(--primarycolor); }
.fsocial li { margin-left: 25px; }
.fsocial li a { display: block; border: var(--white) solid 2px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.fsocial li a:hover { background: var(--primarycolor); border-color: var(--primarycolor); }
.footerbottom { margin-top: 50px; padding-top: 50px; border-top: rgba(255,255,255,0.2) solid 1px; }

#mainmenu { background: var(--primarycolor) url(../images/menubg-new.png) no-repeat center / contain; position: fixed; top: -100vh; left: 0; right: 0; width: 100%; height: 100vh; z-index: 9; transition: 0.4s all ease-in-out; -webkit-transition: 0.4s all ease-in-out; -moz-transition: 0.4s all ease-in-out; -ms-transition: 0.4s all ease-in-out; -o-transition: 0.4s all ease-in-out; }
#mainmenu .wrap { position: relative; display: flex; align-items: center; height: 100%; }
.mainmenutop { position: absolute; top: 0; left: 0; right: 0; width: 100%; max-width: 1460px; padding: 30px; margin: 0 auto; z-index: 2; }
.mainmenucontentwrapper { flex: 0 0 100%; margin-top: 8vh; }
.mainmenutop .menucircle:before { content: ''; position: absolute; top: 50%; left: 0; right: 0; background: var(--white); width: 20px; height: 20px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; z-index: 1; }
.mainmenutop .menucircle:after { content: ''; position: absolute; top: 50%; bottom: 0; right: 0; left: 0; width: 100%; height: 100%; background: var(--secondarycolor); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.mainmenutop .menucircle em { position: relative; width: 44px; height: 44px; display: inline-block; }
.mainmenutop .menucircle em:before { content: ''; position: absolute; top: 50%; left: 0; right: 0; background: var(--secondarycolor); width: 20px; height: 20px; transform: translateY(-50%) scale(0); -webkit-transform: translateY(-50%) scale(0); -moz-transform: translateY(-50%) scale(0); -ms-transform: translateY(-50%) scale(0); -o-transform: translateY(-50%) scale(0); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; z-index: 1; }
.mainmenutop .menucircle em:after { content: ''; position: absolute; top: 50%; bottom: 0; right: 0; left: 0; width:100%; height:100%; background: var(--white); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; margin: 0 auto; transform: translateY(-50%) scale(0); -webkit-transform: translateY(-50%) scale(0); -moz-transform: translateY(-50%) scale(0); -ms-transform: translateY(-50%) scale(0); -o-transform: translateY(-50%) scale(0); }
.mainmenucontentleft { max-width: 35%; flex:0 0 35%; width: 100%; opacity: 0; transform: translateY(40px); -webkit-transform: translateY(40px); -moz-transform: translateY(40px); -ms-transform: translateY(40px); -o-transform: translateY(40px); }
.mainmenucontentleft img { max-width: 100%; width: 100%; height: auto; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; }
#menilinks li { margin-bottom: 60px; text-align: right; overflow: hidden; }
#menilinks li:last-child { margin-bottom: 0; }
#menilinks li a { font-family: 'Outfit', sans-serif; font-size: 3.0208333333333335vw; font-weight: 600; line-height: 1.2; color: var(--white); opacity: 0.5; transform: translateY(500px); -webkit-transform: translateY(500px); -moz-transform: translateY(500px); -ms-transform: translateY(500px); -o-transform: translateY(500px); display: block; }
#menilinks li a.active, #menilinks li a:hover { color: var(--white); opacity: 1; }

.menuactive #wrapper { transform: translateY(100vh); -webkit-transform: translateY(100vh); -moz-transform: translateY(100vh); -ms-transform: translateY(100vh); -o-transform: translateY(100vh); }
.menuactive #mainmenu { top: 0; }
.menuactive { overflow: hidden; }
.menuactive #mainmenu .mainmenucontentleft { opacity: 1; transition-delay: 0.2s; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); }
.menuactive #menilinks li a { transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transition-delay: 0.2s; }

/* =Home-Page (only homepage used classes)
========================================================================================*/
#mainbannersection { padding-top: 200px; height: 100vh; min-height: 780px; position: relative; z-index: 1; width: 100%; }
#mainbannersection * { color: var(--white); }
#mainbannersection h1 { color: var(--white) !important; }
.herobannerleft { flex:0 0 55%; max-width: 55%; padding-right: 30px; }
.herobannerright { flex:0 0 40%; max-width: 40%; padding-left: 30px; }
.herobannerright p { margin-bottom: 30px; }
.commonbutton { font-family: 'Outfit', sans-serif; font-weight: 500; color: var(--secondarycolor); display: inline-block; position: relative; padding: 18px 20px 22px; z-index: 1; line-height: 1; }
.commonbutton:before { content: ''; position: absolute; top: 0; left: 0; background:var(--primarycolor); border-radius: 12px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; width: 100%; height: 100%; z-index: -1; }
.commonbutton img { position: relative; top: 1px; margin-left: 15px; }
.commonbuttonsecondary { font-family: 'Outfit', sans-serif; font-weight: 500; display: inline-block; color: var(--white); display: inline-block; position: relative; padding: 16px 20px; background: var(--primarycolor); border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px; -ms-border-radius:12px; -o-border-radius:12px; border: transparent solid 2px; }
.commonbuttonsecondary img { position: relative; top: 1px; margin-left: 15px; }
.commonbuttonsecondary.commonbuttonsecondaryoutline { background: var(--white); border: var(--primarycolor) solid 2px; color: var(--primarycolor); }
.buttongroupwrap .commonbuttonsecondary + .commonbuttonsecondary { margin-left: 25px; }
.heroimgsection { margin-top: -250px; position: relative; z-index: 2; margin-bottom: 120px; }
.graphics { position: absolute; top: 0; left: 0; right: 0; }
.graphicimg { position: absolute; top: 0; }
.graphics { opacity: 0.1; }
.graphicimgleft { top: 70vh; }
.graphicimgright { top: 2vh; right: 15px; }
#linewaves { position: absolute; top: -180px; z-index: -1; opacity: 0.06; left: 0; right: 0; }
.herobannerimg { border-radius: 46px; -webkit-border-radius: 46px; -moz-border-radius: 46px; -ms-border-radius: 46px; -o-border-radius: 46px; overflow: hidden; }
.herobannerimg img { max-width: 100%; width: 100%; height: auto; }
.bgtextbig { position: absolute; top: 300px; left: 0; right: 0; width: 100%;	text-align: center; text-transform: uppercase; font-weight: 700; 	font-size: 21vw; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: #fff; color: transparent !important; opacity: 0.11; z-index: -1; }
#aboutsection .cols.cols2 .col:first-child { flex:0 0 40%; max-width: 40%; }
.aboutimgcollarge figure { position: relative; }
.aboutimgcollarge .circular { z-index: 1; }
.aboutimgcollarge .circular:before, .aboutimgcollarge .rectangle:before { content: ''; position: absolute; background: var(--white); opacity: 0.05; }
.aboutimgcollarge .circular:before { top: 60%; left: 10%; width: 240px; height: 240px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.aboutimgcollarge .rectangle { margin: 25px 0 0 -160px; }
.aboutimgcollarge .rectangle:before { top: -10%; right: 0; width: 250px; height: 400px; border-radius: 36px; -webkit-border-radius: 36px; -moz-border-radius: 36px; -ms-border-radius: 36px; -o-border-radius: 36px; }
.aboutcontent p { margin-bottom: 40px; }
.aboutimgcollarge img { max-width: 100%; width: 100%; height: auto; }
.mesonaryboxeswrapper .col:nth-child(even) { margin-top: 50px; }
.mesonarybox { background-color: var(--white); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); padding: 40px 50px;  }

#makepaymentsection { margin-bottom: -120px; }
#makepaymentsection .sectitle { margin-bottom: 0; }
.mesonarybox h4 { color: var(--secondarycolor) !important; }
.makepaymentseccontent { background: var(--white); padding-left: 60px; padding-right: 60px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); }
#makepaymentsection .sectitlenuttonpgh { flex:0 0 44%; max-width: 44%; width: 100%; }
#makepaymentsection .sectitle p { max-width: 100%; flex:0 0 100%; }
.makepaymentseccontent .buttongroupwrap { margin-top: 30px; }