/*------------------------------------------------------------------
    Version: 1.0
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
    [Table of contents]

    1. IMPORT FONTS
    2. IMPORT FILES
    3. SKELETON
    4. WP CORE
    5. HEADER
    6. SECTIONS
    7. SECTIONS
    8. PORTFOLIO
    9. TESTIMONIALS
    10. PRICING TABLES
    11. ICON BOXES
    12. MESSAGE BOXES
    13. FEATURES
    14. CONTACT
    15. FOOTER
    16. MISC
    17. BUTTONS
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
    IMPORT FONTS
-------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600,700,900');

/*------------------------------------------------------------------
    IMPORT FILES
-------------------------------------------------------------------*/

@import url(css/animate.css);
@import url(css/flaticon.css);
@import url(css/icomoon.css);
@import url(css/prettyPhoto.css);
@import url(css/owl.carousel.css);
@import url(css/font-awesome.min.css);

/*------------------------------------------------------------------
    SKELETON
-------------------------------------------------------------------*/

body {
    color: #999;
    font-size: 15px;
    font-family: 'Raleway', sans-serif;
    line-height: 1.80857;
}

body.demos .section {
    background: url(images/bg.png) repeat top center #f2f3f5;
}

body.demos .section-title img {
    max-width: 280px;
    display: block;
    margin: 10px auto;
}

body.demos .service-widget h3 {
    border-bottom: 1px solid #ededed;
    font-size: 18px;
    padding: 20px 0;
    background-color: #ffffff;
}

body.demos .service-widget {
    margin: 0 0 30px;
    padding: 30px;
    background-color: #fff
}

body.demos .container-fluid {
    max-width: 1080px
}

a {
    color: #1f1f1f;
    text-decoration: none !important;
    outline: none !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    letter-spacing: 0;
    font-weight: normal;
    position: relative;
    padding: 0 0 10px 0;
    font-weight: normal;
    line-height: 120% !important;
    color: #1f1f1f;
    margin: 0
}

h1 {
    font-size: 24px
}

h2 {
    font-size: 22px
}

h3 {
    font-size: 18px;
	font-weight: bold;
	font-style: italic;
}

h4 {
    font-size: 16px
}

h5 {
    font-size: 14px
}

h6 {
    font-size: 13px
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    color: #212121;
    text-decoration: none!important;
    opacity: 1
}

h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {
    opacity: .8
}

a {
    color: #1f1f1f;
    text-decoration: none;
    outline: none;
}

a,
.btn {
    text-decoration: none !important;
    outline: none !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.btn-custom {
    margin-top: 20px;
    background-color: transparent !important;
    border: 2px solid #ddd;
    padding: 12px 40px;
    font-size: 16px;
}

.lead {
    font-size: 18px;
    line-height: 30px;
    color: #767676;
    margin: 0;
    padding: 0;
}

blockquote {
    margin: 20px 0 20px;
    padding: 30px;
}

ul, li, ol{
	margin: 0px;
	padding: 0px;
	list-style: square;
	font-size:14px;
}

i{
	width: 25px;
	height:25px;
	color:white;
}
a{
	color:#999999;
}

/*------------------------------------------------------------------
    WP CORE
-------------------------------------------------------------------*/

.first {
    clear: both
}

.last {
    margin-right: 0
}

.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float: right;
    margin: 10px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 10px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 10px 0 20px 20px;
}

a img.alignnone {
    margin: 10px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 10px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%;
    /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}


/* Text meant only for screen readers. */

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar. */
}

/*------------------------------------------------------------------
    Top head
-------------------------------------------------------------------*/

.top-bar{
	background: #5C5C5C;
}
.left-top{
	padding: 3px 0px; 
}
.email-box{
	display: inline-block;
	margin-right: 20px;
}
.email-box p{
	color: #ffffff;
	font-size: 16px;
    margin-top: 10px;
}

.email-box a button{
	color: #000000;
	font-size: 16px;
    background-color: #e87000;
    border: none;
    margin-left: 350px;
    font-weight: 500;
    margin-top: 3px;
    border-radius: 5px;
    padding: 7px 7px;
}

.email-box a:hover{
	color: #43C6AC;
}
.email-box a i{
	padding: 0px 5px;
}
.phone-box{
	display: inline-block;
}

.phone-box a{
	color: #ffffff;
	font-size: 16px;
}
.phone-box a:hover{
	color: #fd6802;
}
.phone-box a i{
	padding: 0px 5px;
}

.social-box{
	float: left;
}

.social-box ul li{
	display: inline-block;
	padding-left: 10px;
}

.social-box ul li a{
	color: #ffffff;
	font-size: 20px;
}
.social-box ul li a:hover{
	color: #fd6802;
}


/*------------------------------------------------------------------
    HEADER
-------------------------------------------------------------------*/

.megamenu .nav,
.megamenu .collapse,
.megamenu .dropup,
.megamenu .dropdown {
    position: static;
}

.megamenu .container-fluid {
    position: relative;
}

.megamenu .dropdown-menu {
    left: auto;
}

.megamenu .megamenu-content {
    padding: 20px 30px;
}

.megamenu .dropdown.megamenu-fw .dropdown-menu {
    left: 0;
    right: 0;
}

.megamenu .list-unstyled {
    min-width: 200px;
}

.header_style_01 {
    background-color: rgba(255, 255, 255);
    display: block;
    left: 0;
    padding: 10px 40px !important;
    position: relative;
    right: 0;
    top: 0;
    width: 100%;
	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30);
    z-index: 111;
}

.header_style_01 .navbar-default {
    background-color: transparent;
    border: 0;
	border-radius: 0px;
}

.header_style_01 .navbar,
.header_style_01 .navbar-nav,
.header_style_01 .navbar-default,
.header_style_01 .nav {
    margin-bottom: 0 !important;
}

.header_style_01 .navbar-brand {
    padding: 2px 15px 0 15px;
	height: auto;
}

.header_style_01 .navbar-default .navbar-nav > li > a {
    border-radius: 0;
    color: #ffffff;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    text-transform: capitalize;
    background-color: transparent;
    margin-top: 15px;

}

.header_style_01 .navbar-default .navbar-nav > li a {
	color: #000;
	padding: 10px 10px;
}

.header_style_01 .navbar-default .navbar-nav > li a.active{
	color: #7a7a7a;

}

.header_style_01 .navbar-default .navbar-nav > li:hover a,
.header_style_01 .navbar-default .navbar-nav > li:focus a {
    color: #7a7a7a;

}

.header_style_01 .navbar-right > li {
    margin-top: 2px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.header_style_01 .navbar-right > li > a {
    padding-bottom: 10px;
    padding-top: 10px;
}

li.social-links {
    margin: 0 8px;
}

li.social-links a {
    padding: 13px 0 !important;
}

.navbar-nav li {
    position: relative;
	margin: 0px 10px;
}

.navbar-nav span {
    font-size: 24px;
    position: absolute;
    right: 2px;
    top: 13px;
}


/*------------------------------------------------------------------
    Banner Slider
-------------------------------------------------------------------*/

.slider-bg-one {
    background-image: url("images/product/banner/HM-and-MEE-Web-banner---MODIK-Website--1349x505px.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 505px;
}


.slider-bg-two {
    background-image: url("images/product/banner/MODIK-Web-Banner-1349-x-505px.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 505px;

}

.slider-bg-three {
    background-image: url("images/product/banner/modularpanel.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 505px;

}

.slider-bg-four {
    background-image: url("images/product/banner/outdoorenclosures.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
        height: 505px;

}

.slider-bg-five {
    background-image: url("images/product/banner/batterycabinet.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
        height: 505px;

}

.slider-bg-six {
    background-image: url("images/product/banner/aluminiumenclosures.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
        height: 505px;

}

.slider-content-area {
    height: 100vh;
    position: relative;
}

.home-one-slider-otem .slider-content-area {
    position: relative;
}

.slide-text {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
    margin-left: 600px;
    width: 550px;
    text-align: left;

}

.slide-text h1 {
    color: #fff;
    font-size: 50px;
    font-weight: 700;
    text-transform: capitalize;
	text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);
}

.slide-text h1 span{
	color: #0a483b;

}

.slide-text li{
    font-family: 'Ubuntu';
    color: #ffffff;
    font-size: 156.25%;
    text-shadow: none;
    line-height: 1.5;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    text-align: left;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    font-weight: 500;
}

.slide-text h2 {
    color: #000;
    font-size: 19px;
    letter-spacing: 1px;
    margin-bottom: 20px;
	text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);
}


.slider-wrapper .owl-nav .owl-prev, .slider-wrapper .owl-nav .owl-next {
    background: #e87000;
    height: 60px;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.4s ease-in-out 0s;
    width: 60px;
	border-radius: 25px 0px 25px 0px;
}

.slider-wrapper .owl-nav .owl-prev:hover, .slider-wrapper .owl-nav .owl-next:hover {

}

.slider-wrapper .owl-nav .owl-prev {
    margin-left: 0%;
	left: 0px;
	position: absolute;
}

.slider-wrapper .owl-nav .owl-prev i{
	position: absolute;
	left: 0px;
	right: 0;
	width: auto;
	height: auto;
	background: none;
	color: #ffffff;
}

.slider-wrapper .owl-nav .owl-next {
    margin-right: 0%;
    right: 0;
	position: absolute;
}

.slider-wrapper .owl-nav .owl-next i{
	position: absolute;
	right: 0;
	left: 0px;
	width: auto;
	height: auto;
	background: none;
	color: #ffffff;
}

.home-one-slider-otem::before{
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0%;
	left: 100%;
	z-index: 1
}


/*------------------------------------------------------------------
    SECTIONS
-------------------------------------------------------------------*/

.parallax {
    background-attachment: fixed;
    background-size: cover;
    height: 100%;
    padding: 120px 0;
    position: relative;
    width: 100%;
}

.parallax.parallax-off {
    background-attachment: scroll !important;
    display: block;
    height: 100%;
    min-height: 100%;
    overflow: hidden;
    position: relative;
    background-position: center center;
    vertical-align: sub;
    width: 100%;
    z-index: 2;
}

.no-scroll-xy {
    overflow: hidden !important;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.section {
    display: block;
    position: relative;
    overflow: hidden;
    padding: 120px 0;
}

.noover {
    overflow: visible;
}

.noover .btn-dark {
    border: 0 !important;
}

.nopad {
    padding: 0;
}

.nopadtop {
    padding-top: 0;
}

.section.wb {
    background-color: #ffffff;
    margin-bottom: -50px;
}

.section.lb {
    background-color: #f2f3f5;
}

.section.db {
    background-color: #1f1f1f;
}

.section.color1 {
    background-color: #448AFF;
}

.first-section {
    display: block;
    position: relative;
    overflow: hidden;
    padding: 16em 0 13em;
}

.first-section h2 {
    color: #ffffff;
    font-size: 68px;
    font-weight: 300;
    text-transform: capitalize;
    display: block;
    margin: 0;
    padding: 0 0 30px;
    position: relative;
}

.first-section .lead {
    font-size: 21px;
    font-weight: 300;
    padding: 0 0 40px;
    margin: 0;
    line-height: inherit;
    color: #ffffff;
}

.macbookright {
    width: 980px;
    position: absolute;
    right: -15%;
    bottom: -6%;
}

.section-title {
    display: block;
    position: relative;
    margin-bottom: 60px;
}

.section-title p {
    color: #999;
    font-weight: 400;
    font-size: 18px;
    line-height: 33px;
    margin: 0;
}

.section-title h1 {
    font-size: 44px;
    font-weight: 500;
    line-height: 62px;
    margin: 0 0 25px;
    padding: 0;
    text-transform: none;
	margin-top:-50px;
}

.section-title ul li{
	margin: 0px;
    padding: 0px;
    list-style: square;
    font-size: 18px;
	text-align: left;
}

.service-dit h4{
	font-size:22px;
	font-weight:600;
    text-align: center;
}

.section.colorsection p,
.section.colorsection h3,
.section.db h3 {
    color: #ffffff;
}

.service-widget{
	background: #ffffff;
}

.section.lb .service-dit h3{
	padding: 12px 0px;
}
.service-dit{
	padding: 20px 15px;
	height: 175px;
    text-align: center;
}

.service-dit button{
    background-color: #e87000;
    color: #fff;
    padding: 5px 20px 5px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 10px;
}


.service-dit button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

.service-dit span{
    color: #e87000;
}

/*------------------------------------------------------------------
    PORTFOLIO
-------------------------------------------------------------------*/

.item-h2,
.item-h1 {
    height: 100% !important;
    height: auto !important;
}

.isotope-item {
    z-index: 2;
    padding: 0;
}

.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}

.isotope,
.isotope .isotope-item {
    /* change duration value to whatever you like */
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    transition-property: height, width;
}

.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    transition-property: transform, opacity;
}

.portfolio-filter ul {
    padding: 0;
    z-index: 2;
    display: block;
    position: relative;
    margin: 0;
}

.portfolio-filter ul li {
    border-radius: 0;
    display: inline-block;
    margin: 0 5px 0 0;
    text-decoration: none;
    text-transform: uppercase;
    vertical-align: middle;
}

.portfolio-filter ul li:last-child:after {
    content: "";
}

.portfolio-filter ul li .btn-dark {
    box-shadow: none;
    background-color: transparent;
    border: 2px solid #43C6AC !important;
    color: #393939;
    font-weight: 500;
    font-size: 14px;
    padding: 15px 35px;
}

.da-thumbs {
    list-style: none;
    position: relative;
    padding: 0;
}

.da-thumbs .pitem {
    margin: 0;
    padding: 15px;
    position: relative;
}

.da-thumbs .pitem a,
.da-thumbs .pitem a img {
    display: block;
    position: relative;
}

.da-thumbs .pitem a {
    overflow: hidden;
}

.da-thumbs .pitem a div {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
}

.da-thumbs .pitem a div h3 {
    display: block;
    color: #ffffff;
    font-size: 20px;
    padding: 30px 15px;
    text-transform: capitalize;
    font-weight: normal;
}

.da-thumbs .pitem a div h3 small {
    display: block;
    color: #ffffff;
    margin-top: 5px;
    font-size: 13px;
    font-weight: 300;
}

.da-thumbs .pitem a div i {
    background-color: #fd6802;
    position: absolute;
    color: #ffffff !important;
    bottom: 0;
    font-size: 15px;
    z-index: 12;
    right: 0;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
	border-radius: 25px 0px 0px 0px;
}


/*------------------------------------------------------------------
    TESTIMONIALS
-------------------------------------------------------------------*/

.logos img {
    margin: auto;
    display: block;
    text-align: center;
    width: 100%;
    opacity: 0.3;
}

.logos img:hover {
    opacity: 0.5;
}

.desc h3 i {
    color: #43C6AC;
    font-size: 37px;
    vertical-align: middle;
    margin-right: 12px;
}

.desc {
    padding: 30px;
    position: relative;
    background: #393939;
    border: 1px solid #393939;
	-webkit-border-radius: 25px 0px 25px 0px;
	-moz-border-radius: 25px 0px 25px 0px;
	border-radius: 25px 0px 25px 0px;
}

.testi-meta {
    display: block;
    margin-top: 20px;
}

.testimonial h4 {
    font-size: 18px;
    color: #ffffff;
    padding: 13px 0 0;
}

.testimonial img {
    max-width: 55px;
}

.testimonial small {
    margin-top: 7px;
    font-size: 16px;
    display: block;
}

.testimonial {
    background-color: transparent;
}

.testimonial h3 {
    padding: 0 0 10px;
    font-size: 20px;
    font-weight: 600;
}

.testimonial small,
.testimonial .lead {
    background-color: transparent;
    color: #aaa;
    display: block;
    font-size: 16px;
    font-style: italic;
    line-height: 30px;
    margin: 0;
    padding: 0;
    position: relative;
}

.testimonial p:after {
    display: none;
}


/*------------------------------------------------------------------
    PRICING TABLES
-------------------------------------------------------------------*/

.pricing-table {
    margin: 50px 0 0 0;
    background: #fff;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
}

.pricing-table i {
    width: 30px;
    color: #c2c2c2;
    display: inline-block;
    margin-right: 10px;
    padding-right: 5px;
    border-right: 1px solid #ececec;
}

.pricing-table .btn-dark {
    padding: 10px 24px;
    font-size: 15px;
}

.pricing-table strong {
    font-weight: 600;
    margin-right: 6px;
    color: #1f1f1f;
}

.pricing-table-header {
    padding: 30px 0 25px 0;
    background: #ffffff;
}

.pricing-table-header h2 {
    font-size: 31px;
    margin: 0;
    padding: 0;
    font-weight: 300;
}

.pricing-table-header h3 {
    font-size: 15px;
    font-weight: 600;
    color: #aaaaaa;
    margin-top: 10px;
    text-transform: uppercase;
}

.pricing-table-space {
    height: 10px;
}

.pricing-table-text {
    margin: 15px 30px 0 30px;
    padding: 0 10px 15px 10px;
    border-bottom: 1px solid #ececec;
    font-weight: 300;
    line-height: 30px;
    color: #c2c2c2;
    font-size: 16px;
}

.pricing-table-text p {
    font-weight: 400;
}

.pricing-table-features {
    margin: 15px 30px 0 30px;
    padding: 0 10px 15px 30px;
    border-bottom: 1px solid #ececec;
    text-align: left;
    line-height: 30px;
    font-size: 16px;
    color: #c2c2c2;
}

.pricing-table-highlighted h3,
.pricing-table-highlighted h2 {
    color: #ffffff !important;
}

.pricing-table-sign-up {
    margin-top: 25px;
    padding-bottom: 30px;
}


/* Highlighted table */

.pricing-table-highlighted {
    margin-top: 0;
}

.m130 {
    margin-top: 130px;
}

.nav-pills {
    border: 1px solid #e1e1e1;
}

.nav-pills > li {
    width: 50%;
    padding: 10px;
    float: left;
    margin: 0 !important;
}

.nav-pills > li > a {
    margin: 0!important;
    text-align: center;
    background-color: #f4f4f4;
}


/*------------------------------------------------------------------
    ICON BOXES
-------------------------------------------------------------------*/

.icon-wrapper {
    position: relative;
    cursor: pointer;
    display: block;
    z-index: 1;
}

.icon-wrapper i {
    width: 75px;
    height: 75px;
    text-align: center;
    line-height: 75px;
    font-size: 28px;
    background-color: #f2f3f5;
    color: #1f1f1f;
    margin-top: 0;
}

.small-icons.icon-wrapper:hover i,
.small-icons.icon-wrapper:hover i:hover,
.small-icons.icon-wrapper i {
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
    padding: 0 !important;
    color: #e3e3e3 !important;
    background-color: transparent !important;
    background: none !important;
    margin-right: 10px !important;
    vertical-align: middle;
    font-size: 24px !important;
}

.small-icons.icon-wrapper h3 {
    font-size: 18px;
    padding-bottom: 5px;
}

.small-icons.icon-wrapper p {
    padding: 0;
    margin: 0;
}

.icon-wrapper h3 {
    font-size: 21px;
    padding: 0 0 15px;
    margin: 0;
}

.icon-wrapper p {
    margin-bottom: 0;
    padding-left: 95px;
}

.icon-wrapper p small {
    display: block;
    color: #999;
    margin-top: 10px;
    text-transform: none;
    font-weight: 600;
    font-size: 16px;
}

.icon-wrapper p small:after {
    content: "\f105";
    font-family: FontAwesome;
    margin-left: 5px;
    font-size: 11px;
}

.effect-1 {
    display: inline-block;
    cursor: pointer;
    text-align: center;
    position: relative;
    text-decoration: none;
    z-index: 1;
}

.effect-1:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.effect-1 {
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
}

.effect-1:after {
    top: -7px;
    left: -7px;
    padding: 7px;
    box-shadow: 0 0 0 2px #fcbf02;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -webkit-transform: scale(.8);
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    transition: transform 0.2s, opacity 0.2s;
    transform: scale(.8);
    opacity: 0;
}

.effect-1:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.effect-1:after {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.effect-1:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}


/*------------------------------------------------------------------
    MESSAGE BOXES
-------------------------------------------------------------------*/

.service-widget h3 {
    font-size: 22px;
    color: #ffffff;
    padding: 20px 0 12px;
    margin: 0;
	font-weight: 600;
}

.service-widget h3 a,
.section.wb .service-widget h3,
.section.lb .service-widget h3 {
    color: #1f1f1f;
}

.service-widget p {
    margin-bottom: 0;
    padding-bottom: 0;
}

.section.wb h4 {
    text-transform: uppercase;
    padding: 0;
    margin: 0 0 5px;
    font-weight: 600;
    letter-spacing: 0.5px;
    font-size: 40px;
    color: #000;
    text-align: left;
    margin-bottom: 50px;
    margin-top: 60PX;
}

.message-box h2 {
    font-size: 28px;
    font-weight: 500;
    padding: 0 0 10px;
    margin: 0;
    line-height: 62px;
    margin-top: 0;
    text-transform: none;
}


.message-box p {
    margin-bottom: 20px;
    margin-top: 30px;
    color: #1E1D23;
    font-size: 15px;
}

.message-box img {
    margin-bottom: 20px;
	width:50px;
	height:50px;
}
.message-box .list-inline {
list-style-type: square;
}
.message-box .lead {
    padding-top: 10px;
    font-size: 19px;
    font-style: italic;
    color: #999;
    padding-bottom: 0;
}

.post-media {
    position: relative;
}

.post-media img {
    width: 100%;
}

.playbutton {
    position: absolute;
    color: #ffffff !important;
    top: 40%;
    font-size: 60px;
    z-index: 12;
    left: 0;
    right: 0;
    text-align: center;
    margin: -20px auto;
}

.hoverbutton {
    background-color: #43C6AC;
    position: absolute;
    color: #ffffff !important;
    top: 48%;
    font-size: 21px;
    z-index: 12;
    left: 0;
    opacity: 0;
    right: 0;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    margin: -20px auto;
}

.service-widget:hover .hoverbutton {
    opacity: 1;
}

hr.hr1 {
    position: relative;
    margin: 60px 0;
    border: 1px dashed #f2f3f5;
}

hr.hr2 {
    position: relative;
    margin: 17px 0;
    border: 1px dashed #f2f3f5;
}

hr.hr3 {
    position: relative;
    margin: 25px 0 30px 0;
    border: 1px dashed #f2f3f5;
}

hr.invis {
    border-color: transparent;
}

hr.invis1 {
    margin: 10px 0;
    border-color: transparent;
}

.section.parallax hr.hr1 {
    border-color: rgba(255, 255, 255, 0.1);
}

.sep1 {
    display: block;
    position: absolute;
    content: '';
    width: 40px;
    height: 40px;
    bottom: -20px;
    left: 50%;
    margin-left: -14px;
    background-color: #1f1f1f;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1;
}

.sep2 {
    display: block;
    position: absolute;
    content: '';
    width: 40px;
    height: 40px;
    top: -20px;
    left: 50%;
    margin-left: -14px;
    background-color: #1f1f1f;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1;
}


/* Divider Styles */

.divider-wrapper {
    width: 100%;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
    height: 540px;
    margin: 0 auto;
    position: relative;
}

.divider-wrapper:hover {
    cursor: none;
}

.divider-bar {
    position: absolute;
    width: 10px;
    left: 50%;
    top: -10px;
    bottom: -15px;
}

.code-wrapper {
    border: 1px solid #ffffff;
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: relative;
    background: url("uploads/code.jpg") no-repeat;
}

.design-wrapper {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
}

.design-image {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background: url("uploads/design.jpg") no-repeat;
}


/*------------------------------------------------------------------
    FEATURES
-------------------------------------------------------------------*/

/* General styles */
#features {
    text-align: center;
}

.customwidget h1 {
    font-size: 44px;
    color: #ffffff;
    padding: 15px 0 25px;
    margin: 0;
    line-height: 1 !important;
    font-weight: 500;
}

.customwidget ul {
    padding: 0;
    display: block;
    margin-bottom: 30px;
}



.customwidget li i {
    margin-right: 5px;
}

.customwidget li {
    color: #ffffff;
    margin-right: 10px;
}

.img-center img {
    width: 100%; /* Make the image fill its container */
    max-width: 100%; /* Ensure the image doesn't exceed its natural size */
    height: auto; /* Maintain the image's aspect ratio */
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
}

.customwidget p {
    font-style: italic;
    font-size: 18px;
    padding: 0 0 10px;
}

.img-center img {
    width: 100%;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
}

.img-center {
    margin: auto;
}
@media (min-width: 768px) {
    .customwidget {
        text-align: center;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .customwidget .text-section {
        flex: 1; /* Make the text section take up remaining space */
        padding-right: 30px;
        text-align: left; /* Align text to the left */
    }

    .customwidget .img-section {
        flex: 1; /* Make the image section take up remaining space */
    }

}

/* Responsive styles for smaller screens */
@media (max-width: 767px) {
    .customwidget h1 {
        font-size: 30px; /* Adjust font size for smaller screens */
    }

    .img-center img {
        margin: 0; /* Remove the negative margin */
    }
}

#features li p {
    margin-bottom: 0;
    padding-bottom: 0;
	font-size:12px;
    color: #000;
}

#features li {
    display: table;
    width: 100%;
    margin: 30px 0;
    cursor: pointer;
	-webkit-box-shadow: 0px 5px 35px 0px rgba(148, 146, 245, 0.15);
	box-shadow: 0px 5px 35px 0px rgba(148, 146, 245, 0.15);
	border-radius: 10px 0px 10px 0px;
	transition: all 1s ease-in-out;
    background-color: #D3D3D3;
}

#features li:hover {
	transform: scale(1.07);
	transition: all 1s ease-in-out;
	z-index: 1000;
}

.features-left,
.features-right {
	padding: 0 1px;
  
}

.features-right li:last-child,
.features-left li:last-child {
    margin-bottom: 0px;
    padding-bottom: 0 !important;
}

.features-right li i,
.features-left li i {
    width: 60px;
    height: 60px;
    line-height: 68px;
    display: table;
    border-radius: 25px 0px 25px 0px;
    font-size: 26px;
	color: #ffffff;
    background-color: #43C6AC;
    margin: 0 auto 22px;
    position: relative;
    text-align: center;
    z-index: 55;
    transition: .4s;
    padding: 0;
}

.features-right li i:hover,
.features-left li i:hover {
	background: #393939;
}

#features i img {
    display: table;
    margin: 10px auto;
	width: 45px;
	height:45px;
}

.features-left li i:before,
.features-right li i:before {
    text-align: center;
}

.features-right li i .ico-current,
.features-left li i .ico-current {
    opacity: 1;
    transition: .4s;
    visibility: visible;
}

.features-right li i .ico-hover,
.features-left li i .ico-hover {
    opacity: 0;
    transition: .4s;
    visibility: hidden;
    top: 19px;
}

.features-right li:hover .ico-current,
.features-left li:hover .ico-current {
    opacity: 0;
    transition: .4s;
    visibility: hidden;
}

.features-right li:hover .ico-hover,
.features-left li:hover .ico-hover {
    opacity: 1;
    transition: .4s;
    visibility: visible;
}

.features-right i {
    float: left;
}

.fr-inner {
    margin-left: 90px;
    margin-top: 5px;

}

.features-left i {
    float: right;
}

.fl-inner {
    text-align: left;
    margin-left: 20px;
	margin-top: 5px;
}

#features h4 {
    text-transform: inherit;
    margin: 0;
    font-size: 14px;
	color: #000;
}

#features h1{
    color: #e87000;
    text-align: center;
}


/*------------------------------------------------------------------
    CONTACT
-------------------------------------------------------------------*/

.bootstrap-select {
    width: 100% \0;
    /*IE9 and below*/
}

.bootstrap-select > .dropdown-toggle {
    width: 100%;
    padding-right: 25px;
}

.has-error .bootstrap-select .dropdown-toggle,
.error .bootstrap-select .dropdown-toggle {
    border-color: #b94a48;
}

.bootstrap-select.fit-width {
    width: auto !important;
}

.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100%;
}

.bootstrap-select .dropdown-toggle:focus {
    outline: thin dotted #333333 !important;
    outline: 5px auto -webkit-focus-ring-color !important;
    outline-offset: -2px;
}

.bootstrap-select.form-control {
    margin-bottom: 0;
    padding: 0;
    border: none;
}

.bootstrap-select.form-control:not([class*="col-"]) {
    width: 100%;
}

.bootstrap-select.form-control.input-group-btn {
    z-index: auto;
}

.bootstrap-select.btn-group:not(.input-group-btn),
.bootstrap-select.btn-group[class*="col-"] {
    float: none;
    display: inline-block;
    margin-left: 0;
}

.bootstrap-select.btn-group.dropdown-menu-right,
.bootstrap-select.btn-group[class*="col-"].dropdown-menu-right,
.row .bootstrap-select.btn-group[class*="col-"].dropdown-menu-right {
    float: right;
}

.form-inline .bootstrap-select.btn-group,
.form-horizontal .bootstrap-select.btn-group,
.form-group .bootstrap-select.btn-group {
    margin-bottom: 0;
}

.form-group-lg .bootstrap-select.btn-group.form-control,
.form-group-sm .bootstrap-select.btn-group.form-control {
    padding: 0;
}

.form-inline .bootstrap-select.btn-group .form-control {
    width: 100%;
}

.bootstrap-select.btn-group.disabled,
.bootstrap-select.btn-group > .disabled {
    cursor: not-allowed;
}

.bootstrap-select.btn-group.disabled:focus,
.bootstrap-select.btn-group > .disabled:focus {
    outline: none !important;
}

.bootstrap-select.btn-group .dropdown-toggle .filter-option {
    display: inline-block;
    overflow: hidden;
    width: 100%;
    text-align: left;
}

.bootstrap-select.btn-group .dropdown-toggle .fa-angle-down {
    position: absolute;
    top: 30% !important;
    right: -5px;
    vertical-align: middle;
}

.bootstrap-select.btn-group[class*="col-"] .dropdown-toggle {
    width: 100%;
}

.bootstrap-select.btn-group .dropdown-menu {
    border: 1px solid #ededed;
    box-shadow: none;
    box-sizing: border-box;
    min-width: 100%;
    padding: 20px 10px;
    z-index: 1035;
}

.dropdown-menu > li > a {
    background-color: transparent !important;
    color: #bcbcbc !important;
    font-size: 15px;
    padding: 10px 20px;
}

.bootstrap-select.btn-group .dropdown-menu.inner {
    position: static;
    float: none;
    border: 0;
    padding: 0;
    margin: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.bootstrap-select.btn-group .dropdown-menu li {
    position: relative;
}

.bootstrap-select.btn-group .dropdown-menu li.active small {
    color: #fff;
}

.bootstrap-select.btn-group .dropdown-menu li.disabled a {
    cursor: not-allowed;
}

.bootstrap-select.btn-group .dropdown-menu li a {
    cursor: pointer;
}

.bootstrap-select.btn-group .dropdown-menu li a.opt {
    position: relative;
    padding-left: 2.25em;
}

.bootstrap-select.btn-group .dropdown-menu li a span.check-mark {
    display: none;
}

.bootstrap-select.btn-group .dropdown-menu li a span.text {
    display: inline-block;
}

.bootstrap-select.btn-group .dropdown-menu li small {
    padding-left: 0.5em;
}

.bootstrap-select.btn-group .dropdown-menu .notify {
    position: absolute;
    bottom: 5px;
    width: 96%;
    margin: 0 2%;
    min-height: 26px;
    padding: 3px 5px;
    background: #f5f5f5;
    border: 1px solid #e3e3e3;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    pointer-events: none;
    opacity: 0.9;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bootstrap-select.btn-group .no-results {
    padding: 3px;
    background: #f5f5f5;
    margin: 0 5px;
    white-space: nowrap;
}

.bootstrap-select.btn-group.fit-width .dropdown-toggle .filter-option {
    position: static;
}

.bootstrap-select.btn-group.fit-width .dropdown-toggle .caret {
    position: static;
    top: auto;
    margin-top: 4px;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
    position: absolute;
    display: inline-block;
    right: 15px;
    margin-top: 5px;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
    margin-right: 34px;
}

.bootstrap-select.show-menu-arrow.open > .dropdown-toggle {
    z-index: 1036;
}

.bootstrap-select.show-menu-arrow .dropdown-toggle:before {
    content: '';
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid rgba(204, 204, 204, 0.2);
    position: absolute;
    bottom: -4px;
    left: 9px;
    display: none;
}

.bootstrap-select.show-menu-arrow .dropdown-toggle:after {
    content: '';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
    position: absolute;
    bottom: -4px;
    left: 10px;
    display: none;
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:before {
    bottom: auto;
    top: -3px;
    border-top: 7px solid rgba(204, 204, 204, 0.2);
    border-bottom: 0;
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:after {
    bottom: auto;
    top: -3px;
    border-top: 6px solid white;
    border-bottom: 0;
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:before {
    right: 12px;
    left: auto;
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:after {
    right: 13px;
    left: auto;
}

.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:before,
.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:after {
    display: block;
}

.bs-searchbox,
.bs-actionsbox,
.bs-donebutton {
    padding: 4px 8px;
}

.bs-actionsbox {
    float: left;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bs-actionsbox .btn-group button {
    width: 50%;
}

.bs-donebutton {
    float: left;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bs-donebutton .btn-group button {
    width: 100%;
}

.bs-searchbox + .bs-actionsbox {
    padding: 0 8px 4px;
}

.bs-searchbox .form-control {
    margin-bottom: 0;
    width: 100%;
}

select.bs-select-hidden,
select.selectpicker {
    display: none !important;
}

select.mobile-device {
    position: absolute !important;
    top: 0;
    left: 0;
    display: block !important;
    width: 100%;
    height: 100% !important;
    opacity: 0;
}


/*# sourceMappingURL=bootstrap-select.css.map */

.bootstrap-select > .btn {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    font-size: 15px;
    height: 33px;
    box-shadow: none !important;
    border: 0 !important;
    padding: 0;
    width: 100%;
    color: #bcbcbc !important;
}

.contact_form {
    border: 1px solid #ededed;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
    background-color: #f2f3f5;
    padding: 40px 30px;
}

.contact_form .form-control {
    background-color: #fff;
    margin-bottom: 30px;
    border: 1px solid #ebebeb;
    box-sizing: border-box;
    color: #bcbcbc;
    font-size: 16px;
    outline: 0 none;
    padding: 10px 25px;
    height: 55px;
    resize: none;
    box-shadow: none !important;
    width: 100%;
}

.contact_form textarea {
    color: #bcbcbc;
    padding: 20px 25px !important;
    height: 160px !important;
}

.contact_form .form-control::-webkit-input-placeholder {
    color: #bcbcbc;
}

.contact_form .form-control::-moz-placeholder {
    opacity: 1;
    color: #bcbcbc;
}

.contact_form .form-control::-ms-input-placeholder {
    color: #bcbcbc;
}

#contact {
    background: url(images/bg.png) no-repeat center center #fff;
}


/*------------------------------------------------------------------
    FOOTER
-------------------------------------------------------------------*/

.cac {
    background-color: #232323;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.cac:hover a h3 {
    color: #fff !important;
}

.cac a h3 {
    color: #999;
}

.cac h3 {
    padding: 60px 0;
    margin: 0;
    font-weight: 400;
    font-size: 20px;
    text-transform: capitalize;
    line-height: !important;
}

.footer {
    padding: 40px 0 40px !important;
    color: #999;
    background-color: #000;
}

.footer .widget-title {
    position: relative;
    display: block;
    margin-bottom: 30px;
}

.footer .widget-title small {
    color: #999;
    display: block;
    padding: 0 58px;
    text-transform: uppercase;
}

.footer .widget-title h3 {
    color: #fff;
    font-weight: 500;
    font-size: 21px;
    padding: 0;
    margin: 0;
    line-height: 1 !important;
}

.footer-links {
    list-style: none;
    padding: 0;
}

.footer-links a {
    color: #999;
	display: block;
}

.footer-links.hov a span{
	opacity: 0;
	transition: all 1s ease-in-out;
}

.footer-links.hov a:hover{
	padding-left: 15px;
}
.footer-links.hov a:hover span{
	opacity: 1;
	padding-left: 10px;
	transition: all 1s ease-in-out;
}

.footer-links a:hover,
.footer a:hover {
    color: #43C6AC !important;
}

.footer-links li {
    margin-bottom: 10px;
    display: block;
    width: 100%;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.1);
    padding-bottom: 10px;
}

.twitter-widget li {
    margin-bottom: 0;
    border: 0 !important;
}

.twitter-widget li i {
    border-right: 0 !important;
    margin-right: 0;
}

.footer-links li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border: 0;
}

.footer-links i {
    display: inline-block;
    width: 25px;
    margin-right: 10px;
    border-right: 1px dashed rgba(255, 255, 255, 0.1);
}

.copyrights {
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
    background-color: #000;
    box-sizing: border-box;
    width: 100%;
    text-align: left;
    padding: 20px 20px;
    overflow: hidden;
}


/* Footer left */

.footer-distributed .footer-left {
    float: none;
	text-align: center;
}

.footer-distributed .footer-links {
    margin: 0 0 10px;
    text-transform: uppercase;
    padding: 0;
}

.footer-distributed .footer-links a {
    display: inline-block;
    line-height: 1.8;
    margin: 0 10px 0 10px;
    text-decoration: none;
}

.footer-distributed .footer-company-name {
    font-weight: 300;
    margin: 0 10px;
    color: #666;
    padding: 0;
}

.footer-distributed .footer-company-name a{
	color: #ffffff;
}

.footer-distributed .footer-company-name a:hover{
	color: #43C6AC;
}


/* Footer right */

.footer-distributed .footer-right {
    float: none;
}


/* The search form */

.footer-distributed .widget-title p{
	padding-top: 40px;
}

.footer-distributed form {
    position: relative;
}

.footer-distributed form input {
    display: block;
    border-radius: 3px;
    box-sizing: border-box;
    background-color: #999da0;
    border: none;
    font: inherit;
    font-size: 15px;
    font-weight: normal;
    color: #fff;
    width: 100%;
    padding: 18px 50px 18px 18px;
	margin-top:10px;
}

.footer-distributed form input:focus {
    outline: none;
}


/* Changing the placeholder color */

.footer-distributed form input::-webkit-input-placeholder {
    color: #fff;
}

.footer-distributed form input::-moz-placeholder {
    opacity: 1;
    color: #999;
}

.footer-distributed form input:-ms-input-placeholder {
    color: #999;
}


/* The magnify glass icon */

.footer-distributed form i {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 16px;
    right: 18px;
    color: #999;
    font-size: 18px;
    margin-top: 6px;
}


/*------------------------------------------------------------------
    MISC
-------------------------------------------------------------------*/

.progress {
    background-color: #f2f3f5;
    border-radius: 0;
    box-shadow: none;
    height: 5px;
    margin-bottom: 20px;
    overflow: hidden;
}

.skills h3 {
    color: #999999;
    font-size: 15px;
}

.dmtop {
    background-color: #e87000;
    z-index: 100;
    width: 50px;
    height: 50px;
    line-height: 47px;
    position: fixed;
    bottom: -100px;
    border-radius: 3px;
    right: 20px;
    text-align: center;
    font-size: 28px;
    color: #ffffff !important;
    cursor: pointer;
    -webkit-transition: all .7s ease-in-out;
    -moz-transition: all .7s ease-in-out;
    -o-transition: all .7s ease-in-out;
    -ms-transition: all .7s ease-in-out;
    transition: all .7s ease-in-out;
}

.dmtop:hover {
	background-color: #43C6AC;
}

.icon_wrap {
    background-color:#43C6AC;
    width: 100px;
    height: 100px;
    display: block;
    line-height: 100px;
    font-size: 34px;
    color: #ffffff;
    margin: 0 auto;
    text-align: center;
    padding: 0 !important;
    border: 0 !important;
}

.stat-wrap h3 {
    font-size: 22px;
    font-weight: 600;
    color: #fcbf02;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important:
}

.stat-wrap p {
    font-size: 38px;
    color: #ffffff;
    margin: 0;
    font-weight: 700;
    padding: 4px 0 0;
    line-height: 1 !important:
}

#preloader {
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #43C6AC;
    z-index: 11000;
    position: fixed;
    display: block;
	display: flex;
	align-items: center;
	justify-content: center;
}

.preloader {
    position: absolute;
    margin: 0 auto;
    left: 1%;
    right: 1%;
    top: 45%;
    width: 95px;
    height: 95px;
    background: center center no-repeat none;
    background-size: 95px 95px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%
}



.loader {
  
  position: absolute;
    margin: 0 auto;
    left: 1%;
    right: 1%;
    top: 45%;
  width: 75px;
  height: 100px;
}
.loader__bar {
  position: absolute;
  bottom: 0;
  width: 10px;
  height: 50%;
  background: #fff;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
}
.loader__bar:nth-child(1) {
  left: 0px;
  -webkit-transform: scale(1, 0.2);
          transform: scale(1, 0.2);
  -webkit-animation: barUp1 4s infinite;
          animation: barUp1 4s infinite;
}
.loader__bar:nth-child(2) {
  left: 15px;
  -webkit-transform: scale(1, 0.4);
          transform: scale(1, 0.4);
  -webkit-animation: barUp2 4s infinite;
          animation: barUp2 4s infinite;
}
.loader__bar:nth-child(3) {
  left: 30px;
  -webkit-transform: scale(1, 0.6);
          transform: scale(1, 0.6);
  -webkit-animation: barUp3 4s infinite;
          animation: barUp3 4s infinite;
}
.loader__bar:nth-child(4) {
  left: 45px;
  -webkit-transform: scale(1, 0.8);
          transform: scale(1, 0.8);
  -webkit-animation: barUp4 4s infinite;
          animation: barUp4 4s infinite;
}
.loader__bar:nth-child(5) {
  left: 60px;
  -webkit-transform: scale(1, 1);
          transform: scale(1, 1);
  -webkit-animation: barUp5 4s infinite;
          animation: barUp5 4s infinite;
}
.loader__ball {
  position: absolute;
  bottom: 10px;
  left: 0;
  width: 10px;
  height: 10px;
  background: #fff;
  border-radius: 50%;
  -webkit-animation: ball 4s infinite;
          animation: ball 4s infinite;
}

@-webkit-keyframes ball {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  5% {
    -webkit-transform: translate(8px, -14px);
            transform: translate(8px, -14px);
  }
  10% {
    -webkit-transform: translate(15px, -10px);
            transform: translate(15px, -10px);
  }
  17% {
    -webkit-transform: translate(23px, -24px);
            transform: translate(23px, -24px);
  }
  20% {
    -webkit-transform: translate(30px, -20px);
            transform: translate(30px, -20px);
  }
  27% {
    -webkit-transform: translate(38px, -34px);
            transform: translate(38px, -34px);
  }
  30% {
    -webkit-transform: translate(45px, -30px);
            transform: translate(45px, -30px);
  }
  37% {
    -webkit-transform: translate(53px, -44px);
            transform: translate(53px, -44px);
  }
  40% {
    -webkit-transform: translate(60px, -40px);
            transform: translate(60px, -40px);
  }
  50% {
    -webkit-transform: translate(60px, 0);
            transform: translate(60px, 0);
  }
  57% {
    -webkit-transform: translate(53px, -14px);
            transform: translate(53px, -14px);
  }
  60% {
    -webkit-transform: translate(45px, -10px);
            transform: translate(45px, -10px);
  }
  67% {
    -webkit-transform: translate(37px, -24px);
            transform: translate(37px, -24px);
  }
  70% {
    -webkit-transform: translate(30px, -20px);
            transform: translate(30px, -20px);
  }
  77% {
    -webkit-transform: translate(22px, -34px);
            transform: translate(22px, -34px);
  }
  80% {
    -webkit-transform: translate(15px, -30px);
            transform: translate(15px, -30px);
  }
  87% {
    -webkit-transform: translate(7px, -44px);
            transform: translate(7px, -44px);
  }
  90% {
    -webkit-transform: translate(0, -40px);
            transform: translate(0, -40px);
  }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
}

@keyframes ball {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  5% {
    -webkit-transform: translate(8px, -14px);
            transform: translate(8px, -14px);
  }
  10% {
    -webkit-transform: translate(15px, -10px);
            transform: translate(15px, -10px);
  }
  17% {
    -webkit-transform: translate(23px, -24px);
            transform: translate(23px, -24px);
  }
  20% {
    -webkit-transform: translate(30px, -20px);
            transform: translate(30px, -20px);
  }
  27% {
    -webkit-transform: translate(38px, -34px);
            transform: translate(38px, -34px);
  }
  30% {
    -webkit-transform: translate(45px, -30px);
            transform: translate(45px, -30px);
  }
  37% {
    -webkit-transform: translate(53px, -44px);
            transform: translate(53px, -44px);
  }
  40% {
    -webkit-transform: translate(60px, -40px);
            transform: translate(60px, -40px);
  }
  50% {
    -webkit-transform: translate(60px, 0);
            transform: translate(60px, 0);
  }
  57% {
    -webkit-transform: translate(53px, -14px);
            transform: translate(53px, -14px);
  }
  60% {
    -webkit-transform: translate(45px, -10px);
            transform: translate(45px, -10px);
  }
  67% {
    -webkit-transform: translate(37px, -24px);
            transform: translate(37px, -24px);
  }
  70% {
    -webkit-transform: translate(30px, -20px);
            transform: translate(30px, -20px);
  }
  77% {
    -webkit-transform: translate(22px, -34px);
            transform: translate(22px, -34px);
  }
  80% {
    -webkit-transform: translate(15px, -30px);
            transform: translate(15px, -30px);
  }
  87% {
    -webkit-transform: translate(7px, -44px);
            transform: translate(7px, -44px);
  }
  90% {
    -webkit-transform: translate(0, -40px);
            transform: translate(0, -40px);
  }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
}
@-webkit-keyframes barUp1 {
  0% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  40% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  50% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  90% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  100% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
}
@keyframes barUp1 {
  0% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  40% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  50% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  90% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  100% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
}
@-webkit-keyframes barUp2 {
  0% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  40% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  50% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  90% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  100% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
}
@keyframes barUp2 {
  0% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  40% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  50% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  90% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  100% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
}
@-webkit-keyframes barUp3 {
  0% {
    -webkit-transform: scale(1, 0.6);
            transform: scale(1, 0.6);
  }
  100% {
    -webkit-transform: scale(1, 0.6);
            transform: scale(1, 0.6);
  }
}
@keyframes barUp3 {
  0% {
    -webkit-transform: scale(1, 0.6);
            transform: scale(1, 0.6);
  }
  100% {
    -webkit-transform: scale(1, 0.6);
            transform: scale(1, 0.6);
  }
}
@-webkit-keyframes barUp4 {
  0% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  40% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  50% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  90% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  100% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
}
@keyframes barUp4 {
  0% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  40% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
  50% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  90% {
    -webkit-transform: scale(1, 0.4);
            transform: scale(1, 0.4);
  }
  100% {
    -webkit-transform: scale(1, 0.8);
            transform: scale(1, 0.8);
  }
}
@-webkit-keyframes barUp5 {
  0% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  40% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  50% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  90% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  100% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}
@keyframes barUp5 {
  0% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  40% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
  50% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  90% {
    -webkit-transform: scale(1, 0.2);
            transform: scale(1, 0.2);
  }
  100% {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
  }
}



/*------------------------------------------------------------------
    BUTTONS
-------------------------------------------------------------------*/

.navbar-default .btn-light {
    padding: 0 20px;
    margin-left: 15px;
}

.nav-pills,
.effect-1:after,
.nav-pills > li > a,
.global-radius,
.btn-brd {
    -webkit-border-radius: 25px 0px 25px 0px;
    -moz-border-radius: 25px 0px 25px 0px;
    border-radius: 25px 0px 25px 0px;
}

.btn-light {
    padding: 13px 40px;
    font-size: 18px;
    border: 2px solid #43C6AC;
    color: #ffffff;
    background-color: #43C6AC;
}

.btn-dark {
    padding: 13px 40px;
    font-size: 18px;
    border: 1px solid #ececec !important;
    color: #1f1f1f;
    background-color: transparent;
}

.btn-light:hover,
.btn-light:focus {
    border-color: #43C6AC;
    color: rgba(255, 255, 255);
	background: #a7a9ac;
}


/*------------------------------------------------------------------
    inner Page CSS
-------------------------------------------------------------------*/

.fixed-menu .navbar-default{
	position: fixed;
	visibility: hidden;
	left: 0px;
	top: 0px;
	width: 100%;
	padding: 0px 0px;
	background: #ffffff;
	z-index: 0;
	transition: all 1s ease-in-out;
	z-index: 999;
	opacity: 1;
	visibility: visible;
	-ms-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-op-animation-name: fadeInDown;
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	-ms-animation-duration: 500ms;
	-moz-animation-duration: 500ms;
	-op-animation-duration: 500ms;
	-webkit-animation-duration: 500ms;
	animation-duration: 500ms;
	-ms-animation-timing-function: linear;
	-moz-animation-timing-function: linear;
	-op-animation-timing-function: linear;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-ms-animation-iteration-count: 1;
	-moz-animation-iteration-count: 1;
	-op-animation-iteration-count: 1;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}

.fixed-menu .navbar-default {
    padding: 10px 0px 10px;
    box-shadow: 0 0 8px 0 rgba(0,0,0,.12);
}


.banner-bg-1{
	background: url(uploads/inner-bg.jpg);
	padding: 120px 0;	
	background-clip: initial;
	background-color: rgba(0, 0, 0, 0);
	background-origin: initial;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: 0;
}

.banner-bg-1::before{
	content: "";
	display: inline-block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
	background: rgba(34, 34, 34, 0.4);
}

.banner{
	position: relative;
}

.banner h2{
	color: #f1f1f1;
	font-size: 45px;
	font-weight: 700;
	letter-spacing: 1px;
	margin-left: 20px;
	position: relative;
}
.banner h2::after {
    background: #43C6AC;
    content: "";
    height: 35px;
    left: -15px;
    position: absolute;
    top: 8px;
    width: 6px;
}

.page-title-link li{
	display: inline-block;
	position: relative;
}
.page-title-link li a {
    color: #fff;
    font-size: 14px;
    letter-spacing: 1px;
    margin: 0 15px;
    text-transform: uppercase;
	font-weight: 500;
}
.page-title-link li a:hover {
	color: #43C6AC;
}
.page-title-link li::after {
    background: #fcbf02;
    bottom: 8px;
    content: "";
    height: 2px;
    margin-left: -1px;
    position: absolute;
    width: 10px;
}
.page-title-link li:last-child::after {
    content: "";
    width: 0;
    height: 0;
}







.portfolio-filter ul li .btn-dark.active{
	background: #fcbf02;
	color: #ffffff;
}


#test-box .testimonial h3{
	color: #ffffff;
}

#test-box .testimonial h4{
	color: #393939;
}


:root{
    --pricingTable-yellow: #43C6AC;
    --pricingTable-purple: #43C6AC;
    --pricingTable-blue: #43C6AC;
}

.pricingTable{
    padding-bottom: 10px;
    background: #fff;
    border-bottom: 15px solid var(--pricingTable-yellow);
    text-align: center;
    overflow: hidden;
    position: relative;
	transition: all 0.3s ease-in-out;
}
.pricingTable:hover{
	cursor: pointer;
	box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.1);
	transform: scale(1.04);
}
.pricingTable:before{
    content: "";
    width: 100%;
    height: 350px;
    background: var(--pricingTable-yellow);
    position: absolute;
    top: -150px;
    left: 0;
    transform: skewY(-20deg);
}
.pricingTable .pricingTable-header{
    padding: 20px 20px 60px;
    text-align: left;
    position: relative;
}
.pricingTable .title{
    font-size: 30px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
    margin: 0;
}
.pricingTable .sub-title{
    display: block;
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
}
.pricingTable .year{
    width: 80px;
    height: 55px;
    background: #fff;
    padding: 7px 0;
    font-size: 15px;
    font-weight: 600;
    font-style: normal;
	line-height: 20px;
    color: var(--pricingTable-yellow);
    text-align: center;
    position: absolute;
    top: 30px;
    right: 20px;
    z-index: 1;
}
.pricingTable .year:before,
.pricingTable .year:after{
    content: "";
    width: 57px;
    height: 57px;
    background: #fff;
    position: absolute;
    top: -28px;
    left: 50%;
    z-index: -1;
    transform: translateX(-50%) scaleY(0.5) rotate(45deg);
}
.pricingTable .year:after{
    top: auto;
    bottom: -28px;
}
.pricingTable .price-value{
    display: inline-block;
    width: 170px;
    height: 110px;
    padding: 15px;
    border: 2px solid var(--pricingTable-yellow);
    border-top: none;
    border-bottom: none;
    position: relative;
}
.pricingTable .price-value:before,
.pricingTable .price-value:after{
    content: "";
    width: 121px;
    height: 121px;
    border: 3px solid var(--pricingTable-yellow);
    border-right: none;
    border-bottom: none;
    position: absolute;
    top: -60px;
    left: 50%;
    transform: translateX(-50%) scaleY(0.5) rotate(45deg);
}
.pricingTable .price-value:after{
    border-top: none;
    border-left: none;
    border-bottom: 3px solid var(--pricingTable-yellow);
    border-right: 3px solid var(--pricingTable-yellow);
    top: auto;
    bottom: -60px;
}
.pricingTable .value{
    width: 100%;
    height: 100%;
    background: #fff;
    border: 2px solid var(--pricingTable-yellow);
    border-top: none;
    border-bottom: none;
    color: var(--pricingTable-yellow);
    z-index: 1;
    position: relative;
}
.pricingTable .value:before,
.pricingTable .value:after{
    content: "";
    width: 97px;
    height: 97px;
    background: #fff;
    border: 3px solid var(--pricingTable-yellow);
    border-bottom: none;
    border-right: none;
    position: absolute;
    top: -48px;
    left: 50%;
    z-index: -1;
    transform: translateX(-50%) scaleY(0.5) rotate(45deg);
}
.pricingTable .value:after{
    border-right: 3px solid var(--pricingTable-yellow);
    border-bottom: 3px solid var(--pricingTable-yellow);
    border-top: none;
    border-left: none;
    top: auto;
    bottom: -48px;
}
.pricingTable .currency{
    display: inline-block;
    font-size: 30px;
    margin-top: 7px;
    vertical-align: top;
}
.pricingTable .amount{
    display: inline-block;
    font-size: 40px;
    font-weight: 600;
    line-height: 65px;
}
.pricingTable .amount span{
    display: inline-block;
    font-size: 30px;
    font-weight: normal;
    vertical-align: top;
    margin-top: -7px;
}
.pricingTable .month{
    display: block;
    font-size: 16px;
    line-height: 0;
}
.pricingTable .pricing-content{
    padding: 50px 0 0 80px;
    margin-bottom: 20px;
    list-style: none;
    text-align: left;
    transition: all 0.3s ease 0s;
}
.pricingTable .pricing-content li{
    padding: 7px 0;
    font-size: 16px;
    color: #808080;
    position: relative;
}
.pricingTable .pricing-content li:before,
.pricingTable .pricing-content li.disable:before{
    content: "\e963";
    font-family: 'IcoMoon-Free';
    font-weight: 900;
    width: 25px;
    height: 25px;
    line-height: 25px;
    border-radius: 50%;
    background: #98c458;
    text-align: center;
    color: #fff;
    position: absolute;
    left: -50px;
}
.pricingTable .pricing-content li.disable:before{
    content: "\e95f";
    background: #fe6c6c;
}
.pricingTable .pricingTable-signup{
    display: inline-block;
	padding: 0px 20px;
    height: 50px;
    line-height: 50px;
    font-size: 22px;
    font-weight: 700;
    color: var(--pricingTable-yellow);
    text-transform: capitalize;
    border: 2px solid var(--pricingTable-yellow);
    margin: 0 auto 10px;
    position: relative;
    transition: all 0.3s ease 0s;
}
.pricingTable .pricingTable-signup:hover{
    background: var(--pricingTable-yellow);
    color: #fff;
}
.pricingTable.purple{ border-bottom-color: var(--pricingTable-purple); }
.pricingTable.purple:before{ background: var(--pricingTable-purple); }
.pricingTable.purple .year{ color: var(--pricingTable-purple); }
.pricingTable.purple .price-value{
    border-left-color: var(--pricingTable-purple);
    border-right-color: var(--pricingTable-purple);
}
.pricingTable.purple .price-value:before{
    border-left-color: var(--pricingTable-purple);
    border-top-color: var(--pricingTable-purple);
}
.pricingTable.purple .price-value:after{
    border-right-color: var(--pricingTable-purple);
    border-bottom-color: var(--pricingTable-purple);
}
.pricingTable.purple .value{
    border-left-color: var(--pricingTable-purple);
    border-right-color: var(--pricingTable-purple);
    color: var(--pricingTable-purple);
}
.pricingTable.purple .value:before{
    border-left-color: var(--pricingTable-purple);
    border-top-color: var(--pricingTable-purple);
}
.pricingTable.purple .value:after{
    border-right-color: var(--pricingTable-purple);
    border-bottom-color: var(--pricingTable-purple);
}
.pricingTable.purple .pricingTable-signup{
    color: var(--pricingTable-purple);
    border-color: var(--pricingTable-purple);
}
.pricingTable.purple .pricingTable-signup:hover{
    color: #fff;
    background: var(--pricingTable-purple);
}
.pricingTable.blue{ border-bottom-color: var(--pricingTable-blue); }
.pricingTable.blue:before{ background: var(--pricingTable-blue); }
.pricingTable.blue .year{ color: var(--pricingTable-blue); }
.pricingTable.blue .price-value{
    border-left-color: var(--pricingTable-blue);
    border-right-color: var(--pricingTable-blue);
}
.pricingTable.blue .price-value:before{
    border-left-color: var(--pricingTable-blue);
    border-top-color: var(--pricingTable-blue);
}
.pricingTable.blue .price-value:after{
    border-right-color: var(--pricingTable-blue);
    border-bottom-color: var(--pricingTable-blue);
}
.pricingTable.blue .value{
    border-left-color: var(--pricingTable-blue);
    border-right-color: var(--pricingTable-blue);
    color: var(--pricingTable-blue);
}
.pricingTable.blue .value:before{
    border-left-color: var(--pricingTable-blue);
    border-top-color: var(--pricingTable-blue);
}
.pricingTable.blue .value:after{
    border-right-color: var(--pricingTable-blue);
    border-bottom-color: var(--pricingTable-blue);
}
.pricingTable.blue .pricingTable-signup{
    color: var(--pricingTable-blue);
    border-color: var(--pricingTable-blue);
}
.pricingTable.blue .pricingTable-signup:hover{
    color: #fff;
    background: var(--pricingTable-blue);
}
@media only screen and (max-width: 990px){
    .pricingTable{ margin-bottom: 30px; }
}
@media only screen and (max-width: 767px){
    .pricingTable:before{ transform: skewY(-15deg); }
    .pricingTable .title{ font-size: 22px; }
}




.pd-add{
	padding: 70px 0px;
}
.address-item{
	float: left;
	margin: 0 11px;
	padding: 0px 15px;
	width: 31%;
	box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
}

.address-icon{
	padding: 15px 0px;
}
.address-icon i{
	font-size: 38px;
	color: #393939;
}

.address-item h3{
	font-size: 28px;
	font-weight: 600;
	color: #fd6802;
}


.dmtop.show {
    bottom: 20px;
}

.contact-form h3{
	color: #fff;
    font-weight: 500;
    font-size: 21px;
    padding: 0;
    margin: 0;
    line-height: 1 !important
}

.contact-form .btn-light{
    font-size: 13px;
    color: #ffffff;
    background-color: #e87000;
	margin-top: 10px;
	padding: 10px 20px 10px 20px;

}

.widget-title h4{
	  color: #fff;
  font-weight: 500;
  font-size: 21px;
  padding: 0;
  margin: 0;
  line-height: 1 !important;
  margin-top: 15px;
}

.footer form fieldset{
    border: none;
}

.footer h5{
color: #fff;
font-weight: 500;
font-size: 19px;
padding: 0;
margin: 0;
line-height: 1 !important;

}

.footer button{
    background-color: #e87000;
    color: #fff;
    padding: 5px 20px 5px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 10px;
    width: 180px;
}


.footer button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

a:hover{
	color:#999999;
}


/* Style for the dropdown menu container */
.dropdown {
    position: relative;
    display: inline-block;
  }
  
  /* Style for the dropdown menu content */
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  /* Style for the dropdown menu items */
  .dropdown-content a {
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    color: #d1d1d1;
    font-weight: 500;
    font-size: 14px;
  }
  
  /* Change color on hover */
  .dropdown-content a:hover {
    background-color: #ddd;
  }
  
  /* Show the dropdown menu when hovering over the parent */
  .dropdown:hover .dropdown-content {
    display: block;
  }

  /* Common styles for columns */
.subproduct .column {
    float: left;
    width: 33.33%;
    padding: 10px;
    height: 400px;
    background-color: #5C5C5C;
}

.subproduct .column img {
    max-width: 100%;
    height: auto;
}

.subproduct .column h2,
.subproduct .column p {
    color: #fff;
    margin-left: 20px;
}

.subproduct .column h2 {
    text-align: left;
    font-size: 30px;
    font-weight: 600;
    margin-top: 12px;
}

.subproduct .column:hover {
    background-color: #E87000;
}

.subproduct .row {
    margin-left: 50px;
    margin-right: 50px;
}

/* Clear floats after the columns */
.subproduct .row:after {
    content: "";
    display: table;
    clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 768px) {
    .subproduct .column {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}

/* About section styles */
.about-item {
    background: #ffffff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    padding-bottom: 10px;
    transition: all 1s ease-in-out;
    margin-bottom: 30px;
}

.about-icon {
    padding: 20px 0px;
    transition: all 1s ease-in-out;
}

.about-icon span {
    font-size: 48px;
    color: #393939;
}

.about-text h3 {
    font-size: 22px;
    font-weight: 600;
    padding: 10px 0px;
}

.about-text h3 a {
    color: #393939;
}

.about-text h3 a:hover {
    color: #43C6AC;
}

.about-item:hover .about-icon {
    transform: rotate(-360deg);
    transition: all 1s ease-in-out;
}

.about-item:hover .about-icon span {
    color: #43C6AC;
    transition: all 1s ease-in-out;
}

  
  .fade-in-image {
    animation: fadeIn 10s;
    -webkit-animation: fadeIn 10s;
    -moz-animation: fadeIn 10s;
    -o-animation: fadeIn 10s;
    -ms-animation: fadeIn 10s;
  }
  
  @keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  
  @-moz-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  
  @-webkit-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  
  @-o-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  
  @-ms-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }

.modularpanels{
    text-align: center;
    margin-bottom: 30px;
}

.modularpanels h4{
   margin-top: 50px;
   font-size: 40px;
   font-weight: 600;
}

.modularpanels .row {
   margin: 20px;
  }

.modularpanels .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .modularpanels .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .modularpanels .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .modularpanels .column {
      width: 100%;
    }
  }


  .modularpanels .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.modularpanels .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.modularpanels .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .modularpanels .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}

.outdoor-enclosures{
    text-align: center;
    margin-bottom: 30px;
}

.outdoor-enclosures h4{
   margin-top: 50px;
   font-size: 40px;
   font-weight: 600;
}

.outdoor-enclosures .row {
   margin: 20px;
  }

.outdoor-enclosures .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .outdoor-enclosures .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .outdoor-enclosures .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .outdoor-enclosures .column {
      width: 100%;
    }
  }

  .outdoor-enclosures .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.outdoor-enclosures .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.outdoor-enclosures .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .outdoor-enclosures .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}

.baterrycabinet{
    text-align: center;
    margin-bottom: 30px;
}

.baterrycabinet h4{
   margin-top: 50px;
   font-size: 40px;
   font-weight: 600;
}

.baterrycabinet .row {
   margin: 20px;
  }

.baterrycabinet .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .baterrycabinet .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }

  .baterrycabinet .column ul{
    text-align: left;
    font-size: 15px;
    color: #1E1D23;
    margin-left: 50px;
  }

  .baterrycabinet .column ul li{
    font-size: 15px;
    color: #1E1D23;
  }
  
  
  /* Clear floats after the columns */
  .baterrycabinet .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .baterrycabinet .column {
      width: 100%;
    }
  }

  .baterrycabinet .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.baterrycabinet .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.baterrycabinet .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .baterrycabinet .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}

.aluminiumenclosures{
    text-align: center;
    margin-bottom: 30px;
}

.aluminiumenclosures h4{
   margin-top: 50px;
   font-size: 40px;
   font-weight: 600;
}

.aluminiumenclosures .row {
   margin: 20px;
  }

.aluminiumenclosures .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .aluminiumenclosures .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }

  .aluminiumenclosures .column ul{
    text-align: left;
    font-size: 15px;
    color: #1E1D23;
    margin-left: 50px;
  }

  .aluminiumenclosures .column ul li{
    font-size: 15px;
    color: #1E1D23;
  }
  
  
  /* Clear floats after the columns */
  .aluminiumenclosures .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .aluminiumenclosures .column {
      width: 100%;
    }
  }

  .aluminiumenclosures .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.aluminiumenclosures .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}
/* Add this CSS to make the image responsive */
.aluminiumenclosures .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .aluminiumenclosures .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}


.customdesign{
    text-align: center;
    margin-bottom: 30px;
}

.customdesign h4{
   margin-top: 50px;
   font-size: 40px;
   font-weight: 600;
}

.customdesign .row {
   margin: 20px;
  }

.customdesign .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .customdesign .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }

  .customdesign .column ul{
    text-align: left;
    font-size: 15px;
    color: #1E1D23;
    margin-left: 50px;
  }

  .customdesign .column ul li{
    font-size: 15px;
    color: #1E1D23;
  }
  
  
  /* Clear floats after the columns */
  .customdesign .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .customdesign .column {
      width: 100%;
    }
  }

  .customdesign .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.customdesign .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.customdesign .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .customdesign .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}

.partner {
    margin-right: 5%;
    margin-left: 5%;
    background-color: #5C5C5C;
    height: auto; /* Set height to auto for responsiveness */
    text-align: center;
    overflow: hidden; /* Clear floats */
}

.partner h4 {
    font-size: 3vw; /* Use vw (viewport width) units for font size */
    text-align: center;
    color: #FFF;
    margin-top: 2%; /* Use percentage for margin-top */
}

.partner p {
    font-size: 1.5vw; /* Use vw units for font size */
    text-align: center;
    color: #FFF;
}

.partner button {
    background-color: #e87000;
    color: #fff;
    padding: 2% 5%; /* Use percentage for padding */
    border: none;
    border-radius: 5px;
    margin-top: 5%; /* Use percentage for margin-top */
}

.partner button:hover {
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

.partner .column {
    width: 48%; /* Adjust width for responsiveness, leave a small gap between columns */
    margin: 1%; /* Add a small margin to columns for spacing */
    float: left;
}

.partner img {
    max-width: 100%; /* Make images responsive */
    height: auto; /* Maintain aspect ratio */
}

.partner .row {
    max-width: 100%; /* Make sure the row does not exceed the container width */
}

/* Clear floats after the columns */
.partner .row:after {
    content: "";
    display: table;
    clear: both;
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
    .partner .column {
        width: 100%;
        margin: 0; /* Remove margin for full-width columns */
    }
    .partner img {
        max-width: 100%; /* Make images responsive */
        height: auto; /* Maintain aspect ratio */
    }
}


  #top, #bottom { position:fixed; top:0; left:0 }
#top { z-index:9; } #bottom { z-index:8; }

.target{
    z-index: 1;

}

.ftco-section{
    text-align: center;
}

.ftco-section .heading-section{
    text-align: center;
    margin-top: 50px;
    font-size: 44px;
    font-weight: 500;
}

.ftco-section .btn{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
}

.ftco-section .btn:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

.dbox .icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #5c5c5c;
    margin: 0 auto;
    margin-bottom: 20px;
}

.dbox .icon span {
    font-size: 20px;
    color: #fff;
    margin-top: 20px;
}

.catalog{
    text-align: center;
}

.catalog .column {
    float: left;
    width: 33.33%;
    padding: 10px;
    height: 300px; /* Should be removed. Only for demonstration */
  }

  .catalog .row{
    margin-top: 50px;
    margin-left: 50px;
    margin-right: 50px;
  }
  
  /* Clear floats after the columns */
  .catalog .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
    .catalog .column {
      width: 100%;
    }
}

    /*--------------------------------------------------------------
# Services1
--------------------------------------------------------------*/
.services1 .icon-box {
    text-align: center;
    padding: 20px 10px 0px;
    transition: all ease-in-out 0.3s;
    margin-top: 30px;
    
  }

  .services1 h3{
    text-align: center;
    font-size: 40px;
    color: #000;
    text-decoration: none;
    font-weight: 600;
    font-style: normal;
    margin-top: 40px;
  }
  
  .services1 .icon-box img {
    border-radius: 5px;
    transition: all 0.3s ease-out 0s;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    transform-style: preserve-3d;
    position: relative;
    z-index: 2;
    margin-top: 10px;
  }
  
  
  .services1 .icon-box h4 {
    font-weight: 700;
    margin-bottom: 20px;
    font-size: 24px;
  }
  .services1 .icon-box p {
    color: #000;
    font-size:13px;
  }
  
  .services1 .icon-box h4 a {
    color: #0b2341;
    font-size: 20px;
  }
  
  .services1 .icon-box:hover {
    background: #ffffff;
    border-color: #ffffff;
  }
  
  .services1 .icon-box:hover .icon {
    background: #fff;
  }
  
  .services1 .icon-box:hover .icon i {
    color: #ed502e;
  }
  
  .services1 .icon-box:hover .icon::before {
    background: #f1775d;
  }
  
  .services1 .icon-box:hover h4 a,
  .services1 .icon-box:hover p {
    color: #000;
  }
  .services1 .get-started-btn{
      display: inline-block;
      padding: 10px 20px 10px 20px;
      border-radius: 4px;
    color: #000;
    transition: none;
    font-size: 14px;
    font-weight: 600;
    transition: 0.3s;
    background: #E87000;
  }
  
  .services1 .get-started-btn:hover{
       border: 2px solid #E87000;
       background: #fff;
  }
  
  .services1 .btn-set{
      text-align: left;
  }
  
  .services1 .btn{
    display: inline-block;
    padding: 10px 10px 10px 10px;
    border-radius: 4px;
    color: #fff;
    transition: none;
    font-size: 14px;
    font-weight: 600;
    transition: 0.3s;
    border: 2px solid #091426;
    background: #091426;
    margin-top: 30px;
  }
  
  .services1 .btn:hover{
      background: #ff9900;
      border: none;
  }

  .Certificates{
    text-align: center;
  }

  .Certificates .row {
	margin-top: 30px;
  display: flex;
 justify-content: center;
}

.Certificates .column {
  width: 50%;
  height: 500px;
}

.Certificates img {
	display: block;
  margin-left: auto;
  margin-right: auto;
}


@media screen and (max-width: 600px) {
  .Certificates .column {
    width: 100%;
  }

}

.product1{
    text-align: center;
    margin-bottom: 30px;
}

.product1 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product1 .row {
   margin: 20px;
  }

.product1 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product1 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product1 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product1 .column {
      width: 100%;
    }
  }


  .product1 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product1 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.product1 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product1 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}

.product2{
    text-align: center;
    margin-bottom: 30px;
}

.product2 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product2 .row {
   margin: 20px;
  }

.product2 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product2 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product2 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product2 .column {
      width: 100%;
    }
  }


  .product2 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product2 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}
/* Add this CSS to make the image responsive */
.product2 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product2 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}

.product3{
    text-align: center;
    margin-bottom: 30px;
}

.product3 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product3 .row {
   margin: 20px;
  }

  .product3 .row h3{
    margin-top: 50px;
    font-size: 32px;
    font-weight: 600;
    text-align: left;
    font-style: normal;
    margin-left: 100px;
   }

.product3 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product3 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product3 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product3 .column {
      width: 100%;
    }
  }


  .product3 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product3 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.product3 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product3 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
    .product3 .row h3{
        text-align: left;
        margin-left: 0px;
        width: 250px;
       }
}

.product4{
    text-align: center;
    margin-bottom: 30px;
}

.product4 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product4 .row {
   margin: 20px;
  }

  .product4 .row h3{
    margin-top: 50px;
    font-size: 32px;
    font-weight: 600;
    text-align: left;
    font-style: normal;
    margin-left: 100px;
   }

.product4 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product4 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product4 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product4 .column {
      width: 100%;
    }
  }


  .product4 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product4 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.product4 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product4 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
    .product4 .row h3{
        text-align: left;
        margin-left: 0px;
        width: 250px;
       }
}

.product5{
    text-align: center;
    margin-bottom: 30px;
}

.product5 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product5 .row {
   margin: 20px;
  }

  .product5 .row h3{
    margin-top: 50px;
    font-size: 32px;
    font-weight: 600;
    text-align: left;
    font-style: normal;
    margin-left: 100px;
   }

.product5 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product5 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product5 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product5 .column {
      width: 100%;
    }
  }


  .product5 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product5 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.product5 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product5 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
    .product5 .row h3{
        text-align: left;
        margin-left: 0px;
        width: 250px;
       }
}


.product6{
    text-align: center;
    margin-bottom: 30px;
}

.product6 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product6 .row {
   margin: 20px;
  }

  .product6 .row h3{
    margin-top: 50px;
    font-size: 32px;
    font-weight: 600;
    text-align: left;
    font-style: normal;
    margin-left: 100px;
   }

.product6 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product6 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product6 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product6 .column {
      width: 100%;
    }
  }


  .product6 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product6 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.product6 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product6 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
    
}


.product7{
    text-align: center;
    margin-bottom: 30px;
}

.product7 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product7 .row {
   margin: 20px;
  }

 .product7 button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
  }

  .product7 button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}


  .product7 .row h3{
    margin-top: 50px;
    font-size: 32px;
    font-weight: 600;
    text-align: left;
    font-style: normal;
    margin-left: 100px;
   }

.product7 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product7 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product7 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product7 .column {
      width: 100%;
    }
  }


  .product7 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product7 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.product7 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product7 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
    .product7 .row h3{
        text-align: left;
        margin-left: 0px;
        width: 250px;
       }
}


.product8{
    text-align: center;
    margin-bottom: 30px;
}

.product8 h4{
   margin-top: 50px;
   font-size: 37px;
   font-weight: 700;
   color: #e87000;
}

.product8 .row {
   margin: 20px;
  }

  .product8 .row h3{
    margin-top: 50px;
    font-size: 32px;
    font-weight: 600;
    text-align: left;
    font-style: normal;
    margin-left: 100px;
   }

.product8 .column {
    text-align: left;
    float: left;
    width: 50%;
    padding: 10px;
  }

  .product8 .column p{
    text-align: left;
    font-size: 16px;
    color: #1E1D23;
  }
  
  /* Clear floats after the columns */
  .product8 .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
   .product8 .column {
      width: 100%;
    }
  }


  .product8 .column button{
    background-color: #e87000;
    color: #fff;
    padding: 10px 20px 10px 20px;
    border: none;
    border-radius: 5px;
    margin-top: 30px;
}


.product8 .column button:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
}

/* Add this CSS to make the image responsive */
.product8 .column img {
    max-width: 100%;
    height: auto;
}

/* Adjustments for smaller screens */
@media screen and (max-width: 600px) {
    .product8 .column img {
        width: 100%;
        margin-top: 20px; /* Adjust as needed */
    }
}


/*--------------------------------------------------------------
# Team
--------------------------------------------------------------*/
.team {
    background: #fff;
    padding: 60px 0;
  }
  
  .team .member {
    text-align: center;
    margin-bottom: 20px;
    position: relative;
  }
  
  .team .member .member-info {
    opacity: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    transition: 0.2s;
  }
  
  .team .member .member-info-content {
    margin-top: -50px;
    transition: margin 0.2s;
  }
  
  .team .member:hover .member-info {
    background: rgba(0, 0, 0, 0.7);
    opacity: 1;
    transition: 0.4s;
  }
  
  .team .member:hover .member-info-content {
    margin-top: 0;
    transition: margin 0.4s;
  }
  
  .team .member h4 {
    font-weight: 700;
    margin-top: 10px;
    font-size: 19px;
    color: #000;
  }
  
  .team .member p {
    margin-top: 10px;
    font-size: 17px;
    color: #000;
    text-align: left;
  }
  
  .team .cta-btn {
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 1px 10px;
    border-radius: 4px;
    transition: 0.5s;
    margin-top: 2px;
    background: #e87000;
    color: #fff;
    margin-left: -5px;
    padding: 4px 10px 4px 10px;
    margin-left: 1px;
  }
  
  .team .cta-btn:hover {
    background: #808080;
    color: #000;
  }
  
  .team .member span {
    font-style: italic;
    display: block;
    font-size: 13px;
    color: #fff;
  }
  
  .team .member .social {
    margin-top: 15px;
  }
  
  .team .member .social a {
    transition: color 0.3s;
    color: #fff;
  }
  
  .team .member .social a:hover {
    color: #5c9f24;
  }
  
  .team .member .social i {
    font-size: 18px;
    margin: 0 2px;
  }

  .center {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
  }
  
  .center .cta-btnmain{
  
    font-weight: 600;
      font-size: 18px;
      letter-spacing: 1px;
      display: inline-block;
      padding: 1px 10px;
      border-radius: 4px;
      transition: 0.5s;
      margin-top: 2px;
      background: #e87000;
      color: #fff;
      margin-left: -5px;
      padding: 4px 15px 4px 15px;
      margin-left: 1px;
  
  }
  
  .center .cta-btnmain:hover{
    background: #808080;
  color: #000;
  }

  .cet table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
  }
  
  .cet td, th {
    text-align: left;
    padding: 2px;
    font-size: 15px;
  }
  
  .cet tr:nth-child(even) {
    background-color: #dddddd;
  }

  .video h4{
    margin-left: -50px;
    font-size: 24px;
  }
  
  .video p{
    margin-left: -50px;
    font-size: 18px;
    margin-top: 50px;
  }
  
  .video a{
    margin-left: -50px;
    display: inline-block;
    line-height: 1;
    color: #000;
    fill: #fff;
    text-align: center;
    transition: all .3s;
    background-color: #e87000;
    padding: 10px 10px 10px 10px;
    width: 150px;
    border: none;
    margin-top: 20px;
    border-radius: 5px; 
  }
  
  .video a:hover{
    background-color: #fff;
    color: #000;
    border: solid 2px #e87000;
  }
  
  .video .row{
    padding: 50px 50px 50px 50px;
  }
  .video .column {
    float: left;
    width: 50%;
    padding: 10px;
    height: 300px; /* Should be removed. Only for demonstration */
  }
  
  /* Clear floats after the columns */
  .video .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
    .video .column {
      width: 100%;
    }
  }