/*
Author       : Hash Theme.
Template Name: Kalka - One Page Business Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL DESIGN 
    02. START BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME DESIGN
    04. START ABOUT DESIGN
    05. START FEATURES DESIGN
    06. START SERVICE DESIGN
    07. START WORKS DESIGN
    08. START TESTIMONIAL DESIGN
    09. START COUNTER DESIGN
    10. START TEAM DESIGN
    11. START SKILL DESIGN
    12. START PRICING DESIGN
	13. START BLOG DESIGN
	14. START BRANCH DESIGN
	15. START CONTACT DESIGN
	16. START FOOTER DESIGN
	17. START BLOG PAGE DESIGN
	18. START SCROLL TO TOP
	19. ANIMATION & KEYFRAMES 
	
	=============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01. GENERAL DESIGN
*/

body {
	font-family: 'Cousine', sans-serif;
	color: #666;
	line-height: 1.5em;
	overflow-x: hidden;
	margin: auto;
	background: #fff;
}
html,
body {
    height: 100%
}
h1,
h2,
h3,
h4,
h5,
h6 {
	color: #337ab7;
	font-family: Calibri;
	font-weight: 500;
	text-align: center;
}
a {
    color: #337ab7;
    font-family: "Montserrat", sans-serif;
    text-decoration: none;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}
a:focus,
a:hover {
    color: #337ab7;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
p {
    line-height: 26px;
    margin-bottom: 0;
}
ul,
li {
    margin: 0;
    padding: 0;
    list-style: none;
}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
/*START PRELOADER DESIGN*/

.preloader {
    background: #fff;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 9999;
}
.loadscreen,
.loadscreen-in {
    background-image: url(../img/preloader.gif);
    background-position: center;
    background-repeat: no-repeat;
    height: 200px;
    left: 50%;
    margin: -100px 0 0 -100px;
    position: absolute;
    top: 50%;
    width: 200px;
}
.loadscreen-in {
    background: none;
    left: 0;
    margin: 0;
    text-align: center;
    top: 65%;
}
.loadscreen-in h4 {
    color: #333;
    margin-top: 30px;
    text-transform: uppercase;
}
/*END PRELOADER DESIGN*/

.no-padding {
    padding: 0;
}
.section-padding {
    padding: 80px 0
}
.section-back-image {
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
}
.bg-gray {
    background: #f5f5f5;
}
/*START SECTION TITLE DESIGN*/

.section-title {
    margin-bottom: 60px;
}
.section-title h2 {
	color: #333;
	text-transform: none;
	padding: 10px 70px;
	margin: 0;
	position: relative;
	display: inline-block;
}
.section-title h2.section-title-white,
.section-title p.section-dec-white {
    color: #fff;
}
@media only screen and (max-width: 360px) {
    .section-title h2 {
        font-size: 24px;
    }
}
.section-title p {
	margin: auto;
	width: 100%;
	position: relative;
	padding-top: 0;
	padding-right: 5px;
	padding-bottom: 0;
	padding-left: 5px;
}
@media only screen and (max-width: 768px) {
    .section-title p {
        width: 100%;
    }
}
.section-title h2:after,
.section-title h2:before {
    border-top: 4px double #337ab7;
    content: "";
    left: 20px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    transform: rotate(90deg);
    width: 18px;
}
.section-title h2.section-title-white:after,
.section-title h2.section-title-white:before {
    border-color: #fff;
}
.section-title h2:after {
    left: auto;
    right: 20px;
}
.section-title .dot {
    margin: 20px 0;
}
.section-title span {
    background-color: #bebebe;
    display: inline-block;
    height: 7px;
    width: 7px;
    position: relative;
}
/*END SECTION TITLE DESIGN*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 02. START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/

.navbar-default {
    border: none;
    border-radius: 0;
    margin-bottom: 0;
    width: 100%;
    padding: 10px 0;
    background: #fff;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #337ab7 !important;
    background-color: transparent;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    color: #337ab7 !important;
    background-color: transparent;
}
.navbar-brand {
    padding: 0;
}
.navbar-brand img {
	width: 250px;
	margin-left: 10px;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
    border-color: #fff
}
.main-menu {
    background: rgba(0, 0, 0, 0.72);
}
.main-menu li a {
    color: #fff !important;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
}
.main-menu li a:hover {
    color: #337ab7!important
}
.main-menu li a span {
    position: relative;
    display: block;
    padding: 5px 0;
}
.main-menu li a span:before,
.main-menu li a span:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    background-color: #337ab7;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.main-menu li.active a span:before,
.main-menu li.active a span:after {
    visibility: visible;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}
.main-menu li a:hover span:before,
.main-menu li a:hover span:after {
    visibility: visible;
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1);
}
.main-menu li a span:before {
    top: 0;
}
.main-menu li a span:after {
    bottom: 0;
}
@media only screen and (max-width: 768px) {
    .navbar-default .navbar-nav > li > a {
        margin-top: 10px;
        padding: 8px;
    }
}
.navbar-default.menu-animation {
    background-color: #fff !important;
    box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
    padding: 20px 0;
    width: 100%;
}
@media only screen and (max-width: 480px) {
    .main-menu {
        color: #fff !important;
        margin-left: 0px;
    }
}
.navbar-default.menu-animation li a {
    color: #333!important
}
.navbar-default.menu-animation li a:hover {
    color: #337ab7 !important
}
.navbar-default .navbar-toggle {
    background: #fff none repeat scroll 0 0
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #fff
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #337ab7;
}
/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*

* ----------------------------------------------------------------------------------------
* 03. START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/

.slider-area,
.home-page-slider,
.home-page-slider div {
    height: 100vh;
}
.home-page-slider div.single-slide-item-tablecell,
.home-page-slider div.single-slide-item-tablecell div {
    height: auto
}
.single-slide-item-table {
	display: table;
	text-align: center;
	width: 100%;
}
.single-slide-item-tablecell {
    display: table-cell;
    vertical-align: middle;
}
.single-slide-item {
    position: relative;
    z-index: 1;
}
.single-slide-item:after {
    position: absolute;
    background: rgba(0, 0, 0, 0.6);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1;
}
.slide-1 {
    background: url(../img/bg/slide-1.jpg) scroll 0 0;
    background-size: cover;
}
.slide-2 {
    background: url(../img/bg/slide-2.jpg) scroll 0 0;
    background-size: cover;
}
.slide-3 {
    background: url(../img/bg/slide-3.jpg) scroll 0 0;
    background-size: cover;
}
.slideshow-1 {
    background: url(../img/bg/slideshow-1.jpg) scroll 0 0;
    background-size: cover;
}
.slideshow-2 {
    background: url(../img/bg/slideshow-2.jpg) scroll 0 0;
    background-size: cover;
}
.slideshow-3 {
    background: url(../img/bg/slideshow-3.jpg) scroll 0 0;
    background-size: cover;
}
.carousel-fade .carousel-inner .item {
    -webkit-transition-property: opacity;
    transition-property: opacity;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.single-slide-item h2 {
    color: #f8f8f8;
    font-size: 40px;
    margin: 0 0 20px;
    text-transform: uppercase;
}
@media only screen and (max-width: 480px) {
    .single-slide-item h2 {
        font-size: 30px;
    }
}
.single-slide-item p {
    color: #fff;
    width: 70%;
    margin-bottom: 30px;
}
.carousel-indicators-slider {
    bottom: 30px !important;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}
.home-page-slider:hover .carousel-indicators-slider {
    opacity: 1;
    visibility: visible;
}
.carousel-indicators .active {
    background-color: #337ab7;
    border-color: #337ab7;
    width: 20px;
    height: 20px;
    margin: 0;
}
.carousel-indicators li {
    border-radius: 0;
    height: 20px;
    width: 20px;
    margin: 0 1px;
}
@media only screen and (max-width: 480px) {
    .carousel-indicators-slider {
        bottom: 0 !important;
    }
}
.btn-home-slider {
	background: #337ab7;
	border: 2px solid #337ab7;
	padding: 12px 30px;
	position: relative;
	color: #fff;
	font-family: montserrat, sans-serif;
	font-size: 13px;
	text-transform: uppercase;
	display: inline-block;
	margin: 0 50px 10px 0;

    -webkit-transition: all 1s ease .1s;
    -moz-transition: all 1s ease .1s;
    -ms-transition: all 1s ease .1s;
    -o-transition: all 1s ease .1s;
    transition: all 1s ease .1s;
}
.btn-home-slider:hover,
.btn-home-slider:focus {
    background: transparent;
    border-color: #fff;
    color: #fff;
}
.btn-home-slider.btn-transparent {
    background: transparent;
    border-color: #fff;
}
.btn-home-slider.btn-transparent:hover,
.btn-home-slider.btn-transparent:focus {
    background: #337ab7;
    border: 2px solid #337ab7;
    color: #fff;
}

/* animations */

.carousel-fade .carousel-inner .item .single-slide-item h2 {
    -webkit-transform: translateY(-2000px);
    -moz-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    -o-transform: translateY(-2000px);
    transform: translateY(-2000px);
    -webkit-transition: all 1s ease .1s;
    -moz-transition: all 1s ease .1s;
    -ms-transition: all 1s ease .1s;
    -o-transition: all 1s ease .1s;
    transition: all 1s ease .1s;
}
.carousel-fade .carousel-inner .item.active .single-slide-item h2 {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
}
.carousel-fade .carousel-inner .item .btn-home-slider {
    -webkit-transform: translateY(2000px);
    -moz-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    -o-transform: translateY(2000px);
    transform: translateY(2000px);
    -webkit-transition: all 1s ease .1s;
    -moz-transition: all 1s ease .1s;
    -ms-transition: all 1s ease .1s;
    -o-transition: all 1s ease .1s;
    transition: all 1s ease .1s;
}
.carousel-fade .carousel-inner .item.active .btn-home-slider {
    -webkit-transform: translateY(-0px);
    -moz-transform: translateY(-0px);
    -ms-transform: translateY(-0px);
    -o-transform: translateY(-0px);
    transform: translateY(-0px);
}
.carousel-fade .carousel-inner .item .single-slide-item p {
    -webkit-transform: translateX(-2000px);
    -moz-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    -o-transform: translateX(-2000px);
    transform: translateX(-2000px);
    -webkit-transition: all 1s ease .1s;
    -moz-transition: all 1s ease .1s;
    -ms-transition: all 1s ease .1s;
    -o-transition: all 1s ease .1s;
    transition: all 1s ease .1s;
}
.carousel-fade .carousel-inner .item.active .single-slide-item p {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
}
/*START STATIC SLIDER*/

.home-fixed-background {
    position: relative;
    height: 100vh;
}
.home-fixed-background:before {
    background: rgba(0, 0, 0, 0.6);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
}
.home-fixed-background-text h2 {
	color: #f8f8f8;
	font-size: 40px;
	padding-top: 250px;
	text-transform: uppercase;
	margin-bottom: 20px;
	margin: 0 0 20px;
}
@media only screen and (max-width: 480px) {
    .home-fixed-background-text h2 {
        font-size: 30px;
    }
}
.home-fixed-background-text p {
	color: #fff;
	width: 70%;
	margin-bottom: 30px;
}
@media only screen and (max-width: 768px) {
    .home-fixed-background-text p {
        width: 100%;
    }
}

/*END STATIC SLIDER*/

/* START HTML5 VIDEO */
video { min-width: 100% }
.html5-video {
    top: 0%;
    left: 0%;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.htm5-video-text { position: absolute;
    top: 33%;
    width: 100%;
    left: 205px;
    z-index: 15;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
	}
@media (min-width: 1200px) and (max-width: 1300px) {
	.htm5-video-text {
     left: 68px;
	}

}
@media (min-width: 992px) and (max-width: 1199px) {
    .htm5-video-text {
    left: 131px;
	}
}	

@media (min-width: 768px) and (max-width: 991px) {
	    .htm5-video-text  h2 {
        font-size: 30px;
    }
	.htm5-video-text {

   left: 138px;
	}
	
	}	
@media only screen and (max-width: 768px) {
	.htm5-video-text  h2 {
        font-size: 30px;
    }
	.htm5-video-text {

   left: 30px;
	}
	
	}
	@media only screen and (max-width: 480px) {
    .htm5-video-text h2 {
        font-size: 30px;
    }
}
.htm5-video-text p {width: 50% !important;}
@media only screen and (max-width: 768px) {
    .htm5-video-text p {
        width: 100%
    }
}

/* END HTML5 VIDEO */

/*START PARTICLE BACKGROUND */
.particles-text {
    position: absolute;
	top: 0;
	width: 100%;
	left: 205px;
}
.particles-text h2 {
	color: #f8f8f8;
	font-size: 40px;
	padding-top: 250px;
	text-transform: uppercase;
	margin-bottom: 20px;
	margin: 0 0 20px;
}
@media (min-width: 1200px) and (max-width: 1300px) {
	.particles-text {
     left: 68px;
	}

}
@media (min-width: 992px) and (max-width: 1199px) {
    .particles-text {
    left: 131px;
	}
}	

@media (min-width: 768px) and (max-width: 991px) {
	    .particles-text  h2 {
        font-size: 30px;
    }
	.particles-text {

   left: 138px;
	}
	
	}	
@media only screen and (max-width: 768px) {
	    .particles-text  h2 {
        font-size: 30px;
    }
	.particles-text {

   left: 30px;
	}
	
	}
@media only screen and (max-width: 480px) {
    .particles-text h2 {
        font-size: 30px;
    }
}
.particles-text p {
	color: #fff;
	width: 50%;
	margin-bottom: 30px;
}
@media only screen and (max-width: 768px) {
    .particles-text p {
        width: 100%;
    }
}

/*END PARTICLE BACKGROUND */

/* START ANIMATED HEADING */
h2.cd-headline {font-size: 50px;}
@media only screen and (max-width: 768px) {
h2.cd-headline {font-size: 40px;}
}
@media only screen and (max-width: 480px) {
h2.cd-headline {font-size: 30px;}
}
.cd-words-wrapper {
  display: inline-block;
  position: relative;
  text-align: left;
}
.cd-words-wrapper b {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
  left: 0;
  top: 0;
}
.cd-words-wrapper b.is-visible {
  position: relative;
}
.no-js .cd-words-wrapper b {
  opacity: 0;
}
.no-js .cd-words-wrapper b.is-visible {
  opacity: 1;
}
.cd-headline.type .cd-words-wrapper {
  vertical-align: top;
  overflow: hidden;
}
.cd-headline.type .cd-words-wrapper:after {
  /* vertical bar */
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 90%;
  width: 1px;
  background-color: #337ab7;
}
.cd-headline.type .cd-words-wrapper.waiting:after {
  -webkit-animation: cd-pulse 1s infinite;
  -moz-animation: cd-pulse 1s infinite;
  animation: cd-pulse 1s infinite;
}
.cd-headline.type .cd-words-wrapper.selected {
  background-color: #337ab7;
}
.cd-headline.type .cd-words-wrapper.selected:after {
  visibility: hidden;
}
.cd-headline.type .cd-words-wrapper.selected b {
  color: #fff;
}
.cd-headline.type b {
  visibility: hidden;
}
.cd-headline.type b.is-visible {
  visibility: visible;
}
.cd-headline.type i {
  position: absolute;
  visibility: hidden;
}
.cd-headline.type i.in {
  position: relative;
  visibility: visible;
}

/* END ANIMATED HEADING */

/*
* ----------------------------------------------------------------------------------------
* 03.END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 04. START ABOUT DESIGN
* ----------------------------------------------------------------------------------------
*/

blockquote {
    padding: 0;
    margin: 0;
    border: none;
}
.about-quote p {
    font-size: 16px;
    margin-bottom: 20px;
}
blockquote footer {
    display: block;
    font-size: 80%;
    letter-spacing: 2px;
}
blockquote footer:before {
    content: '\2014 \00A0';
}
/*
* ----------------------------------------------------------------------------------------
* 04.END ABOUT DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 05. START FEATURES DESIGN
* ----------------------------------------------------------------------------------------
*/

.single-feature {
    margin-bottom: 30px;
    padding: 0 40px;
}
.single-feature-border .single-feature {
    border-right: 1px solid #e9e9e9;
}
.single-feature-border .single-feature:last-child {
    border: none;
}
@media only screen and (max-width: 768px) {
    .single-feature-border .single-feature {
        border: none;
    }
}
.single-feature .single-feature-icon,
.single-feature .single-feature-text {
    float: left;
}
.single-feature .single-feature-icon {
    margin-right: 20px;
}
.single-feature .single-feature-icon i {
    background: #337ab7;
    box-shadow: 0 5px 6px 0 rgba(0, 0, 0, 0.1);
    color: #fff;
    font-size: 23px;
    height: 50px;
    width: 50px;
    line-height: 50px;
    text-align: center;
    margin-bottom: 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.single-feature .single-feature-text {
    width: 74%;
    position: relative;
}
@media (min-width: 992px) and (max-width: 1199px) {
    .single-feature .single-feature-text {
        width: 100%;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .single-feature .single-feature-text {
        width: 100%;
    }
}
@media only screen and (max-width: 768px) {
    .single-feature .single-feature-text {
        width: 100%;
    }
}
.single-feature-text h4 {
	margin: 0 0 20px;
	text-transform: none;
}
.single-feature-text p {
	margin-bottom: 5px;
}
.single-feature:hover .single-feature-icon i {
    background: #222;
}
.single-feature:hover .single-feature-text p a {
    color: #222;
}
.single-feature .single-feature-text:before {
    position: absolute;
    content: "";
    bottom: 0;
    height: 1px;
    width: 60px;
    background: #337ab7;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.single-feature:hover div.single-feature-text:before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1);
}
/*
* ----------------------------------------------------------------------------------------
* 05.END FEATURES DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 06. START SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/

.our-services {
    position: relative;
}
.our-services:before {
    background: rgba(0, 0, 0, 0.8);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    position: absolute;
    top: 0;
    width: 100%;
}
#service .single-service-wrap:first-child {
    padding-right: 75px;
}
#service .single-service-wrap:last-child {
    padding-left: 75px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #service .single-service-wrap:first-child,
    #service .single-service-wrap:last-child {
        padding: 0;
    }
}
@media only screen and (max-width: 768px) {
    #service .single-service-wrap:first-child {
        padding-right: 15px;
    }
    #service .single-service-wrap:last-child {
        padding-left: 15px;
    }
}
#service .single-service-wrap:not(:nth-child(2)) {
    margin-top: 105px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #service .single-service-wrap:not(:nth-child(2)) {
        margin-top: 0;
    }
}
@media only screen and (max-width: 768px) {
    #service .single-service-wrap:not(:nth-child(2)) {
        margin-top: 0;
    }
    #service .single-service-wrap:not(:last-child) {
        margin-bottom: 60px;
    }
}
.single-service {
    margin-bottom: 30px;
}
.single-service .single-service-text,
.single-service .single-service-icon {
    float: left;
}
.single-service .single-service-icon {
    margin-left: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-service .single-service-icon {
        margin-left: 15px;
    }
}
.single-service .single-service-text {
    width: 66%;
}
@media only screen and (max-width: 360px) {
    .single-service .single-service-text {
        width: 61%;
    }
}
.single-service .single-service-text-left,
.single-service .single-service-icon-left {
    float: right !important;
}
.single-service .single-service-icon-left {
    margin-right: 20px !important;
    margin-left: 0 !important;
}
.single-service .single-service-icon i {
    background: #337ab7;
    box-shadow: 0 5px 6px 0 rgba(0, 0, 0, 0.1);
    color: #fff;
    font-size: 23px;
    height: 80px;
    width: 80px;
    line-height: 80px;
    text-align: center;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    margin-bottom: 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-service .single-service-icon i {
        font-size: 18px;
        height: 55px;
        width: 55px;
        line-height: 55px;
    }
}
.single-service-text h4,
.single-service-text h6 {
    color: #fff;
    text-transform: uppercase;
}
.single-service-text h6 {
    color: #FE9226;
    margin-top: 0;
}
.single-service-text a {
    color: #656566;
    font-size: 12px;
    text-transform: uppercase;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-service-text h4,
    .single-service-text h6,
    .single-service-text a {
        font-size: 11px;
    }
}
.single-service:hover .single-service-icon i {
    background: #fff;
    color: #333;
}
/*
* ----------------------------------------------------------------------------------------
* 06.END SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 07. START PORTFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/

.prot-logo img {
    width: 170px;
    display: inline-block;
    margin-bottom: 20px;
}
.portfolio-filter-menu ul {
    margin-bottom: 35px;
}
.portfolio-filter-menu ul li {
    cursor: pointer;
    display: block;
    font-size: 13px;
    font-weight: 400;
    margin: 0 0 15px;
    padding: 8px 0;
    text-transform: uppercase;
    position: relative;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    color: #333;
    font-family: montserrat, sans-serif;
}
@media (min-width: 768px) and (max-width: 991px) {
    .portfolio-filter-menu ul li {
        padding: 5px 15px;
    }
}
@media only screen and (max-width: 768px) {
    .portfolio-filter-menu ul li {
        padding: 5px 15px;
    }
}
.portfolio-filter-menu ul li:hover,
.portfolio-filter-menu ul li.active {
    color: #337ab7;
}
.portfolio-filter-menu ul li:before {
	background-color: #337ab7;
	bottom: 0;
	content: "";
	height: 2px;
	right: 100%;
	position: absolute;
	top: 47%;
	width: 15px;
	opacity: 0;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.portfolio-filter-menu ul li:after {
	background-color: #337ab7;
	bottom: 0;
	content: "";
	height: 2px;
	left: 100%;
	position: absolute;
	right: 0;
	top: 47%;
	width: 15px;
	opacity: 0;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.portfolio-filter-menu ul li.active:before,.portfolio-filter-menu ul li:hover:before {
	right: 80%;
	opacity: 1;
}
.portfolio-filter-menu ul li.active:after,.portfolio-filter-menu ul li:hover:after  {
	left: 80%;
	opacity: 1;
}
@media (min-width: 768px) and (max-width: 991px) {
    .prot-logo img {
    display: none;
    }
   .portfolio-filter-menu ul li {
        display: inline-block;
    }
    .portfolio-filter-menu ul li:after,
    .portfolio-filter-menu ul li:before {
        display: none;
    }
}
@media only screen and (max-width: 768px) {
    .prot-logo img {
    display: none;
    }
    .portfolio-filter-menu ul li {
        display: inline-block;
    }
    .portfolio-filter-menu ul li:after,
    .portfolio-filter-menu ul li:before {
        display: none;
    }
}
.portfolio-container .mix {
    display: none;
}
.single-portfolio-wrap {
    padding: 0 5px;
    margin-bottom: 10px;
}
.single-portfolio {
    overflow: hidden;
    position: relative;
}
.single-portfolio-inner {
    position: relative;
    display: block
}
.single-portfolio-inner a {
    display: block
}
.single-portfolio-inner a img {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.single-portfolio-inner>a:before {
    background-color: #000;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.portfolio-hover-actions {
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;
    opacity: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.portfolio-links {
    display: inline-block;
}
.portfolio-view,
.portfolio-link {
    display: inline-block
}
.portfolio-view a,
.portfolio-link a {
    display: inline-block;
    margin: 0 8px;
}
.portfolio-view a, .portfolio-link a {
	border: 2px solid #fff;
	color: #fff;
	height: 50px;
	width: 50px;
	line-height: 50px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.portfolio-view a:hover i,
.portfolio-link a:hover i {
    -webkit-animation: toLeftFromRight 0.4s forwards;
    -moz-animation: toLeftFromRight 0.4s forwards;
    animation: toLeftFromRight 0.4s forwards;
}
.portfolio-view a:hover,
.portfolio-link a:hover {
    background-color: #337ab7;
    border-color: #337ab7;
}
.single-portfolio:hover .single-portfolio-inner a:before {
    opacity: .4;
    z-index: 9
}
.single-portfolio:hover .portfolio-hover-actions {
    opacity: 1;
    top: 40%;
    z-index: 9
}
/*
* ----------------------------------------------------------------------------------------
* 07.END PORTFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/
/*


/*
* ----------------------------------------------------------------------------------------
* 08. START TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/

.single-testimonial img {
    border: 1px solid #999;
    height: 100px;
    width: 100px;
    margin: 0 auto 20px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
.single-testimonial {
    box-shadow: 5px 0px 10px rgba(0, 0, 0, 0.2);
    margin: 30px 0;
    background-color: #F9F9F9;
    padding: 30px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.single-testimonial:hover img {
    -webkit-transform: scale(1.2) rotate(-10deg);
    transform: scale(1.2) rotate(-10deg)
}
.single-testimonial:hover {
    background: #337ab7;
}
.single-testimonial:hover .about-quote p,
.single-testimonial:hover blockquote footer {
    color: #fff;
}
.single-testimonial:hover .about-quote span {
    background: #fff none repeat scroll 0 0;
}
.about-quote span {
    background: #333 none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 0 auto 20px;
    width: 54px;
}
.testimonial-slider.owl-theme .owl-controls .owl-page span {
    background: transparent;
    border: 1px solid #ddd;
    opacity: 1;
}
.testimonial-slider.owl-theme .owl-controls .owl-page.active span {
    background-color: #337ab7;
    border-color: #337ab7;
}
.owl-theme .owl-controls {
    margin-top: 20px;
}
.owl-theme .owl-controls .owl-page span {
    width: 20px;
    height: 20px;
    border-radius: 0;
}
/*
* ----------------------------------------------------------------------------------------
* 08. END TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 09. START COUNTER SECTION DESIGN 
* ----------------------------------------------------------------------------------------
*/

.single-counter-border .single-counter {
    border-right: 1px solid #ddd;
}
.single-counter-border .single-counter:last-child {
    border: none;
}
.single-counter {
    padding: 0 40px;
}
@media (min-width: 768px) and (max-width: 991px) {
    .single-counter {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 768px) {
    .single-counter {
        margin-bottom: 30px;
    }
}
@media only screen and (max-width: 480px) {
    .single-counter {
        margin-bottom: 30px;
    }
}
.single-counter .single-counter-icon {
    margin-right: 20px;
    position: relative;
}
.single-counter .single-counter-icon:before {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 0 15px 15px;
	border-color: transparent transparent transparent #337ab7;
	right: -11px;
	top: 20px;
	-webkit-transition: all 0.4s ease 0s;
	transition: all 0.4s ease 0s;
}
.single-counter .single-counter-icon,
.single-counter .single-counter-text {
    float: left;
}
.single-counter .single-counter-icon i {
	background: #337ab7;
	box-shadow: 0 5px 6px 0 rgba(0, 0, 0, 0.1);
	color: #fff;
	font-size: 23px;
	height: 70px;
	width: 70px;
	line-height: 70px;
	text-align: center;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	border-radius: 50%;
	margin-bottom: 20px;
	-webkit-transition: all 0.4s ease 0s;
	transition: all 0.4s ease 0s;
}
.single-counter:hover .single-counter-icon:before {
    border-color: transparent transparent transparent #222;
}
.single-counter:hover .single-counter-icon i {
    background: #222;
}
.single-counter .single-counter-text {
	width: 57%;
}
.single-counter .single-counter-text:before {
    position: absolute;
    content: "";
    bottom: 0;
    height: 1px;
    width: 60px;
    background: #337ab7;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.single-counter:hover div.single-counter-text:before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1);
}
.single-counter-text h2 {
    margin-top: 0;
    margin-bottom: 20px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.single-counter:hover .single-counter-text h2 {
    color: #337ab7;
}
.single-counter-text h5 {
    margin-bottom: 10px;
    text-transform: uppercase;
}

/*
* ----------------------------------------------------------------------------------------
* 09. END COUNTER SECTION DESIGN 
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 10. START TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/

.single-team {
    margin-bottom: 0;
    overflow: hidden;
    position: relative;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
@media only screen and (max-width: 768px) {
    .single-team {
        margin-bottom: 30px;
    }
}
.single-team img {
    width: 100%;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
.single-team-details {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    color: #fff;
    background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0;
    -webkit-transition: .4s;
    transition: .4s;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    visibility: hidden;
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    -o-transform: scaleY(0);
    transform: scaleY(0);
}
.single-team-details-table {
    display: table;
    height: 100%;
    width: 100%;
}
.single-team-details-tablecell {
    display: table-cell;
    vertical-align: middle;
}
.single-team-details h4 {
    color: #fff;
    text-transform: uppercase;
    margin-top: 0;
}
.single-team-details span {
    background: #fff none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 10px auto;
    width: 54px;
}
.single-team:hover .single-team-details h4,
.single-team:hover .single-team-details p {
    -webkit-animation: fadeInDown 500ms ease-in-out;
    animation: fadeInDown 500ms ease-in-out
}
.single-team:hover .single-team-details span {
    -webkit-animation: fadeInDown 600ms ease-in-out;
    animation: fadeInDown 600ms ease-in-out
}
.single-team-social a {
    color: #fff;
    display: inline-block;
    margin-top: 10px;
    -webkit-transition: all 0.7s ease 0s;
    transition: all 0.7s ease 0s;
    padding-left: 10px;
}
.single-team-social a:hover {
    color: #337ab7;
}
.single-team:hover .single-team-social a {
    -webkit-animation: fadeInDown 1000ms ease-in-out;
    animation: fadeInDown 1000ms ease-in-out
}
.single-team:hover .single-team-details {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    visibility: visible;
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
}
.pb-0 {
    padding-bottom: 0;
}
.call-to-action {
    padding: 40px 0;
}
.call-to-action h4,
.call-to-action p {
    margin-top: 0;
}
.call-to-action-btn a {
    background: #337ab7;
    border: 2px solid #337ab7;
    padding: 12px 30px;
    color: #fff;
    font-family: montserrat, sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    display: inline-block;
    -webkit-transition: all 1s ease .1s;
    -moz-transition: all 1s ease .1s;
    -ms-transition: all 1s ease .1s;
    -o-transition: all 1s ease .1s;
    transition: all 1s ease .1s;
}
.call-to-action-btn a:hover {
    background: transparent;
    border-color: #333;
    color: #333;
}
/*
* ----------------------------------------------------------------------------------------
* 10. END TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 11. START SKILLS & AWARDS DESIGN
* ----------------------------------------------------------------------------------------
*/

.our-skills {
    position: relative;
}
.our-skills:before {
    background: rgba(0, 0, 0, 0.9);
    content: "";
    height: 100%;
    left: 0;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    position: absolute;
    top: 0;
    width: 100%;
}
.single-award {
    margin-bottom: 30px;
    padding: 0 40px;
}
.single-award-border .single-award {
    border-right: 1px solid #666;
}
.single-award-border .single-award:last-child {
    border: none;
}
@media only screen and (max-width: 768px) {
    .single-award-border .single-award {
        border: none;
    }
}
.single-award .single-award-icon,
.single-award .single-award-text {
    float: left;
}
.single-award .single-award-icon {
    margin-right: 20px;
}
.single-award .single-award-icon i {
    background: #337ab7;
    box-shadow: 0 5px 6px 0 rgba(0, 0, 0, 0.1);
    color: #fff;
    font-size: 23px;
    height: 70px;
    width: 70px;
    line-height: 70px;
    text-align: center;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    margin-bottom: 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.single-award .single-award-text:before {
    position: absolute;
    content: "";
    bottom: 0;
    height: 1px;
    width: 60px;
    background: #337ab7;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.single-award:hover div.single-award-text:before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1);
}
.single-award .single-award-text {
    width: 70%;
}
@media (min-width: 992px) and (max-width: 1199px) {
    .single-award .single-award-text {
        width: 100%;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .single-award .single-award-text {
        width: 100%;
    }
}
@media only screen and (max-width: 768px) {
    .single-award .single-award-text {
        width: 100%;
    }
}
.single-award-text h4 {
    margin-bottom: 20px;
    color: #fff;
}
.single-award-text p {
    margin-bottom: 10px;
    color: #fff;
}
.single-award:hover .single-award-icon i {
    background: #fff;
    color: #333;
}
.skill {
    overflow: hidden;
}
.skill {
    margin-bottom: 0;
    padding-top: 50px;
}
.skill .progress .lead {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    left: 0;
    position: absolute;
    top: -23px;
    z-index: 99;
}
.skill .progress {
    border-radius: 0;
    box-shadow: none;
    height: 5px;
    margin-bottom: 50px;
    overflow: visible;
    position: relative;
}
.skill .progress:last-child {
    margin-bottom: 0px;
}
.skill .progress-bar span {
    background: #333 none repeat scroll 0 0;
    float: right;
    font-size: 12px;
    margin-right: 10px;
    margin-top: -26px;
    position: relative;
    padding: 0 5px;
}
.skill .progress-bar > span:before,
.skill .progress-bar > span:after {
    border: medium solid transparent;
    content: " ";
    height: 0;
    pointer-events: none;
    position: absolute;
    top: 100%;
    width: 0;
}
.skill .progress-bar > span:before {
    border-top-color: #333;
    border-width: 5px;
    left: 50%;
    margin-left: -5px;
}
.kalka-skill .skill .progress-bar span:before {
    border-width: 7px;
    margin-left: -7px;
    top: 111%;
}
.kalka-skill .skill .progress-bar span {
    font-size: 10px;
    height: 30px;
    line-height: 22px;
    margin-right: -14px;
    padding: 0 2px;
    top: -8px;
    width: 30px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}
.kalka-skill .skill .progress .progress-bar span {
    border: 4px solid #337ab7 !important;
}
.kalka-skill .skill .progress:nth-child(1) .progress-bar span {
    border: 4px solid #23C6EC;
}
.kalka-skill .skill .progress:nth-child(2) .progress-bar span {
    border: 4px solid #EB3B60;
}
.kalka-skill .skill .progress:nth-child(3) .progress-bar span {
    border: 4px solid #2BCDC0;
}
.kalka-skill .skill .progress:nth-child(4) .progress-bar span {
    border: 4px solid #1116EC;
}
.kalka-skill .skill .progress:nth-child(5) .progress-bar span {
    border: 4px solid rgb(51, 122, 183);
}
/*
* ----------------------------------------------------------------------------------------
* 11. END SKILLS & AWARDS DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 12. START PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/

.pricing-table-default {
    border: 1px solid #e9e9e9;
    position: relative;
    padding: 0 0 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .pricing-table-default {
        margin-bottom: 60px;
    }
}
@media (max-width: 768px) {
    .pricing-table-default {
        margin-bottom: 60px;
    }
}
.pricing-head {
    background-color: #f7f7f7;
    padding: 50px 0;
}
.pricing-head h3 {
    color: #313131;
    font-size: 18px;
    text-transform: uppercase;
    margin: 0;
    font-weight: 400;
}
.pricing-head .price {
    display: inline-block;
    line-height: 25px;
    color: #333;
    padding: 40px 0 0;
}
.pricing-head .price sup {
    font-size: 20px;
    top: 0;
}
.pricing-head .price-digit {
    font-size: 60px;
    font-weight: bold;
}
.pricing-detail {
    padding: 50px 25px 25px;
}
.pricing-list li {
    display: block;
    padding: 15px;
}
.pricing-list span {
	font-weight: 700;
}
.pricing-table-default .pricing-detail li:nth-child(2n+1) {
    background-color: #f7f7f7;
}
.pricing-table-default .btn {
    color: #333;
    text-transform: uppercase;
    font-weight: 600;
    text-align: center;
    display: inline-block;
    padding: 10px 0;
    border: 1px solid #777;
    border-radius: 0;
    position: absolute;
    left: 0;
    bottom: -20px;
    right: 0;
    margin: 0 100px;
}
.pricing-table-default .btn.focus, .pricing-table-default .btn:focus {
    background-color: #333;
    color: #fff;
}
.pricing-table-default,
.pricing-head,
.pricing-head .price,
.pricing-head h3,
.pricing-table-default .btn {
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.pricing-table-default:hover {
    border-color: #337ab7;
}
.pricing-table-default:hover .pricing-head {
    background-color: #337ab7;
}
.pricing-table-default:hover .pricing-head h3,
.pricing-table-default:hover .pricing-head .price {
    color: #fff;
}
.pricing-table-default:hover .btn {
    background-color: #333;
    color: #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 12.END PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 13. START BLOG DESIGM
* ----------------------------------------------------------------------------------------
*/

.single-blog {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.06);
    margin: 30px 15px;
    position: relative;
    overflow: hidden;
}
@media only screen and (max-width: 768px) {
    .single-blog {
        margin-bottom: 30px;
    }
}
.single-blog img {
    -webkit-transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -ms-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}
.blog-text {
    border: 1px solid #e9e9e9;
    padding: 20px;
    color: #333;
    background-color: #F9F9F9;
}
.blog-text h4 {
    text-transform: uppercase;
    margin-bottom: 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.blog-text span {
    text-transform: uppercase;
    margin-bottom: 20px;
    display: inline-block;
    padding-right: 3px;
}
.blog-text span i {
    padding-right: 5px;
    color: #333;
}
.blog-text span.post-admin {
    font-weight: 600;
}
.btn-blog-bg {
    color: #fff;
    padding: 10px 20px;
    background-color: #333;
    display: inline-block;
    margin: 20px 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.btn-blog-bg i {
    padding-left: 10px;
}
.single-blog:hover img {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
}
.single-blog:hover .btn-blog-bg {
    background-color: #337ab7;
    color: #fff;
}
.single-blog:hover .blog-text h4 {
    color: #337ab7;
}
.blog-slider.owl-theme .owl-controls .owl-page span {
    background: transparent;
    border: 1px solid #ddd;
    opacity: 1;
}
.blog-slider.owl-theme .owl-controls .owl-page.active span {
    background-color: #337ab7;
    border-color: #337ab7;
}
/*
* ----------------------------------------------------------------------------------------
* 13. END BLOG DESIGM
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 14. START BRANCH LOGO DESIGN
* ----------------------------------------------------------------------------------------
*/

.branch-logo-padding {
    padding: 40px 0;
}

.branch .item {
	padding: 0 15px;
}
.branch .item .branch-inner {
	background-color: #faf8f8;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.branch .item .branch-inner:hover {
	background-color: #337ab7;
	cursor: pointer;
}
.branch .item .branch-inner {
	height: 170px;
	text-align: center;
}
.branch .item .branch-inner img{
    max-width: 100%;
}

/*
* ----------------------------------------------------------------------------------------
* 14.END BRANCH LOGO DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 15. START CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/

.contact {
    padding: 0 20px 30px 0px;
}
.form-group {
    margin-bottom: 20px;
}
.form-control {
    border: 1px solid #e9e9e9;
    border-radius: 0;
    box-shadow: none;
    height: 45px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.form-control:focus {
    color: #333;
    border: 1px solid #337ab7;
    background: none;
    box-shadow: none;
    outline: 0 none;
}
.btn-contact-bg {
    background: #337ab7 none repeat scroll 0 0;
    border-radius: 0;
    color: #fff;
    font-family: montserrat, sans-serif;
    font-size: 14px;
    padding: 12px 38px;
    text-transform: uppercase;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus {
    background: #222;
    border: 1px solid #222;
    color: #fff;
}
.mb-0 {
    margin-bottom: 0
}
.success {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
}
.single-address {
    background: #F5F5F5;
    margin-bottom: 20px;
    padding: 20px;
    float: left;
    width: 100%;
}
.single-address .single-address-icon,
.single-address .single-address-text {
    float: left;
}
.single-address .single-address-icon {
    margin-right: 20px;
}
.single-address .single-address-icon i {
	background: #222;
	box-shadow: 0 5px 6px 0 rgba(0, 0, 0, 0.1);
	color: #fff;
	font-size: 23px;
	height: 60px;
	width: 60px;
	line-height: 60px;
	text-align: center;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	border-radius: 50%;
	margin-bottom: 20px;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	margin-top: 25px;
}
.single-address .single-address-text {
    width: 74%;
}
.single-address:hover .single-address-icon i {
    background: #337ab7;
}
#map {
    height: 400px;
}
/*
* ----------------------------------------------------------------------------------------
* 15.END CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 16. START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/

.footer-top {
    background: #232328;
}
.footer-logo img {
    margin-bottom: 30px;
    width: 250px;
}
/*START FOOTER SOCIAL DESIGN*/

.footer-social {
    margin-bottom: 30px
}
.footer-social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.footer-social ul li {
    display: inline-block
}
.footer-social ul li a {
    width: 40px;
    height: 40px;
    line-height: 40px;
    margin: 0 6px;
    text-align: center;
    display: block;
    color: #fff;
    border: 1px solid #ddd;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 768px) {
    .footer-social ul li a {
        font-size: 12px;
    }
}
.footer-social ul li a:hover {
    color: #fff
}
.footer-social ul li a:hover i {
    -webkit-animation: toLeftFromRight 0.4s forwards;
    -moz-animation: toLeftFromRight 0.4s forwards;
    animation: toLeftFromRight 0.4s forwards;
}
.s-facebook:hover {
    background: #5D82D1;
    border: 1px solid #5D82D1;
}
.s-twitter:hover {
    background: #40BFF5;
    border: 1px solid #40BFF5;
}
.s-google:hover {
    background: #EB5E4C;
    border: 1px solid #EB5E4C;
}
.s-linkedin:hover {
    background: #238CC8;
    border: 1px solid #238CC8;
}
.s-youtube:hover {
    background: #CC181E;
    border: 1px solid #CC181E;
}
.s-skype:hover {
    background: #00AFF0;
    border: 1px solid #00AFF0;
}
.footer-bottom {
    background: #222;
    padding: 20px 0;
}
.copyright p {
    color: #eee;
    margin-bottom: 0;
}
.copyright a {
    color: #337ab7;
    font-family: "Cousine", sans-serif;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.copyright a:hover {
    color: #fff
}
/*
* ----------------------------------------------------------------------------------------
* 16.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 17. START BLOG PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/
.single-page .main-menu {
	background: rgba(0, 0, 0, 0.8);
}
.blogpage-heading {
	margin-top: 80px;
}
.blogpage-heading h2 {
	margin: 20px 0;
	font-size: 53px;
}
.blogpage-heading span {
	color: #337ab7;
	font-weight: 700;
}
.page-breadcrumb {
	margin-top: 224px;
	
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.blogpage-heading {
	margin-top: 120px;
}
.page-breadcrumb {
	margin-top: 50px;
	text-align: left;
}
}
@media only screen and (max-width: 768px) {
.page-breadcrumb {
	margin-top: 50px;
	text-align: left;
}
}
@media only screen and (max-width: 480px) {


}
.page-breadcrumb .breadcrumb {
	border-radius: 0;
	border: 0;
	background-color: transparent;
	margin: 0;
}
.page-breadcrumb .breadcrumb > .active {
	color: #333;
	font-weight: 700;
}
.page-breadcrumb .breadcrumb>li+li:before {
    content: "\f105";
    font-family: "fontAwesome";
    padding: 0 12px;
}
.blog-sec {
	border-top: 1px solid #ddd;
	margin-top: 80px;
}
.blog-list .single-blog {
	margin: 0 0 30px;
}
.blog-list,.blog-sidebar {
	margin-top: 80px;
}
.pagination {
	margin: 60px 0 0;
	border-radius: 0;
}
.pagination li a.active {
	background-color: #337ab7;
	color: #fff;
}
.widget {
	float: left;
	margin-bottom: 60px;
	width: 100%;
}
.widget-tittle {
	margin-bottom: 30px;
}
.widget-tittle h3 {
	color: #333;
	margin: 0;
	text-transform: uppercase;
	position: relative;
	display: inline-block;
	padding: 10px 30px;
}
.widget-tittle h3:after,
.widget-tittle h3:before {
    border-top: 4px double #337ab7;
    content: "";
    left: -6px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    transform: rotate(90deg);
    width: 18px;
}
.widget-tittle h3:after {
	left: auto;
	right: -6px;
}
.search-widget {
    position: relative;
}
.search-widget form [type="submit"] {
	width: 45px;
	height: 45px;
	line-height: 45px;
	position: absolute;
	right: 0;
	top: 0;
	border: 0;
	background-color: #337ab7;
	color: #fff;
}
.search-widget form [type="text"] {
    background: transparent;
}
.blog-follow-us ul li {
    display: inline-block
}
.blog-follow-us ul li a {
	width: 60px;
	height: 60px;
	line-height: 60px;
	margin: 0 6px 0 0;
	text-align: center;
	display: block;
	color: #333;
	font-size: 23px;
	border: 1px solid transparent;
	background: #f6f6f6 none repeat scroll 0 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.blog-follow-us ul li a:hover {
    color: #fff
}
.blog-follow-us ul li a:hover i {
    -webkit-animation: toLeftFromRight 0.4s forwards;
    -moz-animation: toLeftFromRight 0.4s forwards;
    animation: toLeftFromRight 0.4s forwards;
}

.tag-widget ul {
	list-style: none;
}
.tag-widget a {
    color: #fff;
	border: 1px solid #e9e9e9;
    display: block;
    float: left;
    margin: 0 6px 6px 0;
    padding: 6px 10px;
	background: #337ab7;
	text-transform: capitalize;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.tag-widget a:hover {
    background: #333;
    border-color: #333;
}

.single-admin {
	position: relative;
	overflow: hidden;
	margin: 0 15px 30px 0;
	padding: 40px;
	background-color: transparent;
	border: 1px solid #e9e9e9;
	-webkit-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
}
.single-admin .admin-img {
	display: block;
	margin-bottom: 40px;
}
.single-admin .admin-img img {
    width: 130px;
    margin: 0 auto;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
.admin-add,.admin-dec {
    margin-bottom: 30px;
}
.admin-add h4,.admin-add p,.admin-dec p {
    color: #333;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
.admin-add h4 {
	text-transform: uppercase;
	margin: 0;
}
.single-admin:hover {
	background-color: #337ab7;
    border-color: #337ab7;
}
.single-admin:hover .admin-add h4,.single-admin:hover .admin-add p,.single-admin:hover .admin-dec p {color: #fff;}
.single-admin:hover ul.social-links li a {color: #fff !important;}
/* social */

ul.social-links li {
    display: inline-block;
}
ul.social-links li a {
	display: block;
	text-align: center;
	color: #333;
	margin: 0 6px;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}
ul.social-links li a:hover span {
    -webkit-animation: toLeftFromRight 0.4s forwards;
    -moz-animation: toLeftFromRight 0.4s forwards;
    animation: toLeftFromRight 0.4s forwards;
}
.social-fb {
    color: #3B5998 !important;
}
.social-tw {
    color: #4099FF !important;
}
.social-gp {
    color: #d34836 !important;
}
.social-em {
    color: #333 !important;
}

.comments-area, .comments-form {
	margin-bottom: 30px;
}
.comments-area {
    border: 1px solid #e9e9e9;
    padding: 20px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.06);
}
.comments-area ol {
	list-style: none;
	padding: 0;
	margin-top: 20px;
}
.comments-list li {
    border-top: 1px solid #555;
    padding: 20px 8px 0 20px;
}
.comments-list li .comment-head {
    margin-bottom: 12px;
}
.comments-list li .reply-link {
    float: right;
}
.comments-list li .avatar {
    float: left;
    margin-right: 12px;
    border: 1px solid #555;
}
.comments-list li .avatar img {
    width: 90px;
    height: 90px;
	border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}
.comments-list li .commenter {
    margin-top: 12px;
}
.comments-list li ol,
.comments-list li ul {
    margin-left: 104px;
}
.comments-form h3 {
	margin-bottom: 20px;
}
.comments-form input,.comments-form textarea {
  background: transparent;
}

.sin-comm-btn {
    background: #337ab7;
    border: 2px solid #337ab7;
    padding: 12px 30px;
    color: #fff;
    font-family: montserrat, sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    display: inline-block;
    -webkit-transition: all 1s ease .1s;
    -moz-transition: all 1s ease .1s;
    -ms-transition: all 1s ease .1s;
    -o-transition: all 1s ease .1s;
    transition: all 1s ease .1s;
}
.sin-comm-btn:hover {
    background: #333;
    border-color: #333;
    color: #fff;
}

/*
* ----------------------------------------------------------------------------------------
* 17.END BLOG PAGE DESIGN
* ----------------------------------------------------------------------------------------
*/




/*
* ----------------------------------------------------------------------------------------
* 18. START SCROLL TO TOP 
* ----------------------------------------------------------------------------------------
*/

#topcontrol {
    color: #fff;
    cursor: pointer;
    font-size: 26px;
    height: 40px;
    width: 40px;
    line-height: 40px;
    padding: 3px 12px;
    position: fixed;
    right: 15px;
    bottom: 15px;
    background: #337ab7 none repeat scroll 0 0;
    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
#topcontrol:hover {
    background: #222;
    color: #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 18. END SCROLL TO TOP 
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 19. ANIMATION & KEYFRAMES 
* ----------------------------------------------------------------------------------------
*/

@-webkit-keyframes Floatingx {
    from {
        -webkit-transform: translate(0, 0px);
    }
    65% {
        -webkit-transform: translate(0, 15px);
    }
    to {
        -webkit-transform: translate(0, -0px);
    }
}
@-moz-keyframes Floating {
    from {
        -moz-transform: translate(0, 0px);
    }
    65% {
        -moz-transform: translate(0, 15px);
    }
    to {
        -moz-transform: translate(0, -0px);
    }
}
@-webkit-keyframes toLeftFromRight {
    49% {
        -webkit-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toLeftFromRight {
    49% {
        -moz-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toLeftFromRight {
    49% {
        transform: translate(-100%);
    }
    50% {
        opacity: 0;
        transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}


@-webkit-keyframes cd-pulse {
  0% {
    -webkit-transform: translateY(-50%) scale(1);
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(-50%) scale(0.9);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(-50%) scale(0);
    opacity: 0;
  }
}
@-moz-keyframes cd-pulse {
  0% {
    -moz-transform: translateY(-50%) scale(1);
    opacity: 1;
  }
  40% {
    -moz-transform: translateY(-50%) scale(0.9);
    opacity: 0;
  }
  100% {
    -moz-transform: translateY(-50%) scale(0);
    opacity: 0;
  }
}
@keyframes cd-pulse {
  0% {
    -webkit-transform: translateY(-50%) scale(1);
    -moz-transform: translateY(-50%) scale(1);
    -ms-transform: translateY(-50%) scale(1);
    -o-transform: translateY(-50%) scale(1);
    transform: translateY(-50%) scale(1);
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(-50%) scale(0.9);
    -moz-transform: translateY(-50%) scale(0.9);
    -ms-transform: translateY(-50%) scale(0.9);
    -o-transform: translateY(-50%) scale(0.9);
    transform: translateY(-50%) scale(0.9);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(-50%) scale(0);
    -moz-transform: translateY(-50%) scale(0);
    -ms-transform: translateY(-50%) scale(0);
    -o-transform: translateY(-50%) scale(0);
    transform: translateY(-50%) scale(0);
    opacity: 0;
  }
}


/*
* ----------------------------------------------------------------------------------------
* 19.END ANIMATION & KEYFRAMES 
* ----------------------------------------------------------------------------------------
*/