body { font-family: 'Poppins', sans-serif; font-weight: normal; font-style: normal; font-size: 14px; padding: 0; margin: 0; }
a, .btn  { -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s; }
a:focus { text-decoration: none !important; }
a:focus, a:hover { color: #84ba3f; text-decoration: none !important; }
a, button, input { outline: medium none !important; color: #84ba3f; }
.uppercase { text-transform: uppercase; }
h1, h2, h3, h4, h5, h6 { font-family: 'Poppins', sans-serif;  font-weight: normal; color: #282a39; margin-top: 0px; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; }

h1 { font-size: 36px; font-style: normal; font-weight: 800; line-height: 40px; letter-spacing: 1px; }
h2 { font-size: 32px; font-style: normal; font-weight: 600; line-height: 38px; letter-spacing: 1px; }
h3 { font-size: 28px; font-style: normal; font-weight: 600; line-height: 32px; letter-spacing: 1px; }
h4 { font-size: 22px; font-style: normal; font-weight: 500; line-height: 30px; letter-spacing: 1px; }
h5 { font-size: 18px; font-style: normal; font-weight: 600; line-height: 30px; letter-spacing: 1px; }
h6 { font-size: 16px; font-style: normal; font-weight: 600; line-height: 18px; letter-spacing: 1px; }

ul { margin: 0px; padding: 0px; }
p { font-weight: normal; line-height: 1.5; color: #282a39; }
hr { margin: 0; padding: 0px; border-bottom:1px dashed #eceff8; border-top: 0px; } 

*::-moz-selection { background: #84ba3f; color: #fff; text-shadow: none; }
::-moz-selection { background: #84ba3f; color: #fff; text-shadow: none; }
::selection { background: #84ba3f; color: #fff; text-shadow: none; }

/***************************
Page section margin padding 
****************************/
.page-section-ptb { padding: 130px 0; }
.page-section-pt { padding: 130px 0 0; }
.page-section-pb { padding: 0 0 130px; }
   
/*************************
    Text color
*************************/
.white-bg { background: #fff; }
.gray-bg { background: #e5e7eb; }
.dark-gray-bg { background: #666666; }
.theme-bg { background: #84ba3f; }
.black-bg { background: #282a39; }
   
/*************************
    Text color
*************************/
.theme-color { color: #84ba3f; }
.text-white { color: #fff; }
.text-black { color: #282a39; }


/*************************
    margin
*************************/
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mt-40 { margin-top: 40px; }
.mt-50 { margin-top: 50px; }
.mt-60 { margin-top: 60px; }
.mt-70 { margin-top: 70px; }
.mt-80 { margin-top: 80px; }
.mt-90 { margin-top: 90px; }
.mt-100 { margin-top: 100px; }

.mb-10 { margin-bottom: 10px; }
.mb-20 { margin-bottom: 20px; }
.mb-30 { margin-bottom: 30px; }
.mb-40 { margin-bottom: 40px; }
.mb-50 { margin-bottom: 50px; }
.mb-60 { margin-bottom: 60px; }
.mb-70 { margin-bottom: 70px; }
.mb-80 { margin-bottom: 80px; }
.mb-90 { margin-bottom: 90px; }
.mb-100 { margin-bottom: 100px; }
 
.container-fluid { padding: 0 70px; }

.button { padding: 12px 20px; margin-bottom: 5px; background: #ffffff; color: #282a39; border-radius: 3px; text-transform: uppercase; font-weight: 600; display: inline-block; }
.button:hover { background: #282a39; color: #ffffff; }
 

 /*************************
    header
*************************/
.header { position: absolute; width: 100%; z-index: 9; padding: 40px 0; }

/*************************
    section-title
*************************/
.section-title h2 { font-size: 160px; line-height: 80px; color: rgba(0,0,0,0.075); font-weight: 400; margin-top: 30px; }
.tagline { line-height: 30px; }
 

/*************************
    	demo-item
*************************/
.demo-item .item-name a { font-size: 18px; color: #282a39; font-weight: 600; display: block; margin:30px 0; }
.demo-item .item-name a span { font-size: 16px; font-weight: 400; }

/*************************
    	feature-box
*************************/
.main-feature .container-fluid, .parallax-banner .container-fluid, .header .container-fluid { padding: 0 250px; }
.feature-box { box-shadow: 1px 1px 30px rgba(70, 64, 80, 0.07);	padding: 100px 40px; background: #ffffff; }
.feature .feature-icon {  display: table-cell;}
.feature .feature-icon .icon{background-image: url(../images/icon/icon-sprites.png);  width: 80px;    height: 80px;    background-repeat: no-repeat; }
.feature .feature-icon .icon.icon-01{ background-position:0 0; }
.feature .feature-icon .icon.icon-02{ background-position:-80px 0; }
.feature .feature-icon .icon.icon-03{ background-position:-160px 0; }
.feature .feature-icon .icon.icon-04{ background-position:0 -80px; }
.feature .feature-icon .icon.icon-05{ background-position:-80px -80px; }
.feature .feature-icon .icon.icon-06{ background-position:-160px -80px; }
.feature .feature-icon .icon.icon-07{ background-position:0 -160px; }
.feature .feature-icon .icon.icon-08{ background-position:-80px -160px; }
.feature .feature-icon .icon.icon-09{ background-position:-160px -160px; }
.feature .feature-icon .icon.icon-10{ background-position:0 -240px; }
.feature .feature-icon .icon.icon-11{ background-position:-80px -240px; }
.feature .feature-icon .icon.icon-12{ background-position:-160px -240px; }
.feature .feature-icon .icon.icon-13{ background-position:0 -320px; }
.feature .feature-icon i { font-size: 40px;  line-height: 40px; background: linear-gradient(135deg, #00c7b1 0%, #00de8c 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.feature .feature-info { padding-left: 40px; display: table-cell; vertical-align: top;}

/*************************
    	widgets
*************************/

.widgets.gray-bg { position: relative;  }
.widgets .widgets-box { height: auto; position: relative;  padding-bottom: 500px;}
.widgets .widgets-box img:nth-child(1) { position: absolute; left: 0; right: 0; top: 0; }
.widgets .widgets-box img:nth-child(2) { position: absolute; left: 20%; top: 0;  }
.widgets .widgets-box img:nth-child(3) { position: absolute; left: 10%; bottom: 10px; }
.widgets .widgets-box img:nth-child(4) { position: absolute; left: 16%; bottom: 0; }
.widgets .widgets-box img:nth-child(5) { position: absolute; right: 20%;  top: 20%;  }
.widgets .widgets-box img:nth-child(6) { position: absolute; right: 10%; top: 30%; }
.widgets .widgets-box img:nth-child(7) { position: absolute; right: 13%; bottom:-10%; }

.widgets .widgets-img { display: none; }

/*************************
    	Applications
*************************/
.side-background { margin-bottom: 160px; }
.img-side img { max-width: 100% }
.img-side.img-right { right: 0; }
.img-side  { padding: 0; position: absolute!important; top: 250px; height: 100%; overflow: hidden; z-index: 100; }

.application-item { position: relative; box-shadow: 1px 1px 30px rgba(70, 64, 80, 0.07);  }
.application-item .button {  position: absolute; left: 40px; bottom: 48px; border-radius: 0; background: #E91E63; color: #ffffff; padding: 12px 40px; box-shadow: 10px 1px 30px rgba(233, 30, 99, 0.5);  }

.applications ul li a { font-size: 20px; line-height: 30px; color: #282a39; }
.applications ul li a:hover { color: #84ba3f; }


 /*************************************
       parallax-banner home 10
**************************************/
.parallax-banner { width: 100%; height: 100vh; overflow: hidden; position: relative; background-repeat: no-repeat; background-size: contain; }
.parallax-banner .scene { padding: 0; margin: 0; height: 100%; }
.parallax-banner .banner-content {  }
.parallax-banner .banner-content h1 { display: block; margin-bottom: 15px; line-height: 55px; font-weight: 600; }
.parallax-banner .banner-content  strong { font-weight: 700; position: relative; }
.parallax-banner .layer:nth-child(1) { position: absolute; left: -8%; bottom: 0px; }
.parallax-banner .layer:nth-child(2) { position: absolute; bottom: 10%; left: 20%; }
.parallax-banner .layer:nth-child(3) {  position: absolute; width: 100%; text-align: left; top: 20%; z-index:99; }
.parallax-banner .layer:nth-child(4) { position: absolute; top: 36%; left: 44%;  z-index:99; }
.parallax-banner .layer:nth-child(5) { position: absolute; right: 27%; bottom: 0px;  z-index:99; }
.parallax-banner .layer:nth-child(6) { position: absolute; bottom: 6%; right: 0%;  z-index:99; }
.parallax-banner .layer:nth-child(7) { position: absolute; top: 10%; right: -16%; z-index: -1; }

 




 /*************************************
      responsive
**************************************/
@media only screen and (min-width:992px) and (max-width:1200px) {
  .container { width: 94%; }
}

@media (max-width:1600px) {

.main-feature .container-fluid, .parallax-banner .container-fluid, .header .container-fluid { padding: 0 200px; }
.parallax-banner .layer img { width: 80%; }
.side-background { margin-bottom: 0; }

.parallax-banner .layer:nth-child(7) { right: -27%; }
.parallax-banner .layer:nth-child(2) { bottom: 0; }


}

@media (max-width:1500px) {
.applications .mt-80 { margin-top: 0; }
.main-feature .container-fluid, .parallax-banner .container-fluid, .header .container-fluid { padding: 0 100px; }

.parallax-banner .layer img { width: 70%; }
.parallax-banner .layer:nth-child(1) { left: -12%; }
.parallax-banner .layer:nth-child(7) { right: -37%; }


}

@media (max-width:1300px) {
 
.parallax-banner .layer img { width: 60%; }
.parallax-banner .layer:nth-child(6) { bottom: 14%; }
.parallax-banner .layer:nth-child(7) { right: -57%; }

.parallax-banner .banner-content h1 { font-size: 28px; line-height: 45px; }



}

@media (max-width:1199px) {
.main-feature .container-fluid, .parallax-banner .container-fluid, .header .container-fluid { padding: 0 70px; }
.feature .feature-info { padding-left: 20px; }
.section-title h2 { font-size: 130px; }
}

@media (max-width:1025px) { 
.parallax-banner .layer:nth-child(7) { right: -72%; }
.parallax-banner .layer:nth-child(5) { right: 17%; bottom: 50px; }
.parallax-banner .layer:nth-child(1) { left: -15%; }

}


@media (max-width:991px) {

.page-section-ptb { padding: 90px 0; } 
.page-section-pt { padding-top: 90px; } 
.page-section-pb { padding-bottom: 90px; } 
.container-fluid { padding: 0 15px; }
.main-feature .container-fluid, .parallax-banner .container-fluid, .header .container-fluid { padding: 0 15px; }

.section-title h2 { font-size: 100px; }
.img-side.img-right { right: inherit; }
.img-side  { padding: 15px; position: inherit !important; top: inherit; height: inherit; overflow: inherit; z-index: inherit; }

.feature.last  { margin-top: 60px; }

.parallax-banner { height: 80vh; background-size: cover; }
.parallax-banner .layer:nth-child(1) { display: none !important; }
.parallax-banner .layer:nth-child(2) { display: none !important; }
.parallax-banner .layer:nth-child(4) { display: none !important; }
.parallax-banner .layer:nth-child(5) { display: none !important; }
.parallax-banner .layer:nth-child(6) { display: none !important; }
.parallax-banner .layer:nth-child(7) { display: none !important; }

.widgets .widgets-box { display: none; }
.widgets .widgets-img { display: block; }

}

@media (max-width: 767px) {
.page-section-ptb { padding: 60px 0; }
.page-section-pt { padding-top: 60px; }
.page-section-pb { padding-bottom: 60px; }
.section-title h2 { font-size: 50px; }

}


@media (max-width: 576px) { 
	.feature-box { padding: 30px; }
	.feature .feature-icon { display: block; }
}