/*
*
* ---------------------------------------------------------------------------
*
* Template:    Portlio | Creative Agency, Corporate and Portfolio Html 5 Template
* Author:      CoderHut
* Author URI:  http://coderboys.net/
* Version:     1.0
*
* --------------------------------------------------------------------------- 
*
*/


/*  ---------------------------------------------------------------------------
    TABLE OF CONTENTS
    ---------------------------------------------------------------------------

*   01. GLOBAL AREA
*   02. COLOR AREA
*   03. SITE HEADER / .site-header
*   04. BANNER AREA / .banner-area
*   05. ABOUT AREA / .about-area
*   06. PORTFOLIO AREA / .portfolio-area
*   07. FUN FACT AREA / .fun-fact-area
*   08. OUR SKILLS AREA / .our-skills-area
*   09. OUR TEAM AREA / .our-team-area
*   10. VIDEO AREA / .video-area
*   11. PRICING TABLE AREA / .pricing-table-area
*   12. TESIMONIAL AREA / .testimonial-area
*   13. BRAND AREA / .brand-area
*   14. BLOG AREA / .blog-area
*   15. CONTACT AREA / .contact-area
*   16. MAP AREA / .map-area
*   17. SITE FOOTER / .site-footer
*   18. PAGE BANNER / .page-banner 

*/

/**
*
* ---------------------------------------------------------------------------
# [Color codes]

# Background:	#fff and #1C3262
# Content:	#555, #1C3262 and #fff
# Heading:	#fff and #1C3262
# Navigation: #1C3262 and #fff
# Link: #fff and #1C3262
# Hover: #fff and #1C3262
# Footer: #fff and #1C3262

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

/**
*
* ---------------------------------------------------------------------------
# [Typography]

# Body copy:            'Cardo', serif
# Heading:              'Pathway Gothic One', sans-serif
# Input, textarea:      'Cardo', serif
# Links:                'Cardo', serif

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

/*
* ---------------------------------------------------------------------------
* Google Fonts
* ---------------------------------------------------------------------------
*/

@import url('https://fonts.googleapis.com/css?family=Pathway+Gothic+One|Roboto:400,400i,600,600i,700,700i');

/*
* ---------------------------------------------------------------------------
* 01. GLOBAL AREA
* ---------------------------------------------------------------------------
*/

body {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 1px;
    font-family: 'Roboto', sans-serif;
    overflow-x: hidden;
    position: relative;
}
html,
body {
    height: 100%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Pathway Gothic One', sans-serif;
    text-transform: uppercase;
    margin: 0;
    line-height: 1;
    letter-spacing: 0.5px;
}
p {
    margin-bottom: 15px;
}
a {
    text-decoration: none;
    transition: all 0.5s;
    font-family: 'Roboto', sans-serif;
}
a:hover {
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
ul,
li {
    margin: 0;
    padding: 0;
}
img {
    max-width: 100%;
    height: auto;
}
.media-left img {
    max-width: inherit;
}
.owl-carousel .owl-item img {
    width: auto;
}
::-webkit-input-placeholder {
    color: inherit;
}
button {
    background-color: transparent;
    border: none;
}
button:focus,
input:focus {
    outline: none;
}

/* SECTION STYLE */

.sec-padding {
    padding: 100px 0 100px;
}
.section-title h2 {
    position: relative;
    padding-bottom: 10px;
}
.section-title h2:before,
.section-title h2:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 2px;
}
.section-title h2:after {
    z-index: 1;
    width: 55px;
}
.section-title h2:before {
    width: 0;
    transition: all 0.5s ease;
    z-index: 2;
}
.section-title:hover h2:before {
    width: 55px;
}
.section-title p {
    margin-bottom: 0;
    margin-top: 15px;
}
.sec-overlay {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.sec-overlay:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
}

/* BUTTON STYLE */

.tem-btn {
    display: inline-block;
    width: 160px;
    line-height: 50px;
    text-align: center;
    text-transform: uppercase;
    position: relative;
    overflow: hidden;
    font-weight: 700;
}
.tem-btn span {
    position: relative;
    z-index: 3;
}
.tem-btn:before,
.tem-btn:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 100%;
    height: 120%;
    width: 120%;
}
.tem-btn:after {
    z-index: 2; 
    transition: all 0.8s ease;
}
.tem-btn:before {
    opacity: 0.4;
    z-index: 1;
    transition: all 0.3s ease;
}
.tem-btn:hover:before,
.tem-btn:hover:after {
    bottom: 0;
    right: 0;
}

/* BOOTSTRAP CUSTOMIZATION */

.form-control {
    height: 40px;
    border-radius: 0;
    text-transform: uppercase;
}

/* ANIMATE CSS */

.animated-04s {
    animation-delay: 0.4s;
}
.animated-08s {
    animation-delay: 0.8s;
}
.animated-12s {
    animation-delay: 1.2s;
}

/*  PRELOADER */

.tem-preloader {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 9;
}
#loader {
    position: absolute;
    top: calc(50% - 20px);
    left: calc(50% - 20px);
}
#box {
    width: 50px;
    height: 50px;
    animation: animate 0.5s linear infinite;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 3px;
}
@keyframes animate {
    17% {
        border-bottom-right-radius: 3px;
    }
    25% {
        transform: translateY(9px) rotate(22.5deg);
    }
    50% {
        transform: translateY(18px) scale(1, 0.9) rotate(45deg);
        border-bottom-right-radius: 40px;
    }
    75% {
        transform: translateY(9px) rotate(67.5deg);
    }
    100% {
        transform: translateY(0) rotate(90deg);
    }
}
#shadow {
    width: 50px;
    height: 5px;
    opacity: 0.1;
    position: absolute;
    top: 59px;
    left: 0;
    border-radius: 50%;
    animation: shadow 0.5s linear infinite;
}
@keyframes shadow {
    50% {
        transform: scale(1.2, 1);
    }
}

/*
* ---------------------------------------------------------------------------
* 02. COLOR AREA
* ---------------------------------------------------------------------------
*/

/* COLOR */

.single-skill .perc,
a,
body {
    color: #555 !important;
}
.tem-btn,
.copyright-txt,
.tagcloud a:hover,
.tem-breadcrumb li a,
.page-banner-con h2,
.mobile-menu .slicknav_nav ul li a,
.footer-social-links li a:hover,
.single-footer-widget a,
.single-footer-widget,
.footer-widget-title,
.contact-single-info i,
.home-blog-overlay-link i,
.about-single-feature i,
.port-txt ul li a i,
.single-team-txt h3 span,
.single-team-txt ul li i,
.video-btn a,
.single-fact h4,
.single-fact i,
.single-fact,
.banner-area .owl-nav .owl-next i,
.banner-area .owl-nav .owl-prev i,
.main-menu ul li a,
.single-banner-txt a,
.single-banner-txt p,
.single-banner-txt h1,
.tem-btn:hover {
    color: #fff !important;
}
.reply a,
.nav-links span.page-numbers:hover,
.nav-links a.page-numbers:hover,
.nav-links span.page-numbers.current,
.tem-breadcrumb li,
.home-blog-date,
.copyright-txt a,
.widget_nav_menu ul li a:hover,
.widget_recent_entries ul li span,
.home-blog-read-btn a:hover,
.single-team-txt h3,
.single-testimonial-author h4,
.single-pricing-hdr h3,
.single-fact h2,
.portfolio-menu button.active-port {
    color: #1C3262;
}

.mobile-menu .slicknav_nav ul li a:hover,
.main-menu ul li a:hover,
.main-menu ul li.active a
{
    color: darkgrey !important
}
.single-testimonial-txt:after,
.single-testimonial-txt:before {
    color: #e8e8e8 !important;
}
.nav-links span.page-numbers,
.nav-links a.page-numbers {
    color: #ccc !important;
}

/* BACKGROUND COLOR */

.comment-reply-title:after,
.comments-title:after,
.single-sidebar-widget .tagcloud a:hover,
.sidebar-widget-title:after,
.page-banner-con h2:after,
.mobile-menu .slicknav_btn,
#box,
.footer-social-links li a:hover,
.tagcloud a:hover,
.footer-widget-title:after,
.contact-single-info i,
.about-single-feature i,
.single-team-txt ul li a:hover i,
.video-btn a,
.single-fact i,
.section-title h2:after,
.tem-btn {
    background-color: #1C3262 !important;
}
.single-sidebar-widget .tagcloud a,
.tem-preloader,
.footer-social-links li a,
.single-pricing-hdr,
.bg-alt {
    background-color: #f5f5f5 !important;
}
ul.entry-meta li:after,
.section-title h2:before {
    background-color: #555 !important;
}
.single-testimonial:before,
.single-testimonial,
.single-pricing-hdr i {
    background-color: #fff !important;
}
.tagcloud a {
    background-color: #333;
}
.tem-btn:before,
.tem-btn:after,
.fixed-menu,
.site-footer,
.single-team-con {
    background-color: #222 !important;
}
.footer-bottom {
    background-color: #1a1a1a !important;
}
#shadow {
    background-color: #999 !important;
}

/* BACKGROUND OVERLAY */

.page-banner-con,
.home-blog-overlay,
.port-overlay,
.sec-overlay:after,
.banner-area .owl-nav .owl-next i,
.banner-area .owl-nav .owl-prev i,
.single-banner:after {
    background-color: rgba(0, 0, 0, 0.65) !important;
}
.single-brand {
    background-color: rgba(255, 255, 255, 0.65) !important;
}

/* BORDER COLOR */

.banner-area .owl-dots button.owl-dot,
.home-blog-overlay-link a,
.port-txt ul li a i,
.single-team-txt ul li a i,
.banner-area .owl-nav .owl-prev i,
.banner-area .owl-nav .owl-next i {
    border-color: #fff !important;
}
.single-pricing-body ul li,
.single-pricing-table:after,
.single-pricing-table {
    border-color: #f5f5f5 !important;
}
.single-testimonial:before,
.single-testimonial {
    border-color: rgba(0,0,0,.05) !important;
}
.nav-links span.page-numbers:hover,
.nav-links a.page-numbers:hover,
.nav-links span.page-numbers.current,
.banner-area .owl-dots button.active,
.video-btn a:before {
    border-color: #1C3262 !important;
}
.widget_nav_menu ul li,
.widget_recent_entries ul li {
    border-color: #333 !important;
}
.single-sidebar-widget.widget_archive ul li,
.single-sidebar-widget.widget_categories ul li,
.single-sidebar-widget.widget_nav_menu ul li,
.single-sidebar-widget.widget_recent_entries ul li {
    border-color: #e8e8e8 !important;
}
.nav-links span.page-numbers,
.nav-links a.page-numbers {
    border-color: #ccc !important;
}

/* BOOTSTRAP */

.form-control:focus {
	border-color: #1C3262;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(254, 199, 49, 0.6);
}

/* RESPONSIVE */

@media only screen and (max-width: 991px) {
    
    .site-header {
        background-color: #222 !important;
    }

}

/*
* ---------------------------------------------------------------------------
* 03. SITE HEADER / .site-header
* ---------------------------------------------------------------------------
*/

.site-header {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 5;
    transition: all 0.5s ease;
}
.fixed-menu {
    position: fixed;
}
.main-logo a {
    display: inline-block;
    margin: 0px 0;
}

/* MAIN MENU */

.main-menu ul {
    text-align: right;
}
.main-menu ul li {
    display: inline-block;
}
.main-menu ul li a {
    font-size: 16px;
    text-transform: capitalize;
    padding: 0 10px;
    margin: 30px 0;
}
.main-menu ul li a:focus,
.main-menu ul li a:hover {
    background-color: transparent;
}

/* MOBILE MENU */


.mobile-menu .slicknav_btn {
    margin: 16px 0;
}
.mobile-menu .slicknav_menutxt {
   font-weight: 400;
}
.mobile-menu .slicknav_menu {
    background-color: transparent;
    padding: 0;
}
.mobile-menu .slicknav_nav {
    background-color: transparent;
}
.mobile-menu .slicknav_nav ul {
    margin-left: 0;
}
.mobile-menu .slicknav_nav ul li a {
    margin: 2px 0;
    display: inline-block;
}
.mobile-menu .slicknav_nav ul li a:hover {
    background-color: transparent !important;
}
.mobile-menu .slicknav_nav ul li a span {
    display: none;
}
.mobile-menu .slicknav_nav ul li a span.slicknav_arrow {
    display: inline-block;
}
.mobile-menu .slicknav_nav ul ul li a {
    margin: 2px 5px;
}

/*
* ---------------------------------------------------------------------------
* 04. BANNER AREA / .banner-area
* ---------------------------------------------------------------------------
*/

.single-banner {
    position: relative;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}
.single-banner:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
}
.single-banner-con {
    height: 768px;
    position: relative;
    z-index: 2;
}
.single-banner-txt {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
}
.single-banner-txt h1 {
    font-size: 72px;
    margin-bottom: 20px;
    text-transform: capitalize;
}
.single-banner-txt p {
    font-size: 18px;
}
.single-banner-txt a {
    margin-top: 50px;
}

.itembg {
    display: none;
}

/* Slider navigation */

.banner-area .owl-nav .owl-prev,
.banner-area .owl-nav .owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    perspective: 1000px;
    text-align: center;
    overflow: hidden;
}
.banner-area .owl-nav .owl-prev {
    left: 1%;
}
.banner-area .owl-nav .owl-next {
    right: 1%;
}
.banner-area .owl-nav .owl-prev i,
.banner-area .owl-nav .owl-next i {
    line-height: 70px;
    width: 70px;
    position: relative;
    z-index: 2;
    font-size: 20px;
    border-radius: 50%;
    border-style: solid;
    border-width: 2px;
}
.banner-area .owl-nav .owl-prev i {
    float: left;
}
.banner-area .owl-nav .owl-next i {
    float: right;
}
.banner-area .owl-nav .owl-next .itemnextbg,
.banner-area .owl-nav .owl-prev .itemprebg {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    border-radius: 50%;
    display: inline-block;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
    transition: all 0.5s ease-in-out;
    transform: scale(0);
}
.banner-area .owl-nav .owl-next .itemnextbg {
    float: left;
}
.banner-area .owl-nav .owl-prev .itemprebg {
    float: right;
}
.banner-area .owl-nav .owl-next:hover .itemnextbg,
.banner-area .owl-nav .owl-prev:hover .itemprebg {
    transform: scale(1);
}

/* Slide dots */

.banner-area .owl-dots {
    position: absolute;
    bottom: 5%;
    left: 0;
    width: 100%;
    z-index: 2;
    text-align: center;
}
.banner-area .owl-dots button.owl-dot {
    height: 70px;
    width: 70px;
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
    cursor: pointer;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
    border-width: 2px;
    border-style: solid;
}

/*
* ---------------------------------------------------------------------------
* 05. ABOUT AREA / .about-area
* ---------------------------------------------------------------------------
*/

.about-area {
    position: relative;
}
.about-thumb {
    margin-top: 50px;
}
.about-single-feature {
    margin-top: 50px;
}
.about-single-feature i {
    font-size: 30px;
    line-height: 70px;
    width: 70px;
    text-align: center;
    border-radius: 50%;
}
.about-single-feature h3 {
    margin-top: 20px;
}
.about-single-feature p {
    margin-bottom: 0;
    margin-top: 15px;
}

/*
* ---------------------------------------------------------------------------
* 06. PORTFOLIO AREA / .portfolio-area
* ---------------------------------------------------------------------------
*/

.portfolio-menu {
    margin-top: 50px;
}
.portfolio-menu button {
    background-color: transparent;
    border: none;
    font-size: 16px;
}
.portfolio-menu button.active-port {
    font-weight: 600;
}
.single-portfolios {
    margin-top: 30px;
}
.port-con {
    position: relative;
    overflow: hidden;
}
.port-con:hover .port-overlay {
    transform: rotate(45deg) scale(3,2);
    visibility: visible;
}
.port-con:hover .port-txt {
    opacity: 1;
    visibility: visible;
}
.port-txt {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    z-index: 2;
    transition: all 0.5s ease-in-out;
    visibility: hidden;
    opacity: 0;
}
.port-txt ul {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
}
.port-txt ul li {
    list-style-type: none;
    display: inline-block;
}
.port-txt ul li a {
    display: block;
}
.port-txt ul li a i {
    line-height: 50px;
    font-size: 18px;
    width: 50px;
    border-width: 1px;
    border-style: solid;
    border-radius: 50%;
    margin: 0 2.5px;
}
.port-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    transform: rotate(45deg) scale(0,2);
    transition: all 0.3s ease-in-out;
    visibility: hidden;
}

/*
* ---------------------------------------------------------------------------
* 07. FUN FACT AREA / .fun-fact-area
* ---------------------------------------------------------------------------
*/

.fun-fact-area {
    padding: 70px 0 100px;
}
.single-fact {
    position: relative;
    z-index: 2;
    text-transform: uppercase;
    margin-top: 30px;
    font-weight: 700;
}
.single-fact i {
    font-size: 30px;
    margin-right: 10px;
    border-radius: 50%;
    line-height: 100px;
    width: 100px;
    text-align: center;
}
.single-fact h2 {
    margin-bottom: 15px;
    margin-top: 13px;
    font-weight: 400;
}

/*
* ---------------------------------------------------------------------------
* 08. OUR SKILLS AREA / .our-skills-area
* ---------------------------------------------------------------------------
*/

.single-skill {
    margin-top: 50px;
    text-transform: uppercase;
    text-align: center;
}
.single-skill h3 {
    margin-top: 25px;
}

/*
* ---------------------------------------------------------------------------
* 09. OUR TEAM AREA / .our-team-area
* ---------------------------------------------------------------------------
*/

.single-team-member {
    margin-top: 50px;
    position: relative;
    perspective: 1000px;
    overflow: hidden;
}
.single-team-member:hover .single-team-con {
    transform: rotateY(0);
    visibility: visible;
}
.single-team-thumb img {
    width: 100%;
}
.single-team-con {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 70%;
    transition: all 0.5s ease-in-out;
    transform: rotateY(97deg);
    transform-origin: left;
    visibility: hidden;
}
.single-team-txt {
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
}
.single-team-txt ul li {
    list-style-type: none;
    display: inline-block;
}
.single-team-txt ul li a {
    display: block;
}
.single-team-txt ul li i {
    line-height: 50px;
    width: 50px;
    border-radius: 50%;
    border-width: 1px;
    border-style: solid;
    font-size: 16px;
}
.single-team-txt h3 {
    margin-top: 20px;
}
.single-team-txt h3 span {
    display: block;
    font-size: 18px;
    margin-top: 5px;
}

/*
* ---------------------------------------------------------------------------
* 10. VIDEO AREA / .video-area
* ---------------------------------------------------------------------------
*/

.video-btn {
    position: relative;
    z-index: 2;
    text-align: center;
}
.video-btn a {
    height: 100px;
    width: 100px;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    z-index: 2;
}
.video-btn a:before {
    content: '';
    position: absolute;
    border-width: 6px;
    border-style: solid;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    animation-duration: 1s;
    border-radius: 50%;
}
.video-btn a i {
    font-size: 40px;
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%);
}

/* Ripple Out */

@keyframes tem-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}
.video-btn a:hover:before,
.video-btn a:focus:before,
.video-btn a:active:before {
    animation-name: tem-ripple-out;
}

/*
* ---------------------------------------------------------------------------
* 11. PRICING TABLE AREA / .pricing-table-area
* ---------------------------------------------------------------------------
*/

.single-pricing-table {
    margin: 50px 8px 0;
    text-align: center;
    padding: 2% 0 15px;
    border-width: 1px;
    border-style: solid;
    position: relative;
}
.single-pricing-table:after {
    content: '';
    position: absolute;
    left: -8px;
    top: 7px;
    height: calc(100% - 14px);
    width: calc(100% + 16px);
    border-width: 1px;
    border-style: solid;
    z-index: -1;
}
.single-pricing-hdr {
    padding: 30px 0;
}
.single-pricing-hdr i {
    line-height: 100px;
    width: 100px;
    text-align: center;
    border-radius: 50%;
    font-size: 30px;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
}
.single-pricing-hdr h4 {
    margin-top: 15px;
    font-size: 24px;
}
.single-pricing-hdr h3 {
    margin-top: 5px;
    font-size: 40px;
}
.single-pricing-hdr span {
    display: block;
    margin-top: 5px;
}
.single-pricing-body ul {
    padding: 30px 20px;
}
.single-pricing-body ul li {
    list-style-type: none;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    padding: 10px 0;
    text-transform: capitalize;
}
.single-pricing-body ul li:last-child {
    border-bottom: 0;
}

/*
* ---------------------------------------------------------------------------
* 12. TESIMONIAL AREA / .testimonial-area
* ---------------------------------------------------------------------------
*/

.single-testimonial {
    margin-top: 50px;
    margin-bottom: 8px;
    padding: 50px;
    border-width: 2px;
    border-style: solid;
    position: relative;
}
.single-testimonial:before {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 55px;
    display: block;
    width: 14px;
    height: 14px;
    border-width: 2px;
    border-style: solid;
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}
.single-testimonial-txt {
    position: relative;
    padding: 10px 20px;
}
.single-testimonial-txt:after,
.single-testimonial-txt:before {
    font-family: FontAwesome;
    position: absolute;
}
.single-testimonial-txt:after{
    content: "\f10d";
    left: 0;
    top: 0;
}
.single-testimonial-txt:before {
    content: "\f10e";
    right: 0;
    bottom: 0;
}
.single-testimonial-author {
    margin-top: 30px;
}
.single-testimonial-author img {
    border-radius: 50%;
}
.single-testimonial-author h4 {
    margin-top: 15px;
    font-weight: 600;
}

/*
* ---------------------------------------------------------------------------
* 13. BRAND AREA / .brand-area
* ---------------------------------------------------------------------------
*/

.brand-carousel {
    position: relative;
    z-index: 2;
}
.single-brand {
    text-align: center;
    padding: 15px 0;
}
.single-brand a {
    display: inline-block;
}

/*
* ---------------------------------------------------------------------------
* 14. BLOG AREA / .blog-area
* ---------------------------------------------------------------------------
*/

.single-home-blog {
    margin-top: 50px;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
}
.single-home-blog:hover .home-blog-overlay {
    transform: rotate(45deg) scale(1.5,2);
    visibility: visible;
}
.single-home-blog:hover .home-blog-overlay-link {
    opacity: 1;
    visibility: visible;
}
.home-blog-thumb {
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}
.home-blog-overlay {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    transform: rotate(45deg) scale(0,2);
    transition: all 0.3s ease-in-out;
    visibility: hidden;
    z-index: 1;
}
.home-blog-overlay-link {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    text-align: center;
    transform: translate(-50%, -50%);
    transition: all 0.5s ease-in-out;
    visibility: hidden;
    opacity: 0;
}
.home-blog-overlay-link a {
    display: block;
    height: 50px;
    width: 50px;
    border-style: solid;
    border-width: 1px;
    border-radius: 50%;
}
.home-blog-overlay-link a i {
    line-height: 50px;
}
.home-blog-thumb img {
    width: 100%;
}
.home-blog-con {
    padding: 015px;
}
.home-blog-title {
    margin-bottom: 10px;
    text-transform: capitalize;
}
.home-blog-date {
    margin-bottom: 10px;
    font-weight: 600;
}
.home-blog-read-btn a {
    text-transform: uppercase;
}
.home-blog-view-btn {
    margin-top: 80px;
    text-align: center;
}

/* BLOG PAGE AREA */

.blog-page-area {
    padding: 50px 0 100px;
}
ul.entry-meta {
    margin-bottom: 10px;}
ul.entry-meta li {
    display: inline-block;
    list-style-type: none;
    margin-right: 15px;
    padding-top: 5px;
    text-transform: capitalize;
    position: relative;
}
ul.entry-meta li:after {
    content: '';
    position: absolute;
    height: 90%;
    width: 1px;
    top: 10%;
    right: -10px;
    transform: rotate(15deg);
}
ul.entry-meta li:last-child:after {
    display: none;
}
ul.entry-meta li a {
    margin-left: 3px;
    display: inline-block;
}

/* BLOG PAGINATION */

.navigation.pagination {
    display: block;
    padding: 50px 0 0;
    margin: 0;
}
.nav-links .page-numbers {
    display: inline-block;
    margin: 10px 5px 0;
    font-weight: 700;
}
.nav-links span.page-numbers,
.nav-links a.page-numbers {
    font-size: 21px;
    padding: 5px 13px;
    border-width: 1px;
    border-style: solid;
}
.nav-links span.page-numbers.dots {
    border: none;
}

/* BLOG SINGLE PAGE */

/* COMMENTS AREA  */

.comments-area {
    margin-top: 60px;
}
.comment-reply-title,
.comments-title {
    position: relative;
    padding-bottom: 10px;
}
.comment-reply-title:after,
.comments-title:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50px;
    height: 2px;
}
.comment-list ol,
.comment-list {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.single-comment {
    margin-top: 40px;
}
.single-comment img.media-object {
    border-radius: 50%;
    height: 100px;
}
.comment-heading {
    margin-bottom: 10px;
}
.comment-text {
    margin-bottom: 10px;
}
.comment-respond {
    margin-top: 60px;
}
.comment-notes {
    margin-top: 15px;
    margin-bottom: 0;
}
.comment-form {
    margin-top: 20px;
}
.comment-form .form-group {
    margin-bottom: 20px;
}
.comment-form label {
    text-transform: uppercase;
}
.comment-btn {
    padding-top: 10px;
}

/* SIDEBAR WIDGET */

.single-sidebar-widget {
    margin-top: 50px;
}
.sidebar-widget-title {
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 10px;
}
.sidebar-widget-title:after {
    content: '';
    position: absolute;
    width: 50px;
    height: 2px;
    left: 0;
    bottom: 0;
}
.single-sidebar-widget ul li {
    list-style-type: none;
}

/*
* ---------------------------------------------------------------------------
* 15. CONTACT AREA / .contact-area
* ---------------------------------------------------------------------------
*/

.contact-single-info {
    margin-top: 50px;
    text-align: center;
}
.contact-single-info i {
    margin-bottom: 8px;
    width: 45px;
    line-height: 45px;
    text-align: center;
    border-radius: 50%;
    font-size: 18px;
}
.contact-single-info span {
    display: block;
    font-size: 16px;
}
.contact-single-info span a {
    display: inline-block;
}
.contact-form {
    margin-top: 50px;
}

/*
* ---------------------------------------------------------------------------
* 16. MAP AREA / .map-area
* ---------------------------------------------------------------------------
*/

.map-area {
    height: 350px;
    width: 100%;
}

/*
* ---------------------------------------------------------------------------
* 17. SITE FOOTER / .site-footer
* ---------------------------------------------------------------------------
*/

.footer-top {
    padding: 50px 0 100px;
}

/* WIDGET STYLE */

.single-footer-widget {
    margin-top: 50px;
}
.footer-widget-title {
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 10px;
}
.footer-widget-title:after {
    content: '';
    position: absolute;
    width: 50px;
    height: 2px;
    left: 0;
    bottom: 0;
}
.single-footer-widget ul li {
    list-style-type: none;
}
.widget_archive ul li,
.widget_categories ul li,
.widget_nav_menu ul li,
.widget_recent_entries ul li {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}
.widget_archive ul li:last-child,
.widget_categories ul li:last-child,
.widget_nav_menu ul li:last-child,
.widget_recent_entries ul li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}
.widget_categories ul li a,
.widget_nav_menu ul li a {
    text-transform: capitalize;
}
.widget_recent_entries ul li span {
    display: block;
    margin-top: 5px;
    font-weight: 600;
}
.widget_recent_entries ul li span:before {
    content: "\f073";
    font-family: FontAwesome;
    margin-right: 5px;
}
.tagcloud a {
    display: inline-block;
    padding: 5px;
    font-size: 12px;
    margin-right: 2px;
    margin-bottom: 6px;
    text-transform: uppercase;
}
.footer-bottom {
    padding: 20px 0;
}
.copyright-txt {
    padding: 9px 0;
}
.footer-social-links {
    text-align: right;
}
.footer-social-links li {
    list-style-type: none;
    display: inline-block;
}
.footer-social-links li a {
    display: block;
    height: 40px;
    width: 40px;
    text-align: center;
    border-radius: 50%;
}
.footer-social-links li a i {
    line-height: 40px;
}

/*
* ---------------------------------------------------------------------------
* 18. PAGE BANNER / .page-banner
* ---------------------------------------------------------------------------
*/

.page-banner {
    padding: 410px 0 72px;
}
.page-banner-con {
    position: relative;
    z-index: 2;
    display: inline-block;
    padding: 20px 180px 20px 20px;
}
.page-banner-con h2 {
    position: relative;
    margin-bottom: 10px;
    padding-bottom: 10px;
}
.page-banner-con h2:after {
    content: '';
    position: absolute;
    width: 50px;
    height: 2px;
    left: 0;
    bottom: 0;
}
.tem-breadcrumb li {
    list-style-type: none;
    display: inline-block;
    text-transform: capitalize;
    font-size: 16px;
}
.tem-breadcrumb li a {
    margin-right: 5px;
    display: block;
    position: relative;
}
.tem-breadcrumb li a:after {
    content: '\f105';
    font-family: FontAwesome;
    padding-left: 10px;
}

.single-pricing-body {
    padding: 15px 15px 0 15px;
}

#careers a {
    float: right;
    margin-top: 50px;
}

#contact form {
    margin-top: 50px;
}