/*-----------------------------------------------------------------------------------  
     CSS INDEX
    ===================

    1. Theme Default CSS (body, link color, section etc)
    2. Header Top Area
    2.1 Header Bottom Area 
    2.2. Sticky Header Area
    2.3. Mobile Menu Area
    3. Intro Area
    4. About area
    5.Services Area
    6.tab Area
    7. Achivement Area Css
    8. projects Area
    9.Reviews Area Css
    10. Blog Area
    11. Footer Area
    12. Home page 02
    12.2 .home-2 welcome Services Area
    13. Breadcumbs Area
    14.	About page area
    15. Team Area css
    16. FAQ  Area
    17. Blog Sidebar Area
    18. Blog Details
    19.Contact CSS
    20. Services Details area
    21. Project Details page
    22. Login And Register page
    23. Home -4 New
    24. Home -5 New
    25.Animation  CSS
   
    
-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  Google Fonts
/*----------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Nunito:300,400,600,700,800&display=swap');


/*----------------------------------------*/
/*  1.  Theme default CSS
/*----------------------------------------*/

/**
 * Core Theme Elements
 * These styles affect every page in the site (index.php, about.php, contact.php, etc.)
 */

/* Base Layout
 * Used in: All pages
 * Ensures full-height layouts for proper footer positioning
 * Prevents content from being cut off
 */
html, body {
	height: 100%;
}

/**
 * Image and Content Alignment Classes
 * Used in: blog-sidebar.php, research.php, team.php
 * Purpose: Position images and text blocks within content areas
 */

/* Left float - Used for blog post thumbnails in blog-sidebar.php */
.floatleft {
	float:left;
}

/* Right float - Used for team member images in team.php */
.floatright {
	float:right;
}

/* Left alignment with margin - Used for inline images in research.php */
.alignleft {
	float:left;
	margin-right:15px; /* Space between image and text */
	margin-bottom: 15px;
}

/* Right alignment with margin - Used for service icons in research.php */
.alignright {
	float:right;
	margin-left:15px; /* Space between text and image */
	margin-bottom: 15px;
}

/* Center alignment - Used for logos and section headlines across all pages */
.aligncenter {
	display:block;
	margin:0 auto 15px; /* Vertical spacing between elements */
}
/**
 * Interactive Elements
 * Focus state styling for accessibility
 */
a:focus {
	outline:0px solid;
}

/**
 * Responsive Images
 * Ensures images scale properly within their containers
 */
img {
    max-width:100%;
	height:auto;
}

/**
 * Clearfix Helper
 * Used to contain floated elements
 */
.fix {
	overflow:hidden;
}

/**
 * Typography System
 * Defines text styles across the entire website
 */

/* Paragraph Text
 * Used in: All content areas across the site
 * Examples:
 * - Service descriptions in research.php
 * - Blog post content in blog-sidebar.php
 * - Team member bios in team.php
 */
p {
	margin:0 0 15px;
    color: #757b82; /* Gray text for better readability */
}

/* Global Heading Styles
 * Font: Nunito (loaded from Google Fonts)
 * Used across all pages for consistent branding
 */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Nunito', sans-serif;
	margin: 0 0 15px;
	color: #2a354e; /* Dark blue - primary brand color */
    font-weight: 600; /* Semi-bold for emphasis */
}

/* Main Page Titles (h1)
 * Used in:
 * - Hero section of index.php
 * - Page headers in about.php, contact.php
 * - Service titles in research.php
 */
/* Global paragraph style: left align, break long words, prevent big spaces */
h1 {
    text-align: center;
    word-break: break-word;
}
/* Section Headers (h2)
 * Used in:
 * - Service section titles in index.php
 * - About section in about.php
 * - Project titles in development.php
 */
h2{
	font-size: 38px;
	line-height: 44px; /* Optimized for section headers */
}

/* Subsection Titles (h3)
 * Used in:
 * - Service features in research.php
 * - Team member names in team.php
 * - Blog post titles in blog-sidebar.php
 */
h3{
	font-size: 30px;
	line-height: 38px; /* Balanced for subsection headings */
		
}
/* Quaternary Heading */
h4{
	font-size: 24px;
	line-height: 34px; /* Clear reading space */
}

/* Quinary Heading */
h5{
	font-size: 20px;
	line-height: 28px; /* Balanced for smaller text */
}

/* Senary Heading */
h6{
	font-size: 16px;
	line-height: 26px; /* Matches body text line height */
}

/**
 * Link Styles
 * Smooth transitions and interactive states
 */
a {
	transition: all 0.3s ease 0s; /* Smooth hover effect */
	text-decoration: none;
    color: #90bc44;
}

/* Hover state - primary color */
a:hover {
  color: #90bc44; /* Brand blue */
  text-decoration: none;
}

/* Active and hover states - no outline */
a:active, a:hover {
  outline: 0 none;
}

/* Focus state - dark color */
a:hover, a:focus {
    color: #90bc44; /* Dark blue */
    text-decoration: none;
}

/**
 * Body Base Styles
 * Core typography and layout settings
 */
body {
	background: #fff none repeat scroll 0 0; /* Clean white background */
	color: transparent;
    font-family: 'Nunito', sans-serif; /* Primary font */
	font-size: 16px; /* Base font size */
	text-align: left;
	overflow-x: hidden; /* Prevent horizontal scroll */
	line-height: 26px; /* Comfortable reading */
}
/**
 * Scroll-to-Top Button
 * Fixed position button that appears when scrolling down
 * Used in the footer to quickly return to top of page
 */
#scrollUp {
    bottom: 40px; /* Position from bottom */
    font-size: 20px; /* Icon size */
    line-height: 48px; /* Vertical centering */
    right: 30px;
    width: 44px;
    background-color: #74AB43;
    color: #fff;
    text-align: center;
    height: 44px;
    border-radius: 3px;
    border:1px solid #74AB43;
    transition-duration: 500ms;
}
#scrollUp:hover {
    border:1px solid #74AB43;
    background-color: #74AB43;
    transition-duration: 500ms;
}
.clear{
	clear:both;
}
.color{
    color: #90bc44;
}
ul{
	list-style: outside none none;
	margin: 0;
	padding: 0;
}
/**
 * Form Elements
 * Used in:
 * 1. Contact Form (contact.php)
 *    - Name input
 *    - Email input
 *    - Message textarea
 *    - Submit button
 * 
 * 2. Signup Form (signup.php)
 *    - Username field
 *    - Password field
 *    - Email field
 * 
 * 3. Project Inquiry Form (research.php)
 *    - Project details
 *    - Budget input
 *    - Timeline selection
 * 
 * Base styling removes browser defaults for consistent look
 */
input, select, textarea, input[type="text"], input[type="date"], input[type="url"], input[type="email"], input[type="password"], input[type="tel"], button, button[type="submit"] {
	-moz-appearance: none;
	appearance: none; /* Consistent cross-browser appearance */
	box-shadow: none !important; /* Removes default shadows */
}

/* Focus states for form elements
 * Applied when user interacts with:
 * - Text inputs in contact forms
 * - Textareas in message fields
 * - Select dropdowns in project forms
 */
input:focus, textarea:focus, select:focus {
    outline: none; /* Removes default browser outline */
}

/**
 * Page Preloader Animation
 * Applied in: All PHP files through header inclusion
 * 
 * Implementation:
 * 1. Included at the top of body in index.php, about.php, etc.
 * 2. Controlled by JavaScript in js/main.js
 * 3. Uses preloader.gif from img/logo/ directory
 * 
 * Behavior:
 * - Shows immediately when page starts loading
 * - Covers entire viewport (100% width/height)
 * - Disappears when window.load event fires
 * - Prevents content flash during page load
 * 
 * Example HTML:
 * <div id="preloader"></div>
 */
div#preloader { 
	position: fixed; /* Stays fixed while scrolling */
	left: 0; 
	top: 0; 
	z-index: 99999; /* Highest z-index to stay above all content */
	width: 100%;
	height: 100%;
	overflow: visible;
	background: #fff url('img/logo/preloader.gif') no-repeat center center; /* Centers the loading animation */
}
.navbar-collapse {
    padding-left: 0px;
}
::-moz-selection {
    background: #0c54ad;
    text-shadow: none;
}
::selection {
    background: #0c54ad;
    text-shadow: none;
}
.bg-color{
    background:#fff;
}
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #2a354e;
    padding: 0.2em 0;
}
/**
 * Section Padding Utilities
 * Consistent spacing classes for different sections
 * Used to maintain vertical rhythm throughout the site
 */

/* Standard section padding - all sides */
.area-padding{
	padding: 100px;
}

/* Vertical padding with larger top */
.area-padding-2{
   padding: 100px 0px 80px; /* top | horizontal | bottom */
}

/* Balanced vertical padding */
.area-padding-3{
    padding: 80px 0px 110px; /* top | horizontal | bottom */
}

/* Larger top padding */
.area-padding-4{
    padding: 110px 0px 60px; /* top | horizontal | bottom */
}

/**
 * Section Headlines
 * Used for main section titles
 * Adds bottom spacing for separation from content
 */
.section-headline {
    padding-bottom: 40px; /* Space between headline and content */
    position: relative;
}
.section-headline h3 {
    font-size: 40px;
    padding-top: 30px;
    text-transform: capitalize;
    font-weight: 600;
    line-height: 48px;
}
.section-headline p {
    /*max-width: 560px;*/
    font-size: 17px;
    margin: 0 auto;
}
.white-headline h3{
   color:#fff; 
}
.section-headline h4 .color {
    color: #0c54ad;
    font-weight: 600;
}
.mar-row{
    margin-top: 50px;
}
.simple-text{
    font-weight: 400;
}
.color-text{
    color: #0c54ad
}
/*--------------------------------*/
/*  2. Header Top Area
/*--------------------------------*/

/**
 * Top Bar Navigation
 * Located in: navbar.php (included in all pages)
 * Purpose: Displays contact information and social media links
 * 
 * Structure:
 * - Left side: Contact info (phone, email, hours)
 * - Right side: Social media icons
 * - Hidden on mobile screens (hidden-xs class)
 */

/* Contact Information Items
 * Affects: .topbar-left elements in navbar.php
 * Examples:
 * - Phone number: "+1 (613) 111 7891"
 * - Email: "info@bscintec.org"
 * - Hours: "Mon - Fri: 08:00 - 16:00"
 */
.topbar-left ul li {
    display: inline-block; /* Creates horizontal list of contact items */
}

/* Top Bar Container
 * Applied to: <div class="topbar-area"> in navbar.php
 * Spans full width of page at top
 */
.topbar-area {
    background: transparent;
}

/* Contact Information Link Styling
 * Used in: Phone, email, and hours links in navbar.php
 * Includes icons from Font Awesome (fa-envelope, fa-phone-square, fa-clock-o)
 */
.topbar-left ul li a {
    color: #2a354e; /* Dark blue for readability */
    display: block;
    margin-right: 20px; /* Spacing between contact items */
    padding: 11px 0;
    text-decoration: none;
    font-size: 14px;
    letter-spacing: 0.60px; /* Better text spacing */
}

/* Contact info icons */
.topbar-left ul li a i {
    font-size: 16px;
    padding-right: 7px; /* Space after icon */
}

/* Last contact item */
.topbar-left ul li:last-child a{
	margin-right: 0px; /* Remove extra space */
}

/* Social media container */
.top-social {
    float: right;
    padding: 10px 0px;
}

/* Social media list items */
.top-social ul li{
    display: inline-block; /* Horizontal list */
}

/* Social media links */
.top-social ul li a {
    color: #fff; /* White icons */
    margin-left: 5px; /* Space between icons */
    display: block;
    text-align: center; /* Center icons */
    font-size: 13px;
    width: 28px;
    height: 28px;
    line-height: 29px;
    opacity: 0.8;
    border-radius: 50%;
	background: #90bc44;
}
.top-social ul li a:hover{
	color:#fff;
	opacity: 1;
}
.topbar-left ul li a i.fa-envelope,
.topbar-left ul li a i.fa-phone-square,
.topbar-left ul li a i.fa-clock-o {
  color: inherit;
  background: none !important;
  border: none !important;
}
.topbar-left ul li {
  color: inherit;
}
.topbar-left ul li a {
  color: inherit;
}
/*----------------------------------------*/
/*  2.1 Header Bottom Area 
/*----------------------------------------*/
.header-one {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 999;
}
.header-area{
	background:transparent;
    margin-bottom: -10px;
}
.logo {
    display: block;
}
.logo a {
    display: inline-block;
    height: auto;
    padding: 27px 0;
}
.header-area .container > .row {
  display: flex;
  align-items: center;
}
.header-area .logo {
  flex: 0 0 auto;
}
.header-area .col-md-9.col-sm-9 {
  flex: 1 1 0%;
  display: flex;
  align-items: left ;
  justify-content: left;
}
.main-menu {
  width: 100%;
  display: flex;
  justify-content: center;
}
.main-menu ul.navbar-nav {
  float: right !important;
  display: flex;
  justify-content: center;
  width: auto;
}
.header-area .main-menu {
  width: 100%;
  display: flex;
  justify-content: center;
}
.main-menu ul.navbar-nav li {
    float: left;
    position: relative;
}
.main-menu ul.navbar-nav li a {
    color: #2a354e;
    font-size: 16px;
    font-weight: 600;
    padding: 40px 15px;
    text-transform: capitalize;
    position: relative;
}
.main-menu > ul.navbar-nav >li >a::before {
    position: absolute;
    content: "";
    left: 16px;
    bottom: 34px;
    border: 1px solid #90bc44;
    width: 0;
    transition: 0.4s;
    opacity: 0;
}
.header-area.stick .main-menu > ul.navbar-nav >li >a::before {
    left: 16px;
    bottom: 27px;
}
.main-menu > ul.navbar-nav >li >a:hover::before {
    width:50%;
    transition: 0.4s;
    opacity: 1;
}
.main-menu ul.navbar-nav li a:hover{
	color: #90bc44;
}
.main-menu ul.navbar-nav li.active a:focus {
    color: #fff;
}
.main-menu ul.navbar-nav li.active a {
    background: transparent !important;
    color: #90bc44 !important;
    border-radius: 0;
    border-bottom: none;
    text-decoration: none;
    font-weight: 700;
}
.navbar {
    border: medium none;
    margin-bottom: 0;
    text-align:center
}
.navbar-default {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.main-menu ul.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background: none;
    color:#fff;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    background-color: transparent;
    color: #fff;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background: none;
}
.main-menu ul.nav li ul.sub-menu {
    background: #fff;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 115%;
    transition: all 0.3s ease 0s;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    visibility: hidden;
    width: 200px;
    z-index: -99;
	padding: 10px 0px;
    border-radius: 3px;
}
.pagess {
    position: relative;
}
.navbar.navbar-default {
    float: right;
}
.main-menu ul.nav li ul.sub-menu li {
    padding: 0;
    position: relative;
    width: 100%;
}
.main-menu ul.nav li:hover ul.sub-menu{
    top:100%;
    opacity:1;
    z-index:999;
    visibility:visible;
}
.main-menu ul.nav li ul.sub-menu li a {
    color: #2a354e;
    display: block;
    font-size: 15px;
    padding: 5px 20px;
}
.main-menu ul.nav li ul.sub-menu li a span{
    color: #0c54ad;
}
.main-menu ul.nav li:hover ul.sub-menu li a:hover{
    color:#0c54ad;
}
.header-right-link {
    float: right;
    width: 180px;
    padding: 37px 0px;
    margin-left: 70px;
    text-align: right;
}
.slice-btn {
    display: inline-block;
    padding: 0px 15px;
}
.slice-btn span {
    font-size: 20px;
    font-weight: 500;
    color: #2a354e;
    cursor: pointer;
    line-height: 28px;
}
.s-menu {
    padding: 10px 20px;
    border: 1px solid #90bc44;
    background: #90bc44;
    color: #fff;
    transition: 0.4s;
    font-size: 15px;
    font-weight: 600;
    border-radius: 2px;
}
.s-menu:hover {
    border: 1px solid #90bc44;
    background: transparent;
	color:#90bc44;
    transition: 0.4s;
}
.header-area.stick  .header-right-link {
    padding: 27px 0px;
}
/*--------------------------------*/
/* 2.2. Sticky Header Area
/*--------------------------------*/
.header-area.stick {
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999999;
    box-shadow: 0px 0px 3px #ddd, -2px -2px 3px #ddd;
    background: white;  /*THis is the background color of the header sticky when scrolling*/
}
.header-area.stick .logo a {
    display: inline-block;
    height: auto;
    padding: 17px 0;
}
.header-area.stick .main-menu ul.navbar-nav li a {
    padding: 30px 15px;
    color: #2a354e;
}
.header-area.stick .main-menu ul.nav li ul.sub-menu li a {
    color: #2a354e;
    display: block;
    padding: 5px 15px;
}
.header-area.stick .main-menu ul.nav li ul.sub-menu li a:hover{
    color: #90bc44;
}
/*----------------------------------------*/
/*  2.3. Mobile Menu Area
/*----------------------------------------*/
.mobile-menu-area {
    background: #fdfcfc none repeat scroll 0 0;
    padding: 10px 0px ;
}
.mean-container .mean-bar::after {
    content: "";
    font-size: 21px;
    left: 5%;
    position: absolute;
    top: 12px;
    text-transform: uppercase;
    font-weight: 500;
}
.mean-container a.meanmenu-reveal:hover {
    color:#90bc44
}
.mean-container .mean-nav ul {
    list-style-type: none;
    margin: 20px 0px;
    padding: 0;
    width: 100%;
}
.mean-container .mean-nav ul li a {
    background: #fdfcfc none repeat scroll 0 0;
    color: #2a354e;
    display: block;
    float: left;
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    padding: 13px 10px;
    text-align: left;
    text-decoration: none;
    text-transform: capitalize;
    width: 90%;
}
.mean-nav ul li.mean-last {
    margin-bottom: 20px;
}
.mean-container .mean-nav ul li a.mean-expand {
    color: #2a354e;
    line-height: 17px;
}
.mean-container .mean-nav ul li {
    width: 99.7%;
}
/*----------------------------------------*/
/*  3. Intro Area
/*----------------------------------------*/
.intro-home{
	position: relative;
	overflow: hidden;
    z-index: 1;
}
.display-table{
	width: 100%;
	height: 100%;
	display: table;
}
.display-table-cell{
	width: 100%;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}
.intro-content {
    position: relative;
    z-index: 2;
    top: 50%;
    left: 0;
    width: 100%;
    height: auto;
    margin-top: -180px;
}
.slide-all-text {
    margin-top: 65px;
}
.slider-content {
    position: relative;
}
.layer-1 h2 {
    color: #2a354e;
    font-size: 48px;
    font-weight: 600;
    line-height: 58px;
    max-width: 640px;
    margin-bottom: 20px;
}
.layer-2 p {
    font-size: 18px;
}
.ready-btn {
    border: 1px solid #90bc44;
    background: #90bc44;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    margin-top: 20px;
    padding: 12px 20px;
    text-align: center;
    text-transform: capitalize;
    transition: all 0.4s ease 0s;
    border-radius: 2px;
}
.ready-btn:hover{
    color: #90bc44;
    background: transparent;
    transition: all 0.4s ease 0s;
}
/*--------------------------------*/
/* 4.About Area
/*--------------------------------*/
.about-area {
    position: relative;
}
.about-image {
    position: relative;
}
.about-text h3 {
    font-size: 34px;
    line-height: 40px;
}
.about-text li {
    display: block;
    position: relative;
}
.about-text ul li a {
    font-size: 15px;
    color: #757b82;
    padding: 6px 0px 6px 35px;
    display: block;
}
.about-text li::after {
    position: absolute;
    left: 0px;
    top: 10px;
    content: "\e64c";
    font-family: themify;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    border-radius: 50px;
    font-size: 12px;
    color: #fff;
    background: #74AB43;
}
.ab-btn {
    padding: 8px 20px;
    border: 1px solid #90bc44;
    background: #90bc44;
    color: #fff;
    transition: 0.4s;
    font-size: 17px;
    font-weight: 600;
    border-radius: 3px;
    margin-top: 30px;
    display: inline-block;
}
.ab-btn:hover{
    background: transparent;
    color: #90bc44;
    transition: 0.4s;
}
/*----------------------------------------*/
/*  5. Services Area
/*----------------------------------------*/

/* Mobile Responsive Adjustments for Service Details Pages */
@media (max-width: 767px) {
    /* Force container to full width */
    .single-services-page .container {
        padding: 0;
        width: 100%;
    }
    
    /* Center the service sections */
    .service-section {
        padding: 0 15px !important;
        width: 100% !important;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    /* Center the content area */
    .service-section .col-md-12 {
        padding: 0;
        width: 100%;
    }

    /* Center text content */
    .single-well {
        text-align: center !important;
        padding: 15px !important;
        margin: 0 !important;
    }

    .single-well h3 {
        text-align: center !important;
    }

    .single-well p {
        text-align: center !important;
        padding: 0 10px;
    }

    /* Center images */
    .page-img.elec-page {
        width: 100%;
        text-align: center;
        padding: 0 15px;
    }

    .page-img.elec-page img {
        max-width: 100%;
        height: auto;
        margin: 0 auto;
        display: block;
    }

    /* Remove any floating */
    .col-md-8.col-sm-8.col-xs-12,
    .col-md-12.col-sm-12.col-xs-12 {
        float: none !important;
        margin: 0 auto;
    }
}


/* Mobile Responsive Adjustments for Footer on  */
@media (max-width: 767px) {
    /* Footer size reduction for mobile */
  .footer-area {
        padding: 20px 0 10px !important;  /* Further reduced from 40px */
    }

    .footer-content {
        margin-bottom: 10px !important;  /* Reduced from 20px */
        padding: 0 10px !important;      /* Reduced from 15px */
    }

    .footer-head {
        margin-bottom: 8px !important;   /* Reduced from 15px */
    }

    /* Reduce space between footer sections */
    .col-md-5.col-sm-5.col-xs-12,
    .col-md-4.col-sm-3.col-xs-12,
    .col-md-3.col-sm-4.col-xs-12 {
        margin-bottom: 10px !important;
        padding: 0 5px !important;
    }

    /* Minimize spacing in lists */
    .footer-list {
        margin-bottom: 8px !important;
        column-count: 1 !important;  /* Split into two columns to save vertical space */
    }

    /* Reduce bottom area height */
    .footer-area-bottom {
        padding: 8px 0 !important;   /* Reduced from 15px */
    }

    /* Tighten up the subscription form */
    .subs-feilds {
        margin: 8px 0 !important;    /* Reduced from 15px */
    }

    /* Reduce spacing between contact info */
    .footer-contacts p {
        margin-bottom: 3px !important;  /* Reduced from 5px */
        line-height: 1.3 !important;    /* Tighter line height */
    }

    /* Tighter spacing for social icons */
    .footer-icons {
        margin-top: 8px !important;
    }

    .footer-icons ul li {
        margin: 0 2px !important;    /* Reduced spacing between icons */
    }
}

.service-img {
    margin-bottom: 20px;
}
.single-service {
    padding: 36px 30px;
    border:1px solid #fff;
    position: relative;
    min-height: 300px;
}
.all-service {
    padding-left: 15px;
    padding-right: 15px;
}
.all-service .col-md-4,
.all-service .col-sm-6{
    padding-left: 0px;
    padding-right: 0px;
    padding-top: -10px
    /* background-color: rgb(219, 0, 0) !important; */
}
.text-service{
	box-shadow: 0 5px 25px rgba(10, 10, 10, 0.1);
	background: #fff;
	transition: 0.5s;
}
.service-content h4 {
    font-size: 24px;
    line-height: 30px;
    text-transform: capitalize;
}
.service-content h4 a{
	color:#2a354e;
}
.single-service:hover{
	box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
	background: #fff;
	transition: 0.5s;
}
.service-content h4 a:hover {
	color:#90bc44;
}
.single-service h3 {
    font-size: 34px;
    line-height: 40px;
}
.single-service p {
    margin-bottom: 0px;
}
.service-btn {
    border: 1px solid #90bc44;
    background: #90bc44;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    margin-top: 20px;
    padding: 10px 20px;
    text-align: center;
    text-transform: capitalize;
    transition: all 0.4s ease 0s;
    border-radius: 2px;
}
.service-btn:hover{
    border: 1px solid #90bc44;
    background: transparent;
    color: #90bc44;
    transition: all 0.4s ease 0s;
}
.main-menu ul.navbar-nav li.active > a {
  background: transparent !important;
  color: #90bc44 !important;
  border-radius: 0;
  border-bottom: none;
  text-decoration: none;
  font-weight: 700;
}
/*--------------------------------*/
/* 6.tab Area
/*--------------------------------*/
.tab-area{
	position: relative;
}
.tab-menu {
    display: block;
}
.tab-menu ul.nav{
    margin: 0;
    padding: 0;
}
.tab-menu ul.nav li {
    border: medium none;
    float: left;
    width: 25%;
}
.tab-menu ul.nav li a {
    border-radius: 0;
    display: flex;
    color: #2a354e;
    padding: 20px;
    align-items: center;
}
.tab-menu .nav-tabs{
	border-bottom: none;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus {
  border-color: #f5f5f5;
  border-image: none;
  border-style: solid;
  border-width: 1px;
  color: #fff !important;
  cursor: default;
  position: relative;
  background: #90bc44;
}
.tab-menu ul.nav li a:hover{
    background:transparent;
}
.tab-menu ul.nav li.active a:hover{
    background:#90bc44;
}
.cha-icon {
    display: inline-block;
    margin-right: 15px;
    font-size: 50px;
    line-height: 50px;
}
.title-date {
    display: inline-block;
    position: relative;
}
.tab-menu ul.nav li.active .cha-title,
.tab-menu ul.nav li.active .cha-date {
    color: #fff;
    background: #90bc44;
}
.cha-title {
    display: inline-block;
    font-size: 22px;
    line-height: 26px;
    width: 70%;
}
.single-machine{
	position: relative;
}
.tab-menu ul.nav li:first-child a{
	margin-top: 0px;
}
.tab-content {
    margin-top: 40px;
}
.machine-text {
    margin-top: 20px;
}
.machine-text h3 {
    font-size: 32px;
    line-height: 40px;
}
.machine-text li {
    display: block;
    position: relative;
}
.machine-text ul li a {
    font-size: 15px;
    color: #757b82;
    padding: 6px 0px 6px 35px;
    display: block;
}
.machine-text li::after {
    position: absolute;
    left: 0px;
    top: 10px;
    content: "\e64c";
    font-family: themify;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    border-radius: 50px;
    font-size: 12px;
    color: #fff;
    background: #74AB43;
}
/*----------------------------------------
  7. Achivement Area Css
----------------------------------------*/
.single-achive {
    border: 1px solid #ddd;
    position: relative;
    display: flex;
    overflow: hidden;
    padding: 30px 20px;
    align-items: center;
}
.achive-image {
    float: left;
    width: 36%;
    height: 100%;
    margin-right: 15px;
}
.achivement-text h4 {
    color: #2a354e;
    font-size: 22px;
    text-transform: capitalize;
    margin-bottom: 0px;
    font-weight: 500;
}
.achive-number {
    font-size: 44px;
    font-weight: 700;
    line-height: 60px;
    color:#90bc44;
}

.we-services {
    margin-top: 60px;
    border-top: 1px solid #ccc;
    padding-top: 60px;
}
.we-services .digital-services {
    width: 20%;
    float: left;
}
.digital-wel {
    text-align: center;
    border: 1px solid #ddd;
    padding: 30px;
}
.digital-icon {
    font-size: 60px;
    margin-bottom: 20px;
    display: block;
    line-height: 60px;
}
.digital-content h4 {
    font-size: 20px;
    font-weight: 400;
    text-transform: capitalize;
    line-height: 30px;
    margin-bottom: 0px;
}
/*--------------------------------*/
/*  8. projects Area
/*--------------------------------*/
.single-awesome-project {
    float: left;
    overflow: hidden;
    width:100%;
    background-color: white !important;
    color: white !important;
    border-radius: 8px;
}
.project-all{
    margin-top: -50px;
}
.project-all .single-awesome-project {
    margin-top: 30px;
}
.project-carousel .col-md-4{
    color: green;
	width: 100%;
}

.project-carousel .single-awesome-project:hover .project-dec h4 {
  color: #90bc44 !important;
}
.awesome-img{
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.awesome-img img{
    transform: scale(1.1);
    transition: 0.4s;
}
.single-awesome-project:hover .awesome-img img{
    transform: scale(1);
    transition: 0.4s;
}
.awesome-img > a {
    display: block;
    position: relative;
}
.single-awesome-project:hover .awesome-img > a::after{
    opacity: 1;
}
.single-awesome-project:hover .add-actions{
    opacity: 1;
}
.awesome-img > a::after {
    background: rgba(144,188,68,0.95);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    opacity: 0;
    transition: 0.4s;
}
.add-actions {
    display: block;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    transition: all 0.4s ease 0s;
    width: 100%;
    z-index:4;
    top: 0;
    cursor: pointer;
    background: transparent;
}
.port-icon {
    color: #fff;
    display: inline-block;
    cursor: pointer;
    top: 41%;
    position: relative;
    font-size: 40px;
}
.project-dec {
    display: block;
    padding: 20px 5px 5px 5px;
    color: #90bc44 !important
}
.project-dec h4 {
    color: #90bc44;
    font-size: 24px;
    font-weight: 500;
    text-decoration: none;
    text-transform: capitalize;
    margin-bottom: 0px;
    cursor: pointer;
    position: relative;
    padding-left: 5px;
}
.project-dec h4::after {
    position: absolute;
    content: "\e628";
    right: 40px;
    top: 0px;
    font-family: themify;
    font-size: 20px;
    transition: 0.5s;
    width: 50px;
    height: 30px;
    border: 1px solid #90bc44;
    background: #90bc44;
    color: #90bc44;
    text-align: center;
    line-height: 27px;
    opacity: 0;
     transition: 0.5s;
}
/* Disabled old arrow button
.single-awesome-project:hover .project-dec h4::after {
    right: 0px;
    opacity: 1;
    transition: 0.5s;
    color: #fff
}
*/

/* New functional arrow button styles */
.project-arrow-btn {
    opacity: 0;
    transform: translateX(20px) scale(0.8);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    text-decoration: none;
}

.single-awesome-project:hover .project-arrow-btn {
    opacity: 1;
    transform: translateX(0) scale(1);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.project-arrow-btn:hover {
    background: #7da637 !important;
    border-color: #7da637 !important;
    transform: translateX(0) scale(1.1);
    text-decoration: none;
    color: #fff !important;
}
.project-dec h4 {
    color: #90bc44;
    font-size: 24px;
    font-weight: 500;
    text-decoration: none;
    text-transform: capitalize;
    margin-bottom: 5px;
    cursor: pointer;
    position: relative;
    padding-left: 5px;
    text-align: center;
    padding-right: 5px;
    overflow-y: auto;
    height: 40px;
    scrollbar-width: thin;
    scrollbar-color: #90bc44 #f5f5f5;
    word-wrap: break-word;
}
.project-dec a{
	color: #90bc44;
}
.project-carousel .single-awesome-project:hover .project-dec h4 {
  color: #90bc44 !important;
}
.pst-content {
    padding: 0px 10px;
}
.single-awesome-project:hover .project-dec h4 {
    color:#90bc44;
}
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev, 
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
    color: #fff;
    font-size: 18px;
    margin-top: -20px;
    position: absolute;
    top: 50%;;
    text-align: center;
    line-height: 39px;
    opacity: 0;
    border:1px solid #fff;
    width: 40px;
    height: 40px;
	border-radius: 50%;
}
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev{
    left: 10%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
}
.project-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
    right: 10%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
}
.project-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-next{
    right: 2%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
}
.project-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-prev{
    left: 2%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
}
.project-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-next:hover,
.project-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-prev:hover{
    color:#fff;
    background: #0c54ad;
    border: 1px solid #0c54ad;
}
/*----------------------------------------
 9.Reviews Area Css
----------------------------------------*/
.reviews-area{
    position: relative;
}
.testimonial-inner {
    padding: 0px 50px 0px 0px;
}
.review-head h3 {
    font-size: 34px;
    line-height: 40px;
}
.review-head p {
    font-size: 17px;
}
.reviews-btn{
    border: 1px solid #90bc44;
    background: #90bc44;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    margin-top: 20px;
    padding: 10px 20px;
    text-align: center;
    text-transform: capitalize;
    transition: all 0.4s ease 0s;
    border-radius: 2px;
}
.reviews-btn:hover{
    border: 1px solid #90bc44;
    background: #fff;
    color: #90bc44;
}
.single-testi {
    margin: 0px 0px 50px;
}
.clients-text{
    padding: 40px 30px;
    position: relative;
    background-color: #fff;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}
.reviews-content .clients-text::after {
    position: absolute;
    left: 40px;
    bottom: -28px;
    content: "";
    border-top: 30px solid #fff;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
}
.testi-img {
    position: relative;
    margin-top: 50px;
}
.testi-img img {
    width: 100%;
    display: inline-block !important;
    max-width: 80px;
    height: auto;
    border-radius: 50px;
    margin-right: 20px;
}
.reviews-content .active.center .testi-img img {
    border: 2px solid #90bc44;
}
.guest-details {
    display: inline-block;
    text-align: left;
    top: 15px;
    position: relative;
}
.reviews-content {
    margin-bottom: 5px;
}
.testi-text h4 {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 15px;
    margin-bottom: 0px;
}
.testi-text p {
    margin-bottom: 0px;
}
.client-rating {
    margin-bottom: 10px;
}
.testi-text span a{
    color:#90bc44;
}
.testi-text h5 {
    color: #2a354e;
    font-size: 20px;
}
.client-rating a {
    display: inline-block;
    color: #fec731;
    font-size: 20px;
    padding: 0px 5px 0px 0px;
}
.reviews-content .active.center .single-testi .clients-text{
    background: #90bc44;
}
.reviews-content .active.center .single-testi .clients-text p{
    color:#fff;
}
.reviews-content .active.center .clients-text::after {
    position: absolute;
    left: 40px;
    bottom: -28px;
    content: "";
    border-top: 30px solid #90bc44;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot > span {
    background: #2a354e none repeat scroll 0 0;
    display: inline-block;
    height: 8px;
    width: 8px;
    -moz-transition:0.4s;
    -webkit-transition:0.4s;
    -o-transition:0.4s;
    -ms-transition:0.4s;
    transition:0.4s;
    border-radius: 50%;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots {
    bottom: -10px;
    display: block;
    left: 50%;
    margin-left: -40px;
    position: absolute;
}
.testimonial-content {
    margin-bottom: 15px;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot {
    display: inline-block;
    margin: 0 3px;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot.active span {
    background: #90bc44;
    width: 30px;
    border-radius: 3px;
}
/*----------------------------------------*/
/*  10. Blog Area
/*----------------------------------------*/
.blog-content {
    padding: 30px;
    position: relative;
    z-index: 1;
    transition: 0.5s;
    overflow: hidden;
}
.blog-content a h4 {
    font-size: 21px;
    color: #2a354e;
    line-height: 30px;
    transition: 0.4s;
}
.home-blog .blog-content a h4 {
    margin-bottom: 0px;
}
.admin-type i,
.date-type i,
.comments-type i{
    color: #90bc44;
    margin-right: 5px;
}
.single-blog:hover .blog-content::after {
    transition: 0.4s;
    opacity: 1;
    top: 0px;
}
.blog-content p {
    line-height: 28px;
     transition: 0.4s;
}
.blog-content a h4:hover{
    color:#90bc44;
    transition: 0.4s;
}
.blog-meta span {
    color: #757b82;
    font-size: 14px;
    font-weight: 400;
    padding-right: 10px;
}
.admin-type img {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    border: 2px solid #90bc44;
    margin-right: 10px;
}
.single-blog {
    position: relative;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
}
.blog-meta {
    margin-bottom: 15px;
}
.blog-btn {
    color: #fff;
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    transition: all 0.4s ease 0s;
    border: 1px solid #90bc44;
    background: #90bc44;
    padding: 7px 24px;
    margin-top: 10px;
    border-radius: 3px;
}
.blog-btn:hover{
    color: #90bc44;
    background: transparent;
    transition: all 0.4s ease 0s;
}
/*----------------------------------------*/
/*  11. Footer Area
/*----------------------------------------*/
.footer1 {
    background:url(../img/background/fg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    z-index: 1;
    position: relative;
    overflow: hidden;
}
.footer1::after {
    background: url(../img/background/shape-footer.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 1;
}
.footer-area {
    padding: 100px 0px;
}
.footer-content{
    overflow: hidden;
}
.footer-logo {
    margin-bottom: 20px;
}
.footer-head p {
    color: #757b82;
}
.logo-footer .footer-head p {
    color: #757b82;
    margin-bottom: 0px;
}
.footer-head h4 {
    color: #90bc44;
    font-size: 22px;
    margin-bottom: 30px;
    text-transform: capitalize;
    font-weight: 600;
}
.footer-icons ul li {
    display: inline-block;
}
.footer-icons ul li a {
    color: #fff;
    display: block;
    font-size: 15px;
    line-height: 28px;
    text-align: center;
    margin-right: 3px;
    width: 30px;
    height: 30px;
    border: 1px solid #90bc44;
    border-radius: 2px;
    background: #90bc44;
    transition: 0.4s;
}
.footer-tags li a:hover,
.footer-icons ul li a:hover{
    color: #90bc44;
    background: #fff;
    transition: 0.4s;
}
.footer-tags {
    display: block;
    overflow: hidden;
}
.footer-tags li {
    float: left;
}
.footer-tags li a {
    color: #757b82;
    display: block;
    font-size: 14px;
    font-weight: 500;
    padding: 3px 5px;
}
.footer-icons {
    margin-top: 30px;
}
.footer-list {
    width: 50%;
    float: left;
}
.footer-contacts p span {
    color: #90bc44;
    font-weight: 700;
}
.subs-feilds {
    margin-top: 30px;
}
.suscribe-input {
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    width: 95%;
}
.footer-content.logo-footer {
    padding-right: 30px;
}
.suscribe-input input {
    color: #757b82;
    font-size: 15px;
    line-height: 24px;
    padding: 6px 15px;
    height: 46px;
    border-radius: 0;
    width: 64%;
    float: left;
    background: #fff;
}
.suscribe-input button {
    background: #90bc44;
    border: none;
    color: #fff;
    font-size: 15px;
    padding: 10px 5px;
    width: 36%;
    font-weight: 600;
    height: 46px;
    border: 1px solid #90bc44;
    transition: 0.4s;
}
.suscribe-input button:hover{
    color: #90bc44;
    background: #fff;
     transition: 0.4s;
}
.footer-list li a {
    color: #757b82;
    padding: 7px 0px 7px 20px;
    display: block;
    position: relative;
    font-weight: 400;
}
.footer-list li a:first-child{
	padding-top: 0px;
}
.footer-list li a::after {
    position: absolute;
    content: "";
    right: auto;
    top: 12px;
    width: 5px;
    height: 5px;
    background: #757b82;
    left: 0;
}
.footer-list li a:hover{
    color: #90bc44;
}
.footer-list li a:hover::after{
    background: #90bc44;
}
.footer-area-bottom {
    padding: 25px 0;
    background:#f2f2f2;
}
.copyright-text a:hover{
	text-decoration: underline;
	color:#90bc44;
}
.copyright-text a {
    color: #90bc44;
}
.copyright > p {
    margin-bottom: 0;
    color: #757b82;
}
.copyright a {
    color: #90bc44;
}
/*----------------------------------------*/
/*  12. Home page 02
/*----------------------------------------*/
.header-two {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 999;
}
.intro-area{
    background-color: #f1f7e6;
    height: 90vh;
}
.intro-area-2{
    position: relative;
    z-index: 1;
}
.intro-area-2::after {
    background: rgba(0,0,0,0.8);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.intro-area-2 .intro-content {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 0;
    width: 100%;
    height: auto;
    margin-top: -118px;
}
.header-area-2 .main-menu ul.navbar-nav li a{
    color:#fff;
}
.header-two .topbar-left ul li a{
    color:#ddd;
}
.header-two .topbar-left ul li a i{
    color:#90bc44;
}
.header-two .top-social ul li a{
    background: #90bc44;
}
.header-area-2 .black-logo {
    display: none;
}
.header-area-2.stick .logo a.white-logo {
    display: none;
}
.header-area-2.stick .black-logo {
    display: block;
}
.header-area-2.stick.main-menu ul.navbar-nav li a{
    color:#2a354e;
}
.intro-area-2 .layer-1 h2 {
    color: #fff;
    font-size: 72px;
    font-weight: 600;
    line-height: 80px;
    max-width: 900px;
    margin: 0px auto 20px;
    text-align: center;
}
.intro-area-2 .layer-2 p {
    color: #ddd;
    max-width: 600px;
    text-align: center;
    margin: 0px auto 20px;
}
.intro-area-2 .layer-3{
    text-align: center;
}
.color-2{
    color:#74AB43;
}
.service-area-2 .service-btn,
.header-area-2 .s-menu,
.intro-area-2 .ready-btn{
    background: #90bc44;
    border:1px solid #90bc44;
    transition: 0.4s;
}
.header-area-2 .s-menu:hover{
    background:transparent;
    color:#fff;
    border:1px solid #fff;
}
.service-area-2 .service-btn:hover,
.intro-area-2 .ready-btn:hover{
    background:transparent;
    color:#90bc44;
    transition: 0.4s;
}
.header-area-2.stick .s-menu:hover{
    background: transparent;
    border:1px solid #90bc44;
    color:#90bc44;
}
.header-area-2 .main-menu > ul.navbar-nav >li >a::before{
    border: 1px solid #90bc44;
}
.header-area-2 .header-right-link {
    margin-left: 140px;
}
.footer2{
    position: relative;
    z-index: 1;
}
.footer2 {
    background: url(../img/background/fg2.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    z-index: 1;
    position: relative;
    overflow: hidden;
}
.footer2::after {
    background: rgba(0,0,0,0.86);
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.footer2 .footer-list li a,
.footer2 .footer-head p{
    color:#ddd;
}
.footer2 .footer-head h4{
    color:#fff;
}
.footer2 .footer-list li a::after{
    background: #ddd;
}
.footer2 .footer-area-bottom{
    background: rgba(0,0,0, 0.80);
}
.footer2 .copyright > p{
    color:#ddd;
}
.footer2 .footer-contacts p span{
    color:#90bc44;
}
.footer2 .suscribe-input button{
    background: #90bc44;
    border:1px solid #90bc44;
}
.footer2 .footer-icons ul li a{
    background: #90bc44;
    border:1px solid #90bc44;
}
.footer2 .footer-icons ul li a:hover{
    background:transparent;
    color: #90bc44;
}
.footer2 .suscribe-input button:hover{
    background:#fff;
    color: #90bc44;
}
.footer2 .footer-list li a:hover{
    color:#90bc44;
}
.footer2 .footer-list li a:hover::after{
    background: #90bc44;
}
.footer2 .copyright a{
    color:#90bc44;
}
/*--------------------------------*/
/* 12.2 .home-2 welcome Services Area
/*--------------------------------*/
.well-services {
    background: #fff;
    text-align: center;
    position: relative;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    z-index: 1;
    padding: 40px 20px;
    overflow: hidden;
    border-radius: 3px;
    transition: 0.4s;
    z-index: 1;
    margin-bottom: 30px;
}
.well-services::before{
    position: absolute;
    content:"";
    left: 0px;
    top: 0;
    width: 100%;
    height: 100%;
    background:url(../img/about/wl.png);
    background-repeat: no-repeat;
    background-size: cover;
    transition: 0.4s;
    opacity: 0;
    z-index: -1;
}
.well-services::after{
    position: absolute;
    content:"";
    left: 0px;
    top: 0;
    width: 100%;
    height: 100%;
    background:rgba(12,84,173,0.96);
    transition: 0.4s;
    opacity: 0;
    z-index: -1;
}
.big-icon {
    font-size: 60px;
    display: inline-block;
    line-height: 66px;
    color: #0c54ad;
}
.main-wel {
    padding: 20px 0px 0px;
}
.wel-content p {
    margin-bottom: 0px;
}
.wel-content h4 {
    display: inline-block;
    font-size: 20px;
    margin-bottom: 0;
    padding: 0 0 10px;
    font-weight: 500;
}
.well-services:hover .big-icon {
    transition: 0.4s;
    color: #fff;
}
.well-services:hover::before{
    transition: 0.4s;
    opacity:1; 
}
.well-services:hover::after{
    transition: 0.4s;
    opacity:1; 
}
.well-services:hover .wel-content h4,
.well-services:hover .wel-content p {
    color:#fff;
}
/*----------------------------------------*/
/*  13. Breadcumbs Area
/*----------------------------------------*/
.page-area {
    position: relative;
    z-index: 1;
    
}
.page-area {
    background: url(../img/background/bg4.jpg) !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    margin: auto
}
.page-area::after{
    position: absolute;
    content: "";
    left:0;
    top: 0;
    width:100%;
    height: 100%;
    background-color:rgba(0,0,0,0.8); 
    z-index: -1;
    
}
.breadcrumb .section-headline {
    text-align: center;
    padding-bottom: 10px;
}
.page-area .section-headline::after {
    display: none;
}
.breadcrumb {
    background-color: transparent;
    margin-bottom: 0;
    padding: 230px 0px 140px;
}
.breadcrumb h3 {
    color: #fff;
    font-size: 42px;
    font-weight: 600;
    line-height: 50px;
    position: relative;
    margin-bottom: 0px;
}
.breadcrumb .section-headline {
    text-align: center;
}
.breadcrumb ul li {
    display: inline-block;
    color: #f5f5f5;
    padding: 0px 10px 0px 20px;
    position: relative;
    font-size: 16px;
}
.breadcrumb ul li.home-bread{
    padding-left: 0px;
}
.breadcrumb ul li.home-bread::after {
    position: relative;
    content: "\f105";
    font-family: fontAwesome;
    right: -5px;
    top: 0;
    padding-left: 5px;
}
.breadcrumb ul li.home-blog{
    padding-left: 0px;
}
.breadcrumb ul li.home-blog::after {
    position: relative;
    font-family: fontAwesome;
    right: -5px;
    top: 0;
    padding-left: 5px;
}
.brand-content {
    overflow: hidden;
    text-align: center;
    padding: 60px 0px;
}
.project-page-area .single-awesome-project {
    margin-bottom: 30px;

    /* background-color: #f2f2f2 !important; */
    
}
.pages-blog .blog-content a h4 {
    margin-bottom: 15px;
}
/*----------------------------------------*/
/*  14.	About page area
/*----------------------------------------*/
.single-proses {
    margin-top: 45px;
}
.proses-icon a {
    width: 100px;
    height: 100px;
    line-height: 97px;
    font-size: 36px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    display: inline-block;
    border-radius: 50%;
    margin-bottom: 30px;
    background:#fff; 
}
.proses-icon {
    position: relative;
    display: inline-block;
}
.point-view {
    width: 40px;
    height: 40px;
    line-height: 37px;
    font-size: 16px;
    color: #fff;
    border-radius: 50%;
    position: absolute;
    left: -10px;
    top: -10px;
}
/* Mission/Vision/Engagement cards: left align, break long words, fill card width */
.proses-text p {
    text-align: center;
    word-break: break-word;
    margin-bottom: 0px;
    margin-left: 0;
    margin-right: 0;
    display: block;
}
.point-blue .point-view{
    background: #90bc44;
    border: 1px solid #90bc44;
}
.point-orange .point-view{
    background: #b91ca8;
    border: 1px solid #b91ca8;
}
.point-green .point-view{
    background: #90bc44;
    border: 1px solid #90bc44;
}
.point-blue.proses-icon a{
    color:#90bc44;
}
.point-orange.proses-icon a{
    color:#b91ca8;
}
.point-green.proses-icon a{
    color:#90bc44;
}
.proses-text h4 {
    text-transform: capitalize;
    font-size: 22px;
    max-width: 270px;
    margin: 0px auto 15px;
}
/*----------------------------------------*/
/*  15. Team Area css
/*----------------------------------------*/
/* Force white background for project page */
.page-area,
.breadcumb-overlay,

.single-member {
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.06);
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}
.team-hover {
    padding: 15px 0 0px;
    text-align: center;
    transition: all 0.4s ease 0s;
}
.single-member .team-img {
    display: block;
    position: relative;
}
.single-member .team-img a {
    display: block;
}
.team-content {
    position: absolute;
    top: 100%;
    content: "";
    left: 0;
    right: 0;
    transition: 0.5s;
    background: rgba(16,103,219,0.96) none repeat scroll 0 0;
    width: 100%;
    height: 200px;
}
.team-content h4 a {
    color: #fff;
}
.team-content p {
    margin-bottom: 0;
    color: #ddd;
}
.team-content h4 {
    font-size: 16px;
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}
.team-content .social-icon{
  margin-top: 15px;
     opacity: 0;
}
.social-icon li{
    display: inline-block;
    margin: 0px 2px;
}
.social-icon li a {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 1px solid #90bc44;
    color: #90bc44;
    border-radius: 3px;
    font-size: 18px;
    text-align: center;
    line-height: 39px;
    background: #fff;
}
.social-icon li a:hover{
    border:1px solid #fff;
    color:#90bc44;
	background: #fff;
}
.single-member .team-img::after{
    background: rgba(16,103,219,0.97) none repeat scroll 0 0;
    width: 100%;
    height: 0%;
    position: absolute;
    content: "";
    left: 0;
    top:0;
    transition: 0.5s;
	box-shadow: 2px 2px 20px #ddd;
}
.single-member:hover .team-img::after{
    height: 100%;
}
.single-member:hover .team-content .social-icon{
     opacity: 1;
}
.single-member:hover .team-content {
    opacity: 1;
     top: 50%;
    margin-top: -65px;
    transition: 0.5s;
    background: rgba(16,103,219,0.01) none repeat scroll 0 0;
}
/*----------------------------------------*/
/*  16. FAQ  Area
/*----------------------------------------*/
.faq-area{
    position: relative;
}
.company-faq {
    display: block;
    overflow: hidden;
}
.left-faq {
    display: block;
    overflow: hidden;
    padding-right: 40px;
}
.right-faq {
    display: block;
    overflow: hidden;
    padding-left: 40px;
}
.single-faq .number {
    color: #90bc44;
    font-weight: 600;
    padding-right: 10px;
    float: left;
}
.single-faq h4 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 10px;
}
.single-faq p {
    padding-left: 40px;
}
span.q-text {
    padding-left: 40px;
    display: inherit;
    font-size: 20px;
    font-weight: 600;
}
.single-faq {
    margin-bottom: 30px;
}
/*----------------------------------------*/
/*  17. Blog Sidebar Area
/*----------------------------------------*/
.blog-page-area .single-blog {
    padding: 5px;
    background: #fff;
}
.blog-page-area .blog-content{
	padding: 10px 15px 20px;
}
.blog-search-option input {
    padding: 5px 15px;
    width: 80%;
    border: none;
    height: 56px;
    background: transparent;
}
.blog-search-option {
    margin-bottom: 30px;
    display: block;
    background: #fff;
    border: 1px solid #90bc44;
    border-radius: 3px;
}
.blog-search-option button {
    background: transparent;
    border: none;
}
.blog-search-option button i {
    line-height: 16px;
    font-size: 18px;
    padding: 0px 10px;
}
.blog-search-option button i:hover {
    color: #90bc44;
}
.left-blog h4 {
    position: relative;
    color: #3d5368;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 5px;
    padding: 15px 0px;
    text-transform: capitalize;
}
.left-blog h4::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 70px;
    height: 1px;
    background: #90bc44;
}
.blog-left-content .blog-content::after{
    display: none;
}
.left-side {
    padding-right: 40px;
}
.right-side{
    padding-left: 40px;
}
.left-blog {
    overflow: hidden;
    padding-bottom: 20px;
}
.blog-category li,
.left-blog li {
    display: block;
    position: relative;
}
.left-blog ul li a {
    color: #3d5368;
    display: inline-block;
    font-size: 15px;
    padding: 7px 0px 7px 25px;
    text-transform: capitalize;
}
.blog-category ul {
    margin-top: 12px;
}
.left-blog ul li span {
    display: inline-block;
    border: 1px solid #90bc44;
    width: 24px;
    height: 24px;
    text-align: center;
    border-radius: 4px;
    font-size: 13px;
    color: #90bc44;
    line-height: 24px;
}
.pst-content .date-type{
	font-size: 14px;
}
.blog-category ul li:after {
    position: absolute;
    content: "\e649";
    right: 5px;
    top: 8px;
    font-family: themify;
    color: #3d5368;
    font-size: 13px;
}
.popular-tag.left-blog ul li a:before {
    display: none;
}
.recent-single-post {
    display: block;
    overflow: hidden;
    padding: 15px 0px;
}
.recent-single-post:last-child {
    border-bottom: none;
}
.post-img {
    display: inline-block;
    float: left;
    padding-right:10px;
}
.left-blog .post-img a {
    display: block;
    border:1px solid #fafafa; 
}
.left-blog .post-img a img {
    border-radius: 4px;
}
.pst-content {
    padding-left: 100px;
}
.pst-content p{
	margin-bottom: 0px;
}
.pst-content p a:hover,.left-blog ul li a:hover {
    color: #90bc44;
}
.blog-page-area .blog-content {
    background: #f9f9f9;
}
.pst-content p a {
    color: #3d5368;
    font-size: 15px;
}
.blog-tags {
    padding: 1px 0;
}
.recent-single-post img {
	width: 100%;
    max-width: 80px;
	height: 80px;
    object-fit: cover;
    border-radius: 2px;
}
.left-blog li:last-child {
    border-bottom: 0 ;
}
.popular-tag.left-side-tags.left-blog ul {
    padding:0px;
}
.left-tags .left-side-tags ul li {
    border-bottom: 0;
    display: inline-block;
    margin: 5px 3px;
}
.left-tags .left-side-tags ul li a {
    padding: 5px 10px;
    width: auto;
    background: #f4f5f4;
    color: #3d5368;
    border-radius: 3px;
    font-weight: 400;
    font-size: 14px;
}
.left-tags .left-side-tags ul li a:hover {
	color:#fff;
	background:#90bc44;
}
.left-side-tags h4 {
    margin-bottom: 15px;
}
.blog-side-area .blog-right-column{
	margin-top: -30px;
}
.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 10px 0 0px;
    border-radius: 4px;
}
.pagination>li>a, 
.pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    color: #3d5368;
    background-color: #f4f5f5;
    border: none;
    margin-left: -1px;
    border-radius: 2px;
}
.pagination>li {
    display: inline-block;
    margin: 0px 3px 0px 0px;
}
.pagination>.active>a, 
.pagination>.active>span, 
.pagination>.active>a:hover, 
.pagination>.active>span:hover, 
.pagination>.active>a:focus, 
.pagination>.active>span:focus{
    z-index: 3;
    color: #fff;
    background-color: #90bc44;
    cursor: default;
    border-radius: 2px;
}
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus {
    z-index: 2;
    color: #fff;
    background-color: #90bc44;
    border-color: #90bc44;
    border-radius: 2px;
}
.adver-img {
    margin-top: 20px;
}
/*----------------------------------------*/
/*  18. Blog Details
/*----------------------------------------*/
.comments-heading h3, h3.comment-reply-title {
    border-bottom: 1px solid #ddd;
    color: #3d5368;
    font-size: 18px;
    margin: 0 0 40px;
    padding: 0 0 5px;
    text-transform: capitalize;
}
.comments-list ul li{
    margin-bottom: 25px;
}
.comments-list-img{
    float: left;
    margin-right: 15px;
	border-radius: 50%;
	
}
.comments-list-img img {
    border-radius: 3px;
    border: 1px solid #ddd;
}
.comments-content-wrap {
    color: #3d5368;
    font-size: 14px;
    margin: 0 0 15px 90px;
    padding: 10px;
    position: relative;
}
blockquote {
    padding: 20px 40px 40px 80px;
    margin: 0 0 20px;
    font-size: 15px;
    border-left: none;
    font-style: italic;
    position: relative;
    background: #f5f5f5;
}
blockquote::before {
    position: absolute;
    top: 20px;
    left: 30px;
    content: "\f10d ";
    font-family: fontawesome;
    font-size: 34px;
    color: #3d5368;
}
blockquote p {
    font-size: 16px !important;
    line-height: 28px;
}
.author-avatar {
    display: inline-block;
    float: left;
    width: 10%;
}
.comments-content-wrap span b{margin-right:5px}
.comments-content-wrap span a:hover{}
span.post-time{margin-right:5px}
.comments-content-wrap p {
    color: #3d5368;
    margin-top: 10px;
}
.threaded-comments{
	margin-left:50px
}
.comment-respond {
    margin-top: 20px;
}
span.email-notes{
	color: #3d5368;
    display: block;
    font-size: 12px;
    margin-bottom: 10px;
}
.comment-respond p {
    color: #3d5368;
    margin-bottom: 5px;
}
.comment-respond input[type=text],
.comment-respond input[type=email]{
    border: 1px solid #ccc;
    border-radius: 0;
    height: 46px;
    margin-bottom: 15px;
    padding: 0 0 0 10px;
    width: 100%;
	background: transparent;
}
.comment-respond textarea#message-box{
    border: 1px solid #ccc;
    border-radius: 0;
    max-width: 100%;
    padding: 10px;
	height: 200px;
    width: 100%;
	background: transparent;
}
.comments-content-wrap span a {
    color: #90bc44;
}
.comments-content-wrap span a:hover {
    color: #90bc44;
}
.comment-respond .add-btn.contact-btn {
    background: #90bc44;
    color: #fff;
    display: block;
    font-size: 16px;
    margin-top: 5px;
    padding: 10px 20px;
    transition: 0.4s;
    border-radius: 2px;
    width: auto !important;
    margin-top: 20px;
    border: 1px solid #90bc44;
    text-transform: capitalize;
    font-weight: 600;
}
.comment-respond .add-btn.contact-btn:hover{
    background: #fff;
	color: #90bc44;
    border:1px solid #90bc44;
}
.blog-page-details .left-blog-page {
    margin-top:0px;
    margin-bottom:30px;
}
.single-post-comments,
.related-post{
    margin-top: 30px;
}
.left-head-blog .pst-content p{
	margin-bottom: 5px;
}
.blog-details .blog-content h4 {
    font-size: 22px;
    line-height: 34px;
    margin-top: 10px;
}
.blog-details .blog-content h5 {
    font-size: 20px;
}
.blog-details .blog-content {
    border: 1px solid #f5f5f5;
    padding: 30px 30px 15px;
}
.blog-details .blog-images img {
    width: 100%;
    height: 100%;
    max-height: 450px;
    object-fit: cover;
}
.blog-details .img-blog {
    margin: 30px 0px;
    width: 100%;
    height: 100%;
    max-height: 350px;
    overflow: hidden;
}
.related-post-list .recent-single-post {
    width: 50%;
    float: left;
    padding: 0px 20px 0px 0px;
}
.related-post-list .recent-single-post:last-child{
    padding: 0px 0px 0px 20px;
}
/*----------------------------------------*/
/* 19.Contact CSS
/*----------------------------------------*/
.contact-area {
    height: auto;
    width: 100%;
}
.contact-content {
    padding: 100px;
    background: #000 none repeat scroll 0 0;
}
.contact-content-right {
    padding:100px;
}
.contact-form input[type="text"], .contact-form input[type="email"] {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #ccc;
    border-radius: 0;
    color: #3d5368;
    height: 46px;
    margin-bottom: 25px;
    padding-left: 20px;
    width: 100%;
}
.contact-form textarea#message {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #ccc;
    border-radius: 0;
    color: #3d5368;
    height: 110px;
    padding: 20px;
    width: 100%;
}
.contact-form button[type="submit"] {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #90bc44;
    color: #fff;
    display: block;
    font-size: 18px;
    margin-top: 16px;
    padding: 13px 24px;
    border-radius: 2px;
    transition: all 0.3s ease 0s;
    background: #90bc44;
}
.contact-form button[type=submit]:hover{
    color:#90bc44;
    border: 1px solid #90bc44;
    background: #fff;
    transition: all 0.3s ease 0s;
}
.single-icon i {
    font-size: 64px;
    line-height: 77px;
    margin-bottom: 20px;
    color:#90bc44;
}
.single-icon p {
    font-size: 16px;
    line-height: 30px;
    margin-bottom: 0px;
}
.contact-icon {
    margin-bottom: 50px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    padding: 30px 30px 30px;
    position: relative;
    z-index: 1;
}
/*----------------------------------------*/
/* 20. Services Details area
/*----------------------------------------*/
.single-page-head {
    margin-bottom: 30px;
}
.page-head-left {
    margin-right: 40px;
}
.single-services-page p{
    color: #757b82;
}
.left-menu li:first-child {
    margin: 0px 0px 2px
}
.left-contact h4 {
    font-size: 24px;
    text-transform: uppercase;
    margin-bottom: 30px;
}
.left-menu{
    border: 1px solid #ddd;
    padding: 20px 20px;
}
.left-menu li {
    display: block;
}
.build-img .page-img {
    padding-bottom: 0;
}
.left-menu ul li.active a {
    color: #90bc44;
    position: relative;
}
.left-menu ul li a:hover {
    color: #90bc44;
}
.left-menu ul li a {
    color: #2a354e;
    display: block;
    font-size: 16px;
    font-weight: 600;
    padding: 10px 0px;
    position: relative;
    position: relative;
    text-decoration: none;
    text-transform: capitalize;
}
.left-menu ul li.active a::after, 
.left-menu ul li a:hover::after {
    content: "\e649";
    font-family: themify;
    font-size: 12px;
    position: absolute;
    right: 0px;
    top: 11px;
}
.download-btn h4 {
    text-transform: uppercase;
    font-weight: 700;
    font-family: 'Open Sans', sans-serif;
}
.download-btn h4{
	text-transform: uppercase;
}
.down-btn i {
    font-size: 24px;
    float: left;
    margin-right: 15px;
}
.single-well h3 {
    font-size: 34px;
}
.down-btn {
    border: 1px solid #ddd;
    color: #2a354e;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
    padding: 15px;
    text-align: left;
    text-transform: capitalize;
    transition: all 0.4s ease 0s;
    z-index: 222;
    background: #fff;
    width: 100%;
    position: relative;
    border-radius: 3px;
}
.down-btn.apli{
	margin-bottom: 0px;
}
.down-btn:hover{
    color:#90bc44;
    background: #fff;
    border: 1px solid #90bc44;
}
.single-page-head .clients-testi {
    padding: 30px;
    border: 1px solid #90bc44;
    background: #90bc44;
    border-radius: 3px;
}
.single-page-head .review-text {
    margin-top: 20px;
}
.clients-testi .review-text a,
.clients-testi .guest-rev {
    color: #fff;
}
.clients-testi .single-review {
    border: none;
}
.review-text h4 {
    text-transform: uppercase;
    font-size: 16px;
    margin-bottom: 0px;
    color: #fff;
}
.single-page-head .review-text p {
    color: #fff;
    font-size: 16px;
}
.single-page-head .review-img {
    margin-top: 0px;
    width: 80px;
    height: 80px;
    margin: auto;
}
.single-page-head .review-img img{
	border-radius: 50%;
}
.page-content h3 {
    font-weight: 600;
       padding: 15px 0 0;
}
.mar-well {
    margin-bottom: 40px;
}
.single-page {
    overflow: hidden;
}
.single-well h3 {
    margin-bottom: 15px;
}
.single-well.last-part p{
	margin-bottom: 0px;
}
.service-list li {
    display: block;
    position: relative;
    padding-left: 30px;
    color: #2a354e;
}
.service-list li::before{
    position: absolute;
       left: 0;
    content:"\f00c";
    font-family:fontawesome;
    top:0;
    color: #90bc44;
}
.single-page-head .service-btn{
    width: 100%;
    margin: 20px 0px  0px 0px;
}
.marker-list li {
    color: #2a354e;
    padding-left: 30px;
    margin:  10px 0px;
    position: relative;
}
.marker-list li::after {
    position: absolute;
    content: "\e64c";
    left: 0;
    top: 3px;
    font-family: themify;
    color: #90bc44;
    font-weight: 700;
}
.single-services-page .marker-list li {
    color: #2a354e;
}
.blog-details .blog-category {
    margin-bottom: 15px;
}

/*.corner {*/
/*    border-radius: 10px !important;*/
/*    padding-bottom: 5px;*/
/*}*/