/* --------------------------------- */
/* Css Styles                        */
/*---------------------------------- */

/**
	Mat - vCard Template
	Author : Tavonline
	Copyright 2017

/* Table of Content
==================================================
	
	1. Body and Core Css
	2. Profile Section
	3. Navigation
	4. Home Section
	5. Resume Section
    6. Portfolio Section
    7. Blog Section
    8. Testimonial Section
    9. Contact Section
    10. Footer Section
    11. Realtor Portfolio 
    12. Photo Gallery Widgets
    13. Table Widget
    14. Pricing Widget
    15. Events Widget
    16. Discography Widget
    17. Responsive

/*------------------------ 1 Body and Core Css ------------------------*/		


.portfolio img.item{
    width: 100%;
}

body{
    font-family: 'Roboto', sans-serif;
    background:#fafafa;
    overflow-x: hidden;
    position: relative;
}

.geometric-shapes{
    position: absolute;
    width: 100%;
}

html{
	height: 100%;
}

/* Typography */

hr{
    width: 100%;
    background: #efefef;
}

.blog-title{
    font-size: 26px;
    font-weight: bold;
    line-height: 30px;
}

.page-title i{
    font-size: 18px;
    color: #d2d2d2;
}

.timeline-title{
    font-size: 18px;
    font-weight: 500;
    margin-left: 25px;
    line-height: 30px;
}

.section-title{
    position: relative;
    display: inline-block;    
    padding: 0 3px;
}

.section-title h1, .section-title h2, .section-title h3, .section-title h4 ,.section-title h5{
    font-size: 18px;
    font-weight: 600;
    position: relative;
}

.section-title span{
    position: absolute;
    height: 7px;
    width: 100%;
    bottom: 0;
    opacity: 0.4;    
    left:0;
}

.site-btn{
    font-size: 14px;
    font-weight: 500;
    border: 0;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    padding: 1px 29px;
    line-height: 35px;
}

.site-btn.black{
    background: #000 !important;
}

.cbp-l-loadMore-link.site-btn{
    font-family: 'Roboto', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border: 0 !important;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    padding: 1px 29px !important;
    line-height: 35px !important;
}

.site-btn:hover{
   transition: all ease 0.3s;   
}

.site-btn.icon{
    text-align: left;
    padding: 1px 6px 1px 19px;
}

.site-btn.icon i{
    color: #000;
    background: #fff;
    margin-left: 15px;
    border-radius: 50px;
    font-size: 11px;
    height: 27px;
    width: 27px;
    float: right;
    text-align: center;
    line-height: 29px;    
    margin-top: 4px;
}

#content{
    background: #fff;
    box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
    -webkit-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
    -moz-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
}


p{
    font-size: 13px;
    color: #4c4c4c;
    line-height: 24px;
 }

.little-text{
    color: #989898;
    font-weight: 400;
    line-height: 18px;
}

blockquote {
    font-weight: 600;
    font-size: 18px;
    line-height: 30px;
}

h1{
    font-size: 50px;
    font-weight: 500;  
}

h2{
    font-size: 43px;
    font-weight: 500;
}

h3{
    font-size: 37px;
    font-weight: 500;  
}

h4{
    font-size: 32px;
    font-weight: 500;
}

h5{
    font-size: 26px;
    font-weight: 500;
}

h6{
    font-size: 20px;
    font-weight: 500;
}


/* Margins & Paddings */

.top_15{
    margin-top: 15px;
}

.top_30{
    margin-top: 30px;
}

.top_45{
    margin-top: 45px;
}

.top_60{
    margin-top: 60px;
}

.top_90{
    margin-top: 90px;
}

.top_120{
    margin-top: 120px;
}

.padding_30{
   padding-top: 30px; 
}

.padding_45{
   padding-top: 45px; 
}

.padding_50{
   padding-top: 50px; 
}

.padding_60{
   padding-top: 60px; 
}

.padding_90{
   padding-top: 90px; 
}

.bottom_15{
    margin-bottom: 15px;
}

.bottom_30{
    margin-bottom: 30px;
}

.bottom_45{
    margin-bottom: 45px;
}

.bottom_60{
    margin-bottom: 60px;
}

.bottom_90{
    margin-bottom: 90px;
}

.bottom_120{
    margin-bottom: 120px;
}

.padbot_15{
    padding-bottom: 15px;
}

.padbot_30{
    padding-bottom: 30px;
}

.padbot_45{
    padding-bottom: 45px;
}

.padbot_50{
    padding-bottom: 50px;
}

.padbot_60{
    padding-bottom: 60px;
}


/*Spinner*/

#preloader {
    background-color:#fff;
    position: fixed;
    top:0;
    left:0;
    width: 100%;
    height: 100%; 
    z-index: 1000;
    display:table;
    text-align: center;
}

@keyframes spinner {
  to {transform: rotate(360deg);}
}
 
.spinner:before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 60px;
    margin-top: -30px;
    margin-left: -30px;
    border-radius: 50%;
    border: 1px solid #ccc;
    animation: spinner .6s linear infinite;
}

.spinner:after{
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    margin-top: -25px;
    margin-left: -25px;
    border-radius: 50px;
    background: url(../images/spinner.jpg) center center;
}

/*------------------------ 2 Profile Section ------------------------*/

.profile{
    background: #fff;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -o-border-radius: 6px;
    width: 100%;
    display: inline-block;    
    box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
    -webkit-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
    -moz-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
}

.profile-name{
    line-height: 18px;
    padding: 20px;
}

.profile .name{
    text-transform: uppercase;
    font-size: 17px;
    font-weight: bold;
}

.profile .job{
    font-size: 13px;
    color: #777777;
}

.profile-image {
    margin-top: -18px;
    -webkit-clip-path: polygon(0 9%, 100% 0, 100% 94%, 0% 100%);
    clip-path: polygon(0 9%, 100% 0, 100% 94%, 0% 100%);
}

.profile-image img{
    width: 100%;
}

ul.profile-information{
    list-style: none;
    margin: 8px 0px 8px 35px;
}

ul.profile-information li{
    border-left: solid 2px #eee;
    padding: 0 0 23px 20px;
    font-size: 14px;
    color: #787878;
}

ul.profile-information li p{
    font-size: 13.5px;
    color: #7F7F7F;
    line-height: 12px;
}

ul.profile-information li:last-child{
    border: 0;
    margin-left: 2px;
    margin-top: -2px;
}

ul.profile-information li:before{
    content: "";
    border: solid 2px;
    width: 8px;
    height: 8px;
    border-radius: 50px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    font-size: 8px;
    margin-left: -25px;
    margin-top: 2px;
    font-weight: 400;
    background: #fff;
    display: block;
    position: absolute;
}

ul.profile-information li span{
    color: #000;
}


ul.profile-information li:first-child{
    padding-bottom: 10px;    
    padding-left: 30px;
    position: relative;
}

ul.profile-information li:first-child img {
    margin: -44px -44px;
    display: inline-block;
    position: absolute;
    width: 25px;
}

ul.profile-information li:first-child:before{
    /*content: '\f2c0';
    font-family: FontAwesome;
    font-size: 13.5px;*/
    margin-left: -51px;
    margin-top: -30px;
    margin-bottom: 20px;
    position: relative;
    border: 0;
    width: 40px;
    height: 40px;
    padding: 11px 14px;
  box-shadow: 0px 2px 32px 0px rgba(4, 123, 248, 0.3);
}



.profile .site-btn{
    margin: 18px auto 30px;
    display: block;
}


/*------------------------ 3 Navigation ------------------------*/

header nav{
    background: #fff;
    display: inline-block;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    height: 70px;
    width: 100%;
    margin-bottom: 30px;
    line-height: 70px;
    box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
    -webkit-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
    -moz-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.07);
}

header nav ul li{
    float: left;
}

header nav ul li a{
    font-size: 14px;
    font-weight: bold;
    color: #000;
    padding: 0 10px;
    line-height: 73px;
    display: block;
}

header nav ul li a:hover{
    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;   
}

header nav ul li a:after{
    border-right: 1px solid #dfdfdf;
}

header nav a.home-btn{
    color: #fff;
    border-radius: 6px 0 0 6px;
    -webkit-border-radius: 6px 0 0 6px;
    -moz-border-radius: 6px 0 0 6px;
    padding: 0px 24px;
    float: left;
    height: 70px;
    line-height: 70px;
    margin-right: 10px;
    transition: all ease 0.4s;    
    line-height: 77px;
}

header nav a.home-btn:hover{
    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
}

header nav a.home-btn i{
    font-size: 21px;
}

header nav .site-btn{
    margin: 18px 18px 0 5px;  
}

.social-icons a {
    color: #000;
    font-size: 12px;
    transition: all ease 0.2s;
    width: 24px;
    height: 18px;
    display: inline-block;
}


.social-icons a:hover {
    font-size: 14px;
}

.fb:hover{
    color: #3b5998!important;
    transition: all ease 0.2s;
}

.tw:hover{
    color: #55acee!important;
    transition: all ease 0.2s;
}

.ins:hover{
    color: #cd486b!important;
    transition: all ease 0.2s;
}

.bh:hover{
    color: #1769ff!important;
    transition: all ease 0.2s;
}

.dr:hover{
    color: #ea4c89!important;
    transition: all ease 0.2s;
}

header nav .menuout{
    z-index: 10
}

header nav .menuout{
    display: none;
} 

/*------------------------ 4 Home Section ------------------------*/

#content{
    min-height: 500px;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    padding: 15px;
}

section{
    padding-left: 30px !important;
    padding-right: 30px !important;
}

section.line{
    border-bottom: solid 1px #efefef;
}

section:last-child{
    border:0;
}

section.graybg{
    background: #fafafa;
}

.services .service span.title{
    font-size: 14px;
    font-weight: 500;
    line-height: 30px;
}

.clients .client{
    background: #fff;
    padding: 18px;
    border-radius: 8px;
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    width: 100%;    
    padding: 26px 16px;
}
/*
.clients .col-md-3:nth-child(2) .client {
    padding: 23px 18px;
}*/


.clients .client img {
    width: 100%;
}

.service .icon i:before {
    font-size: 44px;
    margin-left: 0;
}

.service{
    background: #fff;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    padding: 20px;
   box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
   min-height: 186px;
}

/*------------------------ 5 Resume Section ------------------------*/

ul.timeline{
    margin-left: 10px;
}

.timeline li{
    border-left: solid 2px #ececec;
    list-style: none;
    padding: 0 0 40px 30px;
}

.timeline li:before{
    content: "";
    border: solid 2px;
    width: 8px;
    height: 8px;
    border-radius: 50px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    font-size: 8px;
    margin-left: -35px;
    font-weight: 400;
    background: #fff;
    display: block;
    position: absolute;
    margin-top: -1px;
}

.timeline li .line-title{
    font-size: 16px;
    line-height: 6px;
}

.timeline li:first-child{
    padding: 0 0 60px 19px;
}

.timeline li:first-child:before{
    border: 0;
    background: none;
    position: relative;
}

.timeline li:first-child i{
    float: left;
    margin-left: -30px;
    padding: 18px 16px;
    border-radius: 30px;
    margin: -13px -45px;
    background: #fff;
    width: 53px;
    text-align: center;
}

.timeline li .section-title{
    padding-left: 20px;
}

.timeline li span {
    font-size: 12px;
    padding: 9px 0;
    display: block;
}

.timeline li:last-child{
    border: 0;
    margin-left: 2px;
}

/* Skills */

.skill-list li {
    list-style: none;
}

.skill-list h3 {
    font-size: 12px;
}

.skill-list .progress {
    margin: 10px 0 20px;
    display: block;
    height: 5px;
    position: relative;
    width: 100%;
    overflow: visible;
    border-radius: 50px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
    background: #dfdfdf;
    box-shadow: 0;
}

.skill-list .progress .percentage {
    border-radius: 50px 0 0 50px;
    -moz-border-radius: 50px 0 0 50px;
    -webkit-border-radius: 50px 0 0 50px;
    -ms-border-radius: 50px 0 0 50px;
    -o-border-radius: 50px 0 0 50px;
    bottom: 0;
    position: absolute;
    top: 0;
}


/*------------------------ 6 Portfolio Section ------------------------*/


#portfolio .cbp-item{
    padding: 15px !important;
}

#portfolio section {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

#portfolio .cbp-item-wrapper {
    border-radius: 6px;
    -webkit-border-radius:6px;
    -moz-border-radius: 6px;
    display: inline-block;
    overflow: hidden;
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -webkit-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -moz-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
/*    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;*/
}

.content-header{
    z-index: 5;
}

#portfolio .cbp-item-wrapper:hover {
    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    box-shadow: 0px 0px 20px 0px rgba(4, 6, 4, 0.08);
    -webkit-box-shadow: 0px 0px 20px 0px rgba(4, 6, 4, 0.08);
    -moz-box-shadow: 0px 0px 20px 0px rgba(4, 6, 4, 0.08);
}

#portfolio .cbp-item figure img, .work figure{
    width: 100%;
}

#portfolio .cbp-item figcaption .title{
    font-size: 14px;
    color: #000;
}

#portfolio .cbp-item figcaption{
    padding: 14px;
}

#portfolio .cbp-item figcaption .info{
    font-size: 13px;
    color: #989898;
    line-height: 18px;
    display: block;
} 

#portfolio #filters-container .cbp-filter-item{
    font-size: 14px;
    color: #787878;
    cursor: pointer;
    float: left;
    margin-right: 15px;
}

#portfolio .cbp-item:hover figure .icon{
    opacity: 0.9;
    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    transform: translate(0,-25px);
    -webkit-transform: translate(0,-25px);
    -moz-transform: translate(0,-25px);
}


#portfolio .cbp-item figure .icon {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    opacity: 0;
    display: table-cell;
    vertical-align: middle;
    top: 50%;
    margin-top: -20px;
    transition: all ease 0.3s;
}

#portfolio .cbp-item figure .icon i{
    color: #fff;
    padding: 17px 0 16px;
    min-width: 50px;
    border-radius: 50px;
    text-align: center;
    transition: all ease 0.3s;
    text-align: center;
    background: rgba(3, 122, 249, 0.80);
}

#portfolio .cbp-item figure .icon i:before{
    font-size: 18px;
}


/* portfolio content */

.portfolio-content figure img{
    width: 100%;
    border-radius: 5px; 
}

.cbp-popup-singlePage .cbp-popup-close{
        background: url(../images/sprite.png) -74px -3px no-repeat scroll transparent !important;
}

.cbp-popup-singlePage .cbp-popup-prev {
    background: url(../images/sprite.png) -23px -3px no-repeat scroll transparent !important;
}

.cbp-popup-singlePage .cbp-popup-next {
    background: url(../images/sprite.png) -127px -3px no-repeat scroll transparent !important;
}


.cbp-popup-singlePage .cbp-popup-close:hover{
        background: url(../images/sprite.png) -74px -46px no-repeat scroll transparent !important;
}

.cbp-popup-singlePage .cbp-popup-prev:hover {
    background: url(../images/sprite.png) -23px -46px no-repeat scroll transparent !important;
}

.cbp-popup-singlePage .cbp-popup-next:hover {
    background: url(../images/sprite.png) -127px -46px no-repeat scroll transparent !important;
}

.cbp-popup-singlePage .cbp-popup-navigation-wrap {
    background-color: #fff;
    box-shadow: -5px 10px 12px -10px rgba(201,201,201,0.30);
}

.cbp-popup-singlePage-counter {
    color: #c1c1c1;
}

.social-share ul{
    list-style: none;
    display: inline-block;
}

.social-share ul li{
    list-style: none;
    float: left;
    margin-right: 10px;
}

.social-share ul li a{
    color:#b6b6b6; 
}

.social-share ul li a:hover{
    color:#000; 
    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
}

.cbp-slider .cbp-nav-next:after, .cbp-slider .cbp-nav-prev:after{
    width: 34px;
    height: 34px;
    background-size: 109px 140px;
    background-position: -35px -71px;
}

.cbp-slider .cbp-nav-prev:after{
    background-position: 0px -71px;
}

.cbp-slider .cbp-nav-next:after:hover, .cbp-slider .cbp-nav-prev:after:hover{
    width: 34px;
    height: 34px;
    background-size: 109px 140px;
    background-position: -35px -71px;
    opacity: 0.3;
    transition: all ease 0.3s;
}

.cbp-slider .cbp-nav-next:after{
    background-position: -35px -71px; 
}

.cbp-slider .cbp-nav-prev:hover:after{
    background-position: 0px -71px;
}

.cbp-slider .cbp-nav-next:hover:after{
    background-position: -35px -71px; 
}

.mat-slider{
    border-radius: 6px;
    overflow: hidden;
}

.port-item{
    margin-bottom: 30px;
    display: block;
}

/*------------------------ 7 Blog Section ------------------------*/

#blog .cbp-item{
    padding: 15px !important;
}

#blog section {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

#blog a.blog-box{
    cursor: pointer;
    display: inline-block;   
    border-radius: 6px;
    -webkit-border-radius:6px;
    -moz-border-radius: 6px;
    overflow: hidden;
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -webkit-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -moz-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
}

#blog a.blog-box:hover{
    box-shadow: 0px 0px 8px 0px rgba(4, 6, 4, 0.08);
    transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
}

#blog a.blog-box .blog-img{
    position: relative;
}

#blog a.blog-box .blog-box-info{
    padding: 15px;
}
#blog a.blog-box .blog-box-info .little-text{
    padding: 5px 0;
}

#blog .blog-box .date span:last-child{
    opacity: 0.6;
}

#blog .blog-box span.category{
    font-size: 13px;
    color: #afafaf;
}

#blog .blog-box span.date{
    color: #505050 !important;
    font-size: 11px;
    font-family: arial;
}

#blog .blog-box .title{
    font-size: 15px;
    color: #000;
    line-height: 20px;
    padding: 2px 0 4px;
}

/*Blog Detail Page */

#blog-post{
    padding: 30px 15px;
}

#blog-post .post .blog-image {
    width: 100%;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    overflow: hidden;
}

#blog-post .post .blog-image img{
    width: 100%;
}

#blog-post .post .blog-iframe iframe{
    width: 100%;
}

#blog-post .post{
    padding-right: 30px;
}

/* Sidebar */

#blog-post .blog-sidebar{
    border-left: solid 1px #efefef;
    padding-left: 30px;
}

#blog-post .blog-sidebar .category ul{
    list-style: none;
}

#blog-post .blog-sidebar .category ul li{
    font-size: 13px;
    color: #3d3d3d;
    border-bottom: solid 1px #efefef;    
    line-height: 35px;
}

#blog-post .blog-sidebar .category ul li a{
    color: #3d3d3d;
}

#blog-post .blog-sidebar .category ul li span{
    float: right;
    color: #8a8a8a;
}

#blog-post .post-list ul li{
    list-style: none;
} 

#blog-post .post-list ul li a{
    border-bottom: solid 1px #efefef;
    display: block;
    padding: 16px 0;
} 

#blog-post .post-list ul li:last-child a{ 
    border:0;
} 

#blog-post .post-list ul li a .info{
    font-size: 12px;
} 

#blog-post .post-list ul li a .info span{
    color: #b4b4b4;
    margin-left: 5px;
}

#blog-post .post-list ul li a p{
    font-size: 13px;
    line-height: 22px;
    color: #000;
}

#blog-post .blog-sidebar .advertisement img{
    width: 100%;
}

#blog-post .post .tags{
    font-size: 12px; 
    border-bottom: solid 1px #efefef;
    border-top: solid 1px #efefef;
    padding: 20px 0;
}

#blog-post .post .tags span{
    margin-right: 7px;
}

#blog-post .post .tags a{
    color: #686969;
    margin-right: 3px;
}

#blog-post .post .post-list ul li a p{
    font-size: 14px;
    padding-top: 5px;
}

#blog-post .post .post-list ul li a{
    padding:25px 0;
}

/* Post Comments */

#blog-post .post-comment ul li{
    list-style: none;
    border-bottom: solid 1px #efefef;
    padding: 30px 0;
}

#blog-post .post-comment ul li:last-child{
    border: 0
}

#blog-post .post-comment ul li .person-img{
    padding-right: 0;
}

#blog-post .post-comment ul li .person-img img{
    width: 100%;
}

#blog-post .post-comment ul li .comment-content .name{
    font-size: 14px;
    font-weight: 500;
}

#blog-post .post-comment ul li .comment-content .date{
    font-size: 11px;
    color: #b0b0b0;
}

#blog-post .post-comment ul li .comment-content p{
    font-size: 13px;
    color: #989898;
    line-height: 20px;
    padding-top: 2px;
}

#blog-post .post-comment ul li .comment-content a{
    font-size: 12px;
    padding-top: 10px;    
    display: block;
}

#blog-post .post-comment ul li .comment-content a i{
    margin-right: 5px;
}

#blog-post .post-comment .reply{
    padding-left: 30px;
}

/* Form */

.site-form .site-input{
    width: 100%;
    height: 45px;
    border: 0;
    color: #000;
    border-bottom: solid 1px #dfdfdf;
    font-size: 13px;
    padding-left: 10px;
    margin-bottom: 15px;
    outline: 0;
}

.site-form .site-area{
    width: 100%;
    border: 0;
    border-bottom: solid 1px #dfdfdf;
    font-size: 13px;
    padding: 20px 0 0 10px;
    min-height: 100px;
    margin-bottom: 15px;
}

.site-form .site-area{
    width: 100%;
    border: 0;
    border-bottom: solid 1px #dfdfdf;
    font-size: 13px;
    padding: 20px 0 0 10px;
    min-height: 100px;
    margin-bottom: 15px;
}

/*------------------------ 8 Testimonial Section ------------------------*/

.testimonials {
    overflow: hidden;
}

.testimonials .comment{
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    width: 100%;
    padding: 15px;    
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}

.testimonials .comment .top-section{
    display: inline-block;
}

.testimonials .comment .top-section figure {
    width: 23%;
    float: left;
    border-radius: 50px;
    overflow: hidden;
}

.testimonials .comment .top-section .name-info {
    width: 68%;
    padding: 8px 12px;
    float: left;
    line-height: 15px;
}

.testimonials .comment .top-section .name-info .name{
    font-size: 14px;
    font-weight: 500;
}

.testimonials .comment .top-section .name-info .job{
    font-size: 12px;
    color: #d0d0d0;
}

.testimonials .comment .top-section figure img{
    width: 100%;
}


.testimonials .comment hr{
    width: 100%;
    margin: 6px 0px 10px;
}

.testimonials p{
    color: #989898;
    font-size: 12.5px;
    line-height: 20px;
}

.owl-carousel .owl-wrapper-outer {
    overflow: inherit;
}

.owl-theme .owl-controls .owl-page span{
    width: 10px;
    height: 10px;    
    margin: 5px 5px;
}

.owl-theme .owl-controls {
    margin-top: 45px;
}

/*------------------------ 9 Contact Section ------------------------*/

.contact-info ul li{
    list-style: none;
    font-size: 14px;
    color: #787878;    
    line-height: 34px;
}

.contact-info ul li span{
    color: #000;
}

.contact-map iframe{
    width: 100%;
}

/*------------------------ 10 Footer ------------------------*/

footer .footer{
    background: #1e1e1e;
    min-height: 70px;
    color: #fff;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    line-height: 72px;
}

footer .footer .name{
    color: #fff;
    font-size: 15px;
}

footer .footer .copyright{
    color: #9c9c9c;
    font-size: 12px;
    text-align: right;
}

footer .footer .copyright a{
    color: #fff;
}

footer .footer .copyright a:hover{
    color: #dfdfdf;
    transition: all ease 0.3s;
}


/*------------------------ 11 Realtor Portfolio ------------------------*/

.featured-properties{
    overflow: hidden;
}

.featured-properties .owl-carousel .item a{
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    display: inline-block;
    overflow: hidden;
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -webkit-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -moz-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
}

.featured-properties .estate figure figcaption{
    padding: 14px;
}

.estate figure .imgout{
    position: relative;
}

.estate figure img{
    width: 100%;
}

.estate figure figcaption .info{
    font-size: 13px;
    color: #989898;
    line-height: 18px;
    display: block;
}

.estate figcaption .title{
    font-size: 14px;
    color: #000;
}

.estate figure .imgout .type{
    font-size: 10px;
    position: absolute;
    top: 0;
    margin: 10px;
    color: #fff;
    padding: 4px 7px;
    background: #00000094;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

.estate figure .imgout .price{
    font-size: 15px;
    position: absolute;
    bottom: 0;
    color: #fff;
    margin: 10px;
    padding: 3px 12px;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

.estate figure figcaption .features{
    font-size: 12.5px;
    border-top: solid 1px #dfdfdf;
    padding: 12px 0 0;
    color: #989898;
    margin-top: 8px;
}

.estate figure figcaption .features span{
    color: #000;
}

/*Realtor Portfolio Detail */

.portfolio-content .namenprice{
    display: inline-block;
    width: 100%;
}

.portfolio-content .features{
    line-height: 34px;
}

.portfolio-content .features .info{
    font-size: 14px;
    color: #989898;
    line-height: 18px;
    display: block;
}

.portfolio-content .features .room{
    font-size: 13px;
    color: #989898;
}

.portfolio-content .features .room span{
    color: #000;
    margin-left: 5px;
}

.portfolio-content .features .room span:first-child{
    margin-left: 0px;
}

.namenprice .price{
    font-size: 26px;
}

.details ul li{
    list-style: none;
    font-size: 13px;
    color: #989898;    
    line-height: 25px;
}

.details ul li span{
    color: #000;
}

.other-features.details ul li{
    color: #000;
}

.other-features.details ul li i{
    color: #52bf00;
}

.map iframe{
    width: 100%;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    overflow: hidden;
  box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
}


/*------------------------ 12 Photo Gallery Widget ------------------------*/

#widget-gallery{
    margin-left: -15px;
}

#widget-gallery .cbp-item img{
    width: 100%;
}

#widget-gallery .cbp-item{
    padding: 15px;
}

#widget-gallery .cbp-item a{
    display: block;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;  
    overflow: hidden;  
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -webkit-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -moz-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
}

#widget-gallery .cbp-item a:hover{ 
    transition: all ease 0.3s;
    box-shadow: 0px 0px 20px 0px rgba(4, 6, 4, 0.20);
    -webkit-box-shadow: 0px 0px 20px 0px rgba(4, 6, 4, 0.20);
    -moz-box-shadow: 0px 0px 20px 0px rgba(4, 6, 4, 0.20);
}



/*------------------------ 13 Table Widget  ------------------------*/

.table-title{
    font-size: 18px;
}

.mat-table thead{    
    font-size: 15px;
    font-weight: 500;
}

.mat-table tbody{
    font-size: 15px;
}


/*------------------------ 14 Pricing ------------------------*/

.mat-price{
    padding-bottom: 30px;
}

.mat-price ul .site-btn{
    margin: 24px auto 0;
    display: block;
}

.mat-price ul{
    padding: 22px 20px 35px;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -webkit-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -moz-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
}

.mat-price ul li{
    font-size: 13px;
    list-style: none;
    text-align: center;
    line-height: 24px;
}

.mat-price ul li:first-child{
    font-size: 18px;
    font-weight: 600;
    border-bottom: 1px solid #dfdfdf;
    padding-bottom: 15px; 
}

.mat-price ul li:nth-child(2){
    font-size: 24px;
    font-weight: 600;
    padding:18px 0 15px;  
}


/*------------------------ 15 Events Widget ------------------------*/

.events ul li{
    list-style: none;
    display: inline-block;
    width: 100%;
}

.events ul li .datenlocation{
    font-size: 12px;
    color: #c1c1c1;
}

.events ul li .event-content{
    font-size: 17px;
    font-weight: 500;
}

.events ul li .site-btn{
    float: right;
}

.events .cbp-l-loadMore-link.site-btn{
    margin-left:auto;
    margin-right:auto;
    display: block;
}


/*------------------------ 16 Discography Widget ------------------------*/

.discography .album-cover img{
    width: 100%;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -webkit-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
    -moz-box-shadow: 0px 0px 48px 0px rgba(4, 6, 4, 0.08);
}

.discography .album-cover .links {
    font-size: 12.5px;
    text-align: center;
    margin-top: 13px;
    color: #c5c5c5;
}

.discography .album-cover .links a{
    color: #c5c5c5;
    margin-right: 3px;
    margin-left: 3px;
}

.discography .album-cover .links a:hover{
    color: #949494;
    transition: all ease 0.3s;
}

.discography .album{
    font-size: 13px;
}

.discography .album ul li:first-child{
    font-size: 25px;
    font-weight: 500;
    line-height: 25px;
    padding-bottom: 18px;
}

.discography .album ul li:first-child span{
    font-size: 13px;
    color: #b0b0b0;
    font-weight: 400;
}

.discography .album ul li{
    list-style: none;
    line-height: 28px;
}


/*------------------------ 17 Responsive ------------------------*/

@media (max-width: 1199px) {
    footer .footer .copyright{
        text-align: center;
    }
}

@media (max-width: 991px) {

    .wrapper.top_60{
        margin-top: 30px;
    }

    .services .service{
        margin-bottom: 30px;
    }

    .code-skills {
        padding-top: 0;
    }

    #content {
        padding-bottom: 45px;
    }

    ul.profile-information li:first-child {
        padding-bottom: 10px;
        padding-left: 30px;
    }

    ul.profile-information {
        list-style: none;
        margin: 0 auto 30px;
        display: table;
    }

    .profile{
        padding-bottom: 30px;
    }

    footer .footer .copyright{
        text-align: center;
    }

    .clients .client{
        margin-bottom: 30px;
    }

    .events ul li .site-btn {
         float: none;
         margin-top: 15px; 
    }

}

@media screen and (max-width: 991px) and (min-width: 769px) {

    header nav{
        margin-top: 30px;
    }

    nav .social-icons{
        display: none;
    }

    nav .hamburger{
        display: none;
    }

} 


@media screen and (max-width: 991px) and (min-width: 576px) {

    .profile .name {
        font-size: 20px;
        margin-top: 11px;
    }

    .profile-image {
        margin-top: -18px;
        -webkit-clip-path: polygon(0 9%, 100% 0, 100% 94%, 0% 100%);
        clip-path: polygon(0 9%, 100% 0, 100% 94%, 0% 100%);
        margin-top: -40px;
    }

}

@media (max-width: 768px) {

    header{
        margin-top: 30px;
    }

    header nav ul{
    }

    header nav ul.tabs li:first-child, header nav .menuout ul.tabs li {
        display: block;
    }

    header nav ul.tabs li {
        display: none;
    }

    header nav .menuout{
        width: 100%;
        position: relative;
    }

    header nav .menuout .menuin{
        width: 100%;
        background: #fff;
        position: absolute;
        z-index: 4;
        margin-top: 25px;
        border-radius: 8px;
        -moz-border-radius: 8px;
        -webkit-border-radius: 8px;
        box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.05);
        -webkit-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.05);
        -moz-box-shadow: 0px 2px 92px 0px rgba(0, 0, 0, 0.05);
    }

    header nav .menuout .menuin ul.tabs li:first-child{
        display: none;
    }

    header nav .menuout .menuin ul.tabs li{
        float: none;
        text-align: center;
        border-bottom: solid 1px #efefef;
    }

    header nav .menuout .menuin ul.tabs li a{
        width: 100%;
        display: block;
        cursor: pointer;
        line-height: 58px;
    }


    header nav .hamburger{
        font-size: 20px;
        margin-right: 23px;
        cursor: pointer;
        line-height: 71px;
        border-left: solid 1px #eaeaea;
        padding-left: 21px;
    }

    header nav .menuout{
        display: block;
    } 

    .social-icons{
        margin-right: 14px;
        line-height: 67px;
    }

    .portfolio-content .namenprice .blog-title{
        width: 100%;
    }

    .portfolio-content .namenprice .price{
        float: left !important;
        margin-top: 14px;
    }

}

@media (max-width: 321px) {

    .social-icons{
        display: none;
    }

    header nav .hamburger{
        border: 0;
    }

    footer .footer {
    line-height: 19px;
    padding-top: 14px;
    }

    .timeline li .line-title {
        line-height: 20px;
    }


}