/*--------------------------------------------------------------------------------------

----------------------------------------------------------------------------------------
   1. BASE CSS
    2. TOP AREA
        2.1. SEARCH AND LANGUAGE
        2.2 MAINMENU AREA
        2.3 WELCOME TEXT AREA
        2.4 WELCOME SLIDER AREA
    3. BLOG AREA
    4. ABOUT AREA
    5. SERVICE AREA
    6. SERVIE BOTTOM AREA
    7. PROMO AREA
    8. PROMO BOTTOM AREA
    9. TESTMONIAL AREA
    10. FOOTER AREA
    11. FAQS AREA
    12. ABOUT DETAILS CONTENT AREA
    13. REPORT AREA
    14. TEAM AERA
    15. SERVICE TWO 
    16. SERVICE THREE
    17. CONTACT AREA
    18. FOOTER AREA
    19. SCROLL TO TOP
    20. WELCOME SLIDER AREA
    21. BLOG PAGE
    22. SERVICE PAGE
    23. 404 ERROR PAGE
----------------------------------------------------------------------------------------*/

/*--------------------
   1. BASE CSS
----------------------*/

@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,500i,700');
.alignleft {
    float: left;
    margin-right: 15px;
}

.alignright {
    float: right;
    margin-left: 15px;
}

.aligncenter {
    display: block;
    margin: 0 auto 15px;
}

a {
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

a:focus,
a:hover {
    outline: 0 solid;
    text-decoration: none;
}

ul,
ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

button:focus {
    outline: 0;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #3c4a62;
    margin: 0 0 15px;
    font-weight: 700;
    line-height: 1.4em;
    text-transform: uppercase;
    position: relative;
}

h2 {
    font-size: 36px;
}

html,
body {
    height: 100%
}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 1.4em;
    font-weight: 400;
    color: #687284;
}

a:hover,
a:focus {
    text-decoration: none;
    outline: 0;
}

a {
    color: #5d6b82;
}

.fix {
    overflow: hidden;
}

.relative {
    position: relative;
    overflow: hidden;
}

.absulute {
    position: absolute;
}

.v-center {
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.content-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.flex-v-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.social-bookmark li {
    display: inline;
}

.social-bookmark li a {
    background: #d7d7d7 none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    height: 40px;
    margin: 0 2px;
    padding-top: 9px;
    text-align: center;
    width: 40px;
}

.social-bookmark li a:hover {
    background: #32d913 none repeat scroll 0 0;
    color: #fff;
}

.inline li {
    display: inline;
}

.inline-block li {
    display: inline-block;
    padding: 5px 15px;
}

.navbar-toggle {
    border: 2px solid #32d913;
    border-radius: 0;
}

.navbar-toggle .icon-bar {
    background: #32d913 none repeat scroll 0 0;
}

.no-margin {
    margin: 0;
}

.no-padding {
    padding: 0;
}

.border {
    border: 1px solid #ddd;
}

.border-left {
    border-left: 1px solid #ddd;
}

.border-right {
    border-right: 1px solid #ddd;
}

.border-top {
    border-top: 1px solid #ddd;
}

.border-bottom {
    border-bottom: 1px solid #ddd;
}


/* Remove Chrome Input Field's Unwanted Yellow Background Color */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}

.area-title {
    margin-bottom: 50px;
    position: relative;
}

.area-title h2 {
    display: inline-block;
    font-size: 40px;
    letter-spacing: 2px;
    line-height: 1;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative;
    text-transform: uppercase;
}

.area-title h2::before,
.area-title h2::after {
    background: rgba(0, 0, 0, 0) url("img/title-border.png") repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 2px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100px;
}

.area-title h2::after {
    background: #32d913 none repeat scroll 0 0;
    height: 4px;
    width: 20px;
}


.area-title-left h2 {
    display: inline-block;
    font-size: 40px;
    letter-spacing: 2px;
    line-height: 1;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative;
    text-transform: uppercase;
}

.area-title-left h2::before,
.area-title-left h2::after {
    background: rgba(0, 0, 0, 0) url("img/title-border.png") repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    width: 100px;
}

.area-title-left h2::after {
    background: #32d913 none repeat scroll 0;
    height: 4px;
    width: 20px;
}


.section-padding {
    padding: 100px 0;
}

.padding-top {
    padding-top: 100px;
}

.padding-bottom {
    padding-bottom: 100px;
}

.padding-100-70 {
    padding-top: 100px;
    padding-bottom: 70px;
}

.padding-100-50 {
    padding-top: 100px;
    padding-bottom: 50px;
}

.gray-bg {
    background: #f7f9fc;
}

.deep-gray-bg {
    background: #eff1ff;
}

.dark-bg {
    background: #5d6b82;
    color: #ffffff;
}

.red-bg {
    background: #32d913;
    color: #ffffff;
}

.blue-bg {
    background: #0083ff;
    color: #ffffff;
}

.soft-blue-bg {
    background: #7db9e8;
    color: #ffffff;
}

.dark-bg .area-title h2 {
    color: #ffffff;
}

/*--------------------------
    2. TOP AREA
---------------------------*/

.top-area {
    height: 100%;
    position: relative;
    width: 100%;
}

.top-area-bg {
    background: rgba(0, 0, 0, 0) url("img/slider/slide_1.jpg") no-repeat scroll center center / cover;
    height: 100%;
    left: 0;
    position: absolute;
    top:40px;
    width: 100%;
}

.top-area-bg::after {
    background: #3c4147;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.9;
    position: absolute;
    top: 0;
    width: 100%;
}


/*---------------------------------
    2.1. SEARCH AND LANGUAGE
----------------------------------*/

.search-and-language-bar {
    margin-left: 20px;
    margin-top: 30px;
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;

}

.is-sticky .search-and-language-bar {
    margin-top: 10px;
}

.search-and-language-bar ul li {
    color: #fff;
    cursor: pointer;
    display: inline-block;
    line-height: 1;
    padding: 10px;
}

.search-and-language-bar ul li a {
    color: #fff;
    display: block;
}

.search-box {
    position: relative;
}

.search-form {
    background: #fff none repeat scroll 0 0;
    border-radius: 5px;
    top: 72px;
    height: 60px;
    position: absolute;
    right: 0;
    width: 280px;
    display: none;
}

.is-sticky .search-form {
    top: 50px;
}

.search-form input {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 center;
    border: 1px solid #32d913;
    color: #333;
    height: 40px;
    left: 11px;
    padding: 10px;
    position: absolute;
    top: 10px;
    width: 77%;
}

.search-form button {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #32d913;
    color: #32d913;
    font-size: 20px;
    height: 40px;
    padding: 7px 12px;
    position: absolute;
    right: 10px;
    top: 10px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.search-form button:hover {
    background: #32d913 none repeat scroll 0 0;
    color: #fff;
}

.select-language select {
    background: #fff;
    border: 0 none;
    color: #333;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
}

/*---------------------------------
    2.2 MAINMENU AREA
-----------------------------------*/


.header-top-area {
  background: #000000;
  
}
.header-top-area .header-top-left {
  margin: 7px 0;
}
.header-top-area .header-top-left ul li {
  text-transform: lowercase;
  font-size: 14px;
}
.header-top-area .header-top-left ul li i {
  padding-right: 10px;
  color: #32d913;
  font-size: 14px;
}
.header-top-area .header-top-left ul li a {
  color: #ffffff;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.header-top-area .header-top-left ul li:hover a {
  color: #32d913;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.header-top-area .header-top-right {
  text-align: right;
   margin: 7px 0;
    padding-left: 5px;
  color: #ffffff;
  font-size: 14px;
}
.header-top-area .header-top-right ul li i {
  padding-right: 5px;
  color: #32d913;
  font-size: 14px;
}

.header-top-area .header-top-center {
  text-align: center;
   margin: 7px 0;
  color: #ffffff;
  font-size: 14px;
}

.header-top-area .header-top-center ul li i {
  padding-right: 5px;
  color: #32d913;
  font-size: 14px;
}


.header-bottom-area {
    left: 0;
    position: absolute;
    top: 40px;
    width: 100%;
    z-index: 999;
}

.mainmenu-area {
    border-bottom: 1px solid rgba(243, 156, 18, .4);
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    z-index: 9999;
}



.navbar-header {
    margin-top: 14px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.navbar {
    border-bottom: 0 none;
    border-top: 0 none;
    margin-bottom: 0;
}

.navbar-brand { padding:0px}

.navbar-brand > img {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 220px;
}

.is-sticky .navbar-brand > img {
    max-width: 60%;
}

.is-sticky .navbar-brand { padding:10px 0}

ul#nav {
    float: right;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

ul#nav li a {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #ffffff;
    letter-spacing: 1px;
    padding: 40px 15px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

ul#nav li a:hover,
ul#nav li.active a {
    color: #32d913;
}

.is-sticky ul#nav li a {
    padding: 20px 15px;
    color: #ffffff;
}

.is-sticky ul#nav li a:hover,
.is-sticky ul#nav li.active a {
    color: #32d913;
}

.is-sticky .navbar-header {
    margin-top: -2px;
}

.is-sticky .mainmenu-area {
    background: #212121;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
    z-index: 99999;
}

.menu-toggle.full {
    border: 1px solid;
    height: 40px;
    letter-spacing: 2px;
    padding-top: 8px;
    position: absolute;
    right: 15px;
    text-align: center;
    top: 20px;
    width: 110px;
    color: #32d913 !important;
}

.is-sticky .menu-toggle.full {
    top: 8px;
}

ul#nav li ul a,
.is-sticky ul#nav li ul a {
    border-bottom: 1px solid #1a1a1a;
    padding: 10px;
    padding-left: 15px;
}

/*-----------------------------------
    2.3 WELCOME TEXT AREA
-------------------------------------*/

.welcome-area {
    color: #ffffff;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 100px;
    width: 100%;
}

.welcome-text h1 {
    color: #ffffff;
    font-size: 42px;
    letter-spacing: 2px;
    line-height: 1.3;
    margin-bottom: 30px;
    text-transform: uppercase;
}

.welcome-text h4 {
    font-size: 20px;
    letter-spacing: 8px;
    text-transform: uppercase;
}

.home-button {
    margin-top: 60px;
    height: auto !important;
}

.home-button a {
    border: 2px solid;
    color: #fff;
    letter-spacing: 2px;
    padding: 12px 30px;
    text-transform: uppercase;
}

.home-button a.quote {
    border: 2px solid;
    color: #fff;
    letter-spacing: 2px;
    padding: 12px 30px;
	background:#32d913;
    text-transform: uppercase;
}

.home-button a:last-child {
    margin-left: 20px;
}

.home-button a:hover {
    background: #32d913 none repeat scroll 0 0;
    border-color: #32d913;
    color: #ffffff;
}

.home-mockup > img {
    max-width: 50%;
}

/*------------------------------
    2.4 WELCOME SLIDER AREA
--------------------------------*/

.welcome-slider-area {
    height: 100%;
    position: relative;
    z-index: 9;
}

.welcome-slider-area.owl-carousel div:not(.owl-controls) {
    height: 100%;
}

.welcome-single-slide {
    z-index: 9;
    position: relative;
}

.welcome-single-slide:before {
    background: #000000;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.7;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.welcome-slider-area .welcome-text {
    color: #FFFFFF;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 100px;
}

.welcome-text h4 {
    margin-bottom: 30px;
}

.welcome-text h2 {
    color: #fff;
    line-height: 1;
    margin-bottom: 30px;
}

.welcome-slider-area.home-button {
    height: auto !important;
}

.owl-item.active .welcome-single-slide .welcome-text h1 {
    -webkit-animation: 1s ease 0.5s normal both 1 running fadeInUp;
    animation: 1s ease 0.5s normal both 1 running fadeInUp;
}

.owl-item.active .welcome-single-slide .welcome-text p {
    -webkit-animation: 1s ease 0.8s normal both 1 running fadeInUp;
    animation: 1s ease 0.8s normal both 1 running fadeInUp;
}

.owl-item.active .welcome-single-slide .home-button {
    -webkit-animation: 1s ease 1s normal both 1 running fadeInUp;
    animation: 1s ease 1s normal both 1 running fadeInUp;
}

.slider-bg-one {
    background: url("img/slider/slide_1.jpg") no-repeat scroll center center / cover;
}

.slider-bg-two {
    background: url("img/slider/slide_2.jpg") no-repeat scroll center center / cover;
}

.slider-bg-three {
    background: url("https://codeglamour.com/html/18/transbizz/img/slider/slide_3.jpg") no-repeat scroll center center / cover;
}

.welcome-slider-area.owl-carousel .owl-nav > div {
    background: #fff none repeat scroll 0 0;
    display: inline-block;
    font-size: 30px;
    height: 40px;
    margin: 0 5px;
    padding-top: 5px;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 40px;
}

.welcome-slider-area.owl-carousel .owl-controls {
    bottom: 7%;
    position: absolute;
    right: 8.4%;
}

.welcome-slider-area.owl-carousel .owl-nav > div:hover {
    background: #32d913 none repeat scroll 0 0;
    color: #fff;
}


/* ----------------------------
    3. Welcome to AREA
------------------------------ */
.welcome-to-area  h4 {
     padding-top: 40px;
	 font-size:22px;
}

.welcome-to-area .logo-box {
    display: inline-block;
    box-shadow: 0px 0px 12px 1px rgb(153 153 153 / 50%);
    -webkit-box-shadow: 0px 0px 12px 1px rgb(153 153 153 / 50%);
    -moz-box-shadow: 0px 0px 12px 1px rgba(153,153,153,0.50);
    margin-bottom: 0px;
    background: #fff;
    padding: 20px;
    text-align: center;
}

.single-about-box {
    margin-top: 30px;
}

.single-about-box h4{
    padding-top: 0px;
	 font-size:22px
}

.single-about-box p{
    font-size:16px;
	margin-bottom:20px
}

.theme-btn {
    border: 1px solid #32d913;
    background: #32d913;
    color: #fff;
    display: inline-block;
    font-weight: 500;
    padding: 6px 22px;
    text-transform: uppercase;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.theme-btn:hover {
    background: #fff;
    color: #32d913;
    border: 1px solid #32d913;
}


/* ----------------------------
    3. Vision Mission AREA
------------------------------ */
.vision-mission-area {
	overflow:hidden;
	padding:0;
}
.vision-area {
	background:#5d6b82;
	min-height:420px;
	color:#ffffff;
}
.vision-area h4 {
	font-size:32px;
	color:#ffffff;
}
.vision-content {
	padding:50px;
}

.mission-area {
	background:#000000;
	min-height:420px;
	color:#ffffff;
}

.mission-content {
	padding:50px;
}
.mission-area h4 {
	font-size:32px;
	color:#ffffff;
}

.welcome-to-area .logo-box {
    display: inline-block;
    box-shadow: 0px 0px 12px 1px rgb(153 153 153 / 50%);
    -webkit-box-shadow: 0px 0px 12px 1px rgb(153 153 153 / 50%);
    -moz-box-shadow: 0px 0px 12px 1px rgba(153,153,153,0.50);
    margin-bottom: 0px;
    background: #fff;
    padding: 20px;
    text-align: center;
}

.single-about-box {
    margin-top: 30px;
}

.single-about-box h4{
    padding-top: 0px;
	 font-size:22px
}

.single-about-box p{
    font-size:16px;
	margin-bottom:20px
}


/* ----------------------------
    3. Service AREA
------------------------------ */

.single-service {
    border-radius: 5px;
    -webkit-box-shadow: 0 3px 7px #ddd;
    box-shadow: 0 3px 7px #ddd;
    overflow: hidden;
}

.service-details {
    background: #fff none repeat scroll 0 0;
    padding: 30px 20px;
    position: relative;
}

.service-details h3 {
    font-size: 18px;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.whatsapp-btn {
    color: #fff;
    border-color: #32d913;
    background-color: #32d913;
    display: inline-block;
    margin-top: 15px;
    padding: 7px 40px 7px 20px;
    text-align: center;
    width: 160px;
	line-height:24px;
	background-image: -webkit-linear-gradient(top,#fff3 0,#ffffff03 100%);
    background-image: -o-linear-gradient(top,rgba(255,255,255,.2) 0,rgba(255,255,255,.01) 100%);
    background-image: linear-gradient(to bottom,#fff3 0,#ffffff03 100%);
    background-repeat: repeat-x;

}

.read-more {
    background: #ffffff none repeat scroll 0 0;
    color: #000000;
    display: inline-block;
	margin-left:10px;
    margin-top: 15px;
    padding: 7px 20px;
    text-align: center;
    width: 160px;
    border: 1px solid #000000;
}

.read-more:hover,
.read-more:focus {
    background: #fff;
    color: #32d913;
    border: 1px solid #32d913;
}

.service-details h3 a {
    color: #3c4a62;
}

.service-details h3 a:hover,
.service-details h3 a:focus {
    color: #32d913;
}

/* ----------------------------
    4. ABOUT AREA
------------------------------ */

.quote-form-area {
    background: #eef1f5 none repeat scroll 0 0;
    padding: 30px 20px;
}

.quote-form input {
    margin-bottom: 10px;
}

.quote-form .width-full input {
    border: 0 none;
    padding: 10px;
    width: 100%;
}

.quote-form .width-half input {
    border: 0 none;
    padding: 10px;
    width: 47%;
}

.quote-form textarea {
    border: 0 none;
    height: 80px;
    margin-bottom: 10px;
    padding: 10px;
    width: 100%;
}


.quote-form button {
    background: #5d6b82 none repeat scroll 0 0;
    border: 0 none;
    border-radius: 5px;
    color: #fff;
    letter-spacing: 2px;
    padding: 10px 20px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.quote-form button:hover {
    background: #32d913;
    color: #fff;
}

.about-content h2 {
    margin-bottom: 30px;
}

.about-content a {
    display: inline-block;
    margin-top: 20px;
}

.about-content a:hover {
    color: #32d913;
}

.about-content a i {
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.about-content a:hover i {
    padding-left: 10px;
}

.about-count {
    margin-top: 20px;
}

.single-about-count {
    background: #fff none repeat scroll 0 0;
    float: left;
    padding: 30px 20px 20px;
    text-align: center;
    text-transform: capitalize;
    width: 33.33%;
}

.single-about-count h4 {
    color: #32d913;
    font-size: 24px;
    font-weight: 800;
}

/* ----------------------------
    3. Why Choose AREA
------------------------------ */

.why-choose-area {
   padding:70px 0;
   background:#000000;
   text-align:center;
	
}

.why-choose-area .area-title h2{
	 color:#ffffff;
}

.why-choose-area h4{
    font-size:20px;
	margin:20px 0;
	text-align:center;
	color:#ffffff;
	margin-bottom:20px
}



/* -----------------------------
    5. SERVICE AREA
------------------------------- */

.service-content h2 {
    font-size: 32px;
    margin-bottom: 30px;
    padding-bottom: 15px;
    position: relative;
}

.service-content h2::after {
    border-bottom: 1px dashed rgb(243, 156, 18);
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 50px;
}

.service-catalouge-content-area {
    background: rgba(0, 0, 0, 0) url("img/service/service-cargo-bg.png") no-repeat scroll center center / contain;
    position: relative;
}

.catalouge-content {
    background: rgba(243, 156, 18, 0.9) none repeat scroll 0 0;
    color: #fff;
    padding: 30px;
}

.catalouge-content h3 {
    color: #fff;
    margin-bottom: 30px;
    padding-bottom: 15px;
    position: relative;
}

.catalouge-content h3::after {
    border-bottom: 1px dashed;
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    width: 50px;
}

.catalouge-content .read-more:hover,
.catalouge-content .read-more:focus {
    background: #fff none repeat scroll 0 0;
    color: #32d913;
}

.catalouge-content ul {
    margin-top: 40px;
}

.catalouge-content ul li {
    margin-bottom: 15px;
}

.catalouge-content ul li i {
    margin-right: 15px;
}

/* ---------------------------
    6. SERVIE BOTTOM AREA
----------------------------- */

.service-bottom-area {
    position: relative;
}

.service-bottom-area-bg {
    background: rgba(0, 0, 0, 0) url("img/service/service-area-bg.jpg") repeat scroll 0 0;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.service-bottom-area-bg::after {
    background: #f5f7f9 none repeat scroll 0 0;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
}

.single-service {
    margin-bottom: 50px;
    padding-left: 80px;
    position: relative;
}

.service-list .single-service:last-child {
    margin-bottom: 0;
}

.service-icon-hexagon {
    left: -43px;
    position: absolute;
    top: -25px;
}

.hex {
    background: #f5f7f9 none repeat scroll 0 0;
    border-radius: 1em / 3.5em;
    display: inline-block;
    height: 5.2em;
    margin: 1em 4.61538em 1em auto;
    position: relative;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition: all 150ms ease-in-out 0s;
    transition: all 150ms ease-in-out 0s;
    width: 4em;
}

.hex:before,
.hex:after {
    position: absolute;
    width: inherit;
    height: inherit;
    border-radius: inherit;
    background: inherit;
    content: '';
}

.hex:before {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
}

.hex:after {
    -webkit-transform: rotate(-60deg);
    transform: rotate(-60deg);
}

.service-icon {
    background: #5d6b82 none repeat scroll 0 0;
    bottom: 7px;
    color: #fff;
    font-size: 24px;
    height: 60px;
    padding-top: 18px;
    position: absolute;
    right: 11px;
    text-align: center;
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 34px;
    z-index: 1;
}

.service-icon::before,
.service-icon::after {
    background: #5d6b82 none repeat scroll 0 0;
    content: "";
    height: 100%;
    position: absolute;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
    z-index: -1;
}

.service-icon::before {
    bottom: 0;
    right: 0;
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
}

.service-icon::after {
    bottom: 0;
    right: 0;
    -webkit-transform: rotate(-60deg);
    transform: rotate(-60deg);
}

.service-icon i {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
}

.service-details h4 {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    padding-bottom: 16px;
}

.service-details h4::after {
    border-bottom: 1px dashed rgb(243, 156, 18);
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 50px;
}

.single-service:hover .service-details h4 {
    color: #32d913;
}

.single-service:hover .service-icon,
.single-service:hover .service-icon::before,
.single-service:hover .service-icon::after {
    background: #32d913 none repeat scroll 0 0;
}


/* ----------------------------
    7.0 Call to Action AREA
----------------------------- */


.call-bottom-area {
    position: relative;
}

.call-botton-area-bg {
    background: rgba(0, 0, 0, 0) url("img/promo/call_action.jpg") no-repeat scroll center center / cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.call-botton-area-bg::after {
    background: #3c4a62b0  none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.7;
    position: absolute;
    top: 0;
    width: 100%;
}

.padding-tb-15px {
    padding-top: 15px;
    padding-bottom: 15px;
}

.call-bottom-area h2{
    font-size: 26px;
    color: #fff;
}

.call-bottom-area .text{
    color: #fff;
}

a.action-bottom {
    background-color: rgba(255, 255, 255, 0.2);
    padding: 25px 15px;
    text-align: center;
    color: #fff;
    display: block;
}

a.action-bottom:hover {
    background-color: #32d913;
    -webkit-box-shadow: 0px 0px 36px -13px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 36px -13px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 36px -13px rgba(0, 0, 0, 0.75);
}

a.action-bottom img {
    max-width: 100%;
}

a.action-bottom h4 {
    font-size: 14px;
    color: #fff;
    padding-top: 10px;
}

/* ----------------------------
    7.0 Certified AREA
----------------------------- */

.certified-area{
    background: #ffffff;
	padding:50px 0
}

.certified-area h3 {
    display: block;
	color:#000000;
	text-align:center;
    font-size: 40px;
    letter-spacing: 2px;
    line-height: 1;
    margin-bottom: 10px;
    padding-bottom: 20px;
    position: relative;
}

.certified-area .single-item-wrapper {
  margin-bottom: 20px;
}
.certified-area .single-item-wrapper:hover .publications-img-wrapper:before {
  opacity: 1;
  -webkit-transition: all 0.55s ease-out;
  -moz-transition: all 0.55s ease-out;
  -ms-transition: all 0.55s ease-out;
  -o-transition: all 0.55s ease-out;
  transition: all 0.55s ease-out;
}
.certified-area .single-item-wrapper:hover .buy-now-btn-area {
  -webkit-transform: skewX(0);
  -moz-transform: skewX(0);
  -ms-transform: skewX(0);
  -o-transform: skewX(0);
  transform: skewX(0);
  opacity: 1;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
}
.publications-img-wrapper {
  overflow: hidden;
  position: relative;
  margin-bottom: 20px;
  border:2px solid #32d913
}
.publications-img-wrapper:before {
  opacity: 0;
  position: absolute;
  background-color: rgba(0, 33, 71, 0.8);
  z-index: 2;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  -webkit-transition: all 0.75s ease-out;
  -moz-transition: all 0.75s ease-out;
  -ms-transition: all 0.75s ease-out;
  -o-transition: all 0.75s ease-out;
  transition: all 0.75s ease-out;
}
.publications-img-wrapper img {
  width: 100%;
}
.publications-content-wrapper {
  text-align: center;
}
.publications-content-wrapper .item-title {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 5px;
}
.publications-content-wrapper .item-title a {
  color: #002147;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.publications-content-wrapper .item-title a:hover {
  color: #fdc800;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.buy-now-btn-area {
  position: absolute;
  top: 36%;
  z-index: 3;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  opacity: 0;
  color:#ffffff;
  width:42px;
  height:42px;
  background:#32d913;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  line-height:42px;
}

.buy-now-btn-area i {
 
  color:#ffffff;}




/*------------------------------
    18. Client AREA
-------------------------------*/

.clients-area{
    background: #f5f7f9;
    padding: 40px 0px 60px 0;
}

.area-title h2 {
    display: inline-block;
	color:#000000;
    font-size: 40px;
    letter-spacing: 2px;
    line-height: 1;
    margin-bottom: 10px;
    padding-bottom: 20px;
    position: relative;
    text-transform: uppercase;
}



/* -----------------------------
    10. FOOTER AREA
------------------------------- */

.footer-bottom-area {
    padding: 70px 0 30px;
}

.footer-area h2,
.footer-area h3 {
    color: #fff;
    font-weight: 500;
    text-transform: capitalize;
}
.footer-about p{
    color: #f5f7f9;
}

/*------------------------------
    17. CONTACT AREA
-------------------------------*/

.contact-address {
    margin-bottom: 50px;
}

.contact-address a {
    color: #585858;
}

.contact-address a:hover {
    color: #32d913;
}

.contact-area .form-control {
    border-radius: 0;
    margin-bottom: 30px;
    min-height: 40px;
}

.contact-area button {
    background: #5d6b82 none repeat scroll 0 0;
    border: 0 none;
    border-radius: 3px;
    color: #fff;
    font-weight: 600;
    letter-spacing: 2px;
    padding: 10px 40px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.contact-area button:hover {
    background: #32d913 none repeat scroll 0 0;
    color: #fff;
}

.media, .media-body {
    zoom: 1;
    overflow: hidden;
}
.media {
    margin-top: 15px;
}

.contact-area .media .media-left {
    padding-right: 35px;
    vertical-align: middle;
}
.media-left, .media-right, .media-body {
    display: table-cell;
    vertical-align: middle;
}
.contact-area .media .media-left i {
    width: 60px;
    height: 60px;
    text-align: center;
    border: 1px solid #eaeaea;
    padding: 10px;
    font-size:42px;
    line-height: 38px;
}



/*------------------------------
    17. Services AREA
-------------------------------*/

.services-area {
	padding:100px 0 20px 0;
}

.services-area h4 {
   color:#000000;
   font-weight:700;
   margin-bottom:15px;
   margin-top:0px;
}
.services-area p {
   color:#000000;
   font-weight:400;
}
.services-area a.getquote {
    color: #32d913;
    margin: 25px 0 40px 0;
	font-weight:700;
	text-transform:uppercase;
	display:block;
	
}
.services-area .featured-box { margin-bottom:40px;}
.services-area .featured-box .featured-box-thumb {
    position: relative;
    display: block;
	margin-bottom:20px;
	clear:both;
}
/*------------------------------
    18. FOOTER AREA
-------------------------------*/

.footer-area {
    color: #ffffff;
    position: relative;
    z-index: 9;
}

.footer-area::after {
    background: rgba(0, 0, 0, 0) url("img/footer-map-bg.png") no-repeat scroll center center / 90% auto;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.1;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.footer-border {
    background: rgba(0, 0, 0, 0) url("img/footer-border.png") repeat-x scroll center center;
    height: 1px;
    margin-top: 20px;
}

.single-footer-widget {
    margin-bottom: 50px;
    overflow: hidden;
}

.single-footer-widget,
.single-footer-widget a {
    color: #f5f7f9;
}

.single-footer-widget a:hover {
    color: #32d913;
}

.single-footer-widget h3 {
    font-size: 20px;
    letter-spacing: 1px;
    margin-bottom: 40px;
    padding-bottom: 20px;
    position: relative;
}

.single-footer-widget h3::after {
    border-bottom: 1px dashed #32d913;
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 50px;
}

.single-footer-widget.footer-about ul {
    margin-top: 30px;
}

.single-footer-widget.footer-about ul li {
    margin-bottom: 10px;
    color: #f5f7f9;
}

.single-footer-widget.footer-about ul li i {
    border-right: 1px solid;
    margin-right: 10px;
    width: 20px;
}

.single-footer-widget.twitter-widget ul li {
    margin-bottom: 20px;
    padding-left: 30px;
    position: relative;
}

.single-footer-widget.twitter-widget ul li .twitter-icon {
    color: #32d913;
    left: 0;
    position: absolute;
}

.single-footer-widget.list-widget ul li {
    letter-spacing: 1px;
    margin-bottom: 10px;
    position: relative;
}

.single-footer-widget.list-widget ul li::before {
    content: "\f0a4";
    display: inline-block;
    font-family: fontawesome;
    margin-right: 15px;
}

.single-footer-widget.instafeed-widget li {
    float: left;
    margin-bottom: 2%;
    margin-right: 2%;
    width: 31.33%;
}

.footer-bottom-area .footer-border {
    margin: 0;
}

.footer-copyright-area {
    padding: 0px 0 30px 0;
}

.footer-copyright p {
    margin-bottom: 0;
    margin-top: 10px;
}

.footer-copyright a.footer-logo {
    border-bottom: 2px solid;
    display: block;
    margin-bottom: 5px;
    margin-right: 10px;
    max-width: 300px;
    padding-bottom: 10px;
}

.footer-copyright a {
    color: #ffffff;
}

.footer-social-bookmark .social-bookmark li a {
    background: rgba(255, 255, 255, 0.1) none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    height: 30px;
    margin: 0 2px;
    padding-top: 3px;
    text-align: center;
    width: 30px;
}

.footer-social-bookmark .social-bookmark li a:hover {
    background: #32d913;
    color: #fff;
}

/*------------------------------
    19. SCROLL TO TOP
-------------------------------*/

a.scrolltotop {
    background: #32d913 none repeat scroll 0 0;
    bottom: 20px;
    -webkit-box-shadow: 0 0 0 7px transparent;
    box-shadow: 0 0 0 7px transparent;
    color: #ffffff;
    display: none;
    font-size: 20px;
    height: 40px;
    padding-top: 5px;
    position: fixed;
    right: 20px;
    text-align: center;
    width: 40px;
    z-index: 99;
}

a.scrolltotop:hover {
    -webkit-box-shadow: 0 0 0 0 #272727;
    box-shadow: 0 0 0 0 #272727;
    background: #272727;
}