/*
Author       : Syed Ekram.
Template Name: Khushi - Responsive One Page Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME DESIGN
    04. START ABOUT US DESIGN
    05. START PORTFOLIO DESIGN
    06. START SERVICE DESIGN
    07. START OUR PROCESS DESIGN
    08. START TEAM DESIGN
    09. START TESTIMONIAL DESIGN
    10. START COUNT TIMER
    11. START PRICING DESIGN
    12. START NEWSLETTER DESIGN
    13. START RESPONSIVE PROMOTION DESIGN
    14. START BLOG DESIGN
    15. START PROMOTION DESIGN
    16. START CONTACT DESIGN
    17. START SOCIAL PROFILE DESIGN
    18. START FOOTER DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
    background-color: #fff;
    color: #777;
    font-family: "Source Sans Pro",sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
img{
	max-width: 100%;
	display: inline-block;
	height: auto;
}
html,
body { height: 100% }
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #333;
     font-family: "Montserrat",sans-serif;
    font-weight: 700;
}
a {
    font-family: "Montserrat",sans-serif;
    text-decoration: none;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	color: #1cbac8;
}
a:hover {
    color: #222;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
ul,
li {
    margin: 0;
    padding: 0;
}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
/*START PRELOADER DESIGN*/
.preloader {
    background: rgba(28,186,200,0.6);
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 9999;
}
.status,
.status-mes {
    background-image: url(../img/status.gif);
    background-position: center;
    background-repeat: no-repeat;
    height: 200px;
    left: 50%;
    margin: -100px 0 0 -100px;
    position: absolute;
    top: 50%;
    width: 200px;
}
.status-mes {
    background: none;
    left: 0;
    margin: 0;
    text-align: center;
    top: 65%;
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
    background: #1cbac8 none repeat scroll 0 0;
    border-radius: 50px;
    bottom: 5px;
    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
    color: #fff;
    cursor: pointer;
    font-size: 26px;
    height: 40px;
    opacity: 1;
    filter: alpha(opacity=100);
    padding: 5px 12px;
    position: fixed;
    right: 5px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    width: 40px;
}
.topcontrol:hover {
    background: #222;
    color: #fff;
}
/*END SCROLL TO TOP*/
.section-padding { padding: 60px 0 }
/*START SECTION TITLE DESIGN*/
.section-title{margin-bottom: 60px;}
.section-title  h2 {
margin: 0;
position: relative;
text-transform: uppercase;
padding-bottom: 10px;
}
@media only screen and (max-width:320px) { 
.section-title  h2 {font-size: 24px; }
}
.section-title h2 span{color:#1cbac8;}
.section-title-white {
color: #fff !important;
position: relative;
}
.section-title div {
    background: #1cbac8 none repeat scroll 0 0;
    display: block;
    height: 3px;
	position: relative;
    margin: 15px auto;
    width: 80px;
}
.section-title p{position: relative;} 
/*END SECTION TITLE DESIGN*/
/*START BTN STYLE*/
.btn-light-bg {
background: #1cbac8 none repeat scroll 0 0;
border: 2px solid #1cbac8;
border-radius: 3px;
box-shadow: 0 10px 110px 0 rgba(0, 0, 0, 0.1);
color: #fff;
font-size: 12px;
padding: 8px 20px;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
.btn-light-bg:hover,
.btn-light-bg:focus {
    background: #040E18;
    color: #fff;
    border: 2px solid #040E18;
}
/*END BTN STYLE*/
/*SECTION OVERLAY*/
.overlay { background: rgba(0,0,0,0.6) none repeat scroll 0 0 }
/*END SECTION OVERLAY*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 02. START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.navbar-default {
    border: none;
    border-radius: 0;
    margin-bottom: 0;
    width: 100%;
    padding: 20px 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: #1cbac8 ;
    background-color: transparent;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    color: #1cbac8 ;
    background-color: transparent;
}
.navbar-brand { padding: 0px }
.navbar-brand img { width: 150px }
.menu-top { background: none }
.menu-top li a {
    font-family: "Montserrat",sans-serif;
    color: #fff ;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
}
.menu-top li a:hover { color: #1cbac8; }
@media only screen and (max-width:768px) { 
    .navbar-default .navbar-nav > li > a {
        margin-top: 10px;
        padding: 8px;
    }
}
@media only screen and (max-width:480px) { 
    .menu-top { background-color: #efda37; }
    .navbar-default .navbar-nav > li > a { color: #313131; }
}
.navbar-default.menu-shrink {
background-color: rgba(255, 255, 255, 0.9);
box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
padding: 10px 0;
width: 100%;
}
@media only screen and (max-width:480px) { 
    .menu-top {
        color: #fff;
        margin-left: 0px;
    }
}

#header_area.navbar-default.menu-shrink ul li a { color: #313131; }
.navbar-default.menu-shrink li a:hover ,
#nav ul li.current a{ color: #1cbac8 ;}
.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: #1cbac8; }
.navbar-header{
	padding-bottom: 20px;
}
/*
	Dropdown Menu
*/

#nav ul{
	list-style-type: none;
}
#nav li ul.sub-menu{
	opacity: 0;
	position: absolute;
	top: 115%;
	transition: all 0.3s ease 0s;
	width: 228px;
	z-index: -999px;
	visibility:hidden;
	background: #fff none repeat scroll 0 0;
	box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.2);
	padding: 15px;  
	left: 10px;
	display: none;
}
#nav ul li ul.sub-menu li ul.sub-menu{
	opacity: 0;
	position: absolute;
	top: 115%;
	transition: all 0.3s ease 0s;
	width: 228px;
	z-index: -999px;
	visibility:hidden;
	background: #fff none repeat scroll 0 0;
	box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.2);
	padding: 15px;  
	left: 10px;	
}
#nav ul li ul.sub-menu li ul.sub-menu{
	top: 0;
	left: 100%;
	transition: all 0.5s ease 0s;
}
#nav ul li ul.sub-menu li{
	padding: 0;
	width: 100%;
}
#nav ul>li:hover ul.sub-menu{
	top:100%;
	opacity:1;
	z-index:999;
	visibility:visible;
	display: block;
}
#nav ul.nav > li ul li:hover ul.sub-menu{
	opacity:1;
	visibility:visible;
	z-index:999;
	display: block;
	
}

#nav ul li ul.sub-menu li a {
	color: #333;
	cursor: pointer;
	display: block;
	padding: 10px 10px;
	font-weight: 300;
	text-transform: none;
	font-size: 13px;
}

#nav ul li:hover ul.sub-menu li a:hover,
.navbar-default #nav ul li:hover ul.sub-menu li a:hover
{
	color: #fff;
	background: #00bcd4;
	text-decoration: none;
}
.navbar-default.menu-shrink #nav ul.nav.navbar-nav.navbar-right > li > ul li a:hover{
	color: #fff;
}
.user_login_menu{
	padding-top: 38px;
}
/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03.START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
.slider { height: 700px }
.slider_text {
  padding-top: 250px;
}
.slider_text h2 {
color: #fff;
font-size: 70px;
line-height: 70px;
margin: 0;
text-transform: uppercase;
}
@media only screen and (max-width:768px) { 
    .slider_text h2 {
        font-size: 40px;
        line-height: 54px;
    }
}
@media only screen and (max-width:480px) { 
    .slider_text h2 {
        font-size: 34px;
        line-height: 45px;
    }
}
@media only screen and (max-width:360px) { 
    .slider_text h2 {
        font-size: 26px;
        line-height: 36px;
        padding-top: 250px;
    }
}
.slider_text p {
color: #fff;
letter-spacing: 1px;
margin-bottom: 0;
padding-bottom: 35px;
padding-top: 15px;
width: 850px;
margin: 0 auto;
}
@media only screen and (max-width:768px) { 
    .slider_text p {width: 100%; }
}
.slider {position: relative;}
.slider::before{
  position: absolute;
  width: 100%;
  height: 100%;
  background:rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
  opacity: 0.8;
  content: "";
  left: 0;
  top: 0;
}

.slider_text a {
    background:#1cbac8;
    border: 2px solid #1cbac8;
    color: #fff;
	box-shadow: 0 10px 11px 0 rgba(0, 0, 0, 0.1);
    display: inline-block;
    font-size: 14px;
    padding: 7px 24px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    font-family: montserrat,sans-serif;
}
.slider_text a:hover {
    background: #fff;
    border: 2px solid #fff;
    color: #333;
}
/*START HTML5 VIDEO*/
.html-video {
    top: 0%;
    left: 0%;
    max-height: 700px;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.html-video:before {
background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.slider-caption {
    position: absolute;
    top: 25%;
    width: 100%;
    left: 0;
    text-align: center;
    z-index: 15;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
}
.slider-caption h2 { padding-top: 100px }
video { min-width: 100% }
/*END HTML5 VIDEO*/
/*START HOME SLIDESHOW*/
#home-slider {
    overflow: hidden;
    position: relative;
}
.caption {
    position: absolute;
    top: 15%;
    margin-top: -104px;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 15;
    font-size: 18px;
    font-weight: 300;
    color: #fff;
}
.carousel-fade .carousel-inner .item {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition-property: opacity;
    transition-property: opacity;
    background-repeat: no-repeat;
    background-size: cover;
    height: 700px;
	 position: relative;
}
.carousel-fade .carousel-inner .item:after {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  content: "";
  left: 0;
  top: 0;
}
.carousel-fade .carousel-inner .active {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 1;
}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-control { z-index: 2 }
.left-control,
.right-control {
    background:#fff;
    color: #222;
    font-size: 24px;
    height: 51px;
    line-height: 48px;
    position: absolute;
    text-align: center;
    top: 50%;
    -webkit-transition: all 0.2s ease 0s;
            transition: all 0.2s ease 0s;
    width: 51px;
    z-index: 20;
}
@media only screen and (max-width:480px) { 
    .left-control,
    .right-control { display: none }
}
.left-control { left: -51px }
.right-control { right: -51px }
.left-control:hover,
.right-control:hover {
    background-color: #00bcd4;
    color: #fff;
}
#home-slider:hover .left-control { left: 0px }
#home-slider:hover .right-control { right: 0px }
#home-slider .fa-angle-down {
    position: absolute;
    left: 50%;
    bottom: 50px;
    color: #fff;
    display: inline-block;
    width: 24px;
    margin-left: -12px;
    font-size: 24px;
    line-height: 24px;
    z-index: 999;
    -webkit-animation: bounce 3000ms infinite;
    animation: bounce 3000ms infinite;
}
/*END HOME SLIDESHOW*/
/*
* ----------------------------------------------------------------------------------------
* 03.END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 04.START ABOUT US DESIGN
* ----------------------------------------------------------------------------------------
*/
.single_about {
background: #222 none repeat scroll 0 0;
box-shadow: 0 4px 2px rgba(0, 0, 0, 0.1);
padding: 40px 20px;
}
.single_about_bg_one{background:#C8B273;}
.single_about_bg_two{background:#083C5A;}
@media only screen and (max-width:480px) { 
.single_about {margin-bottom:30px;}
}
.single_about i {
  background: #fff none repeat scroll 0 0 !important;
  border-radius: 50px;
  color: #333;
  font-size: 24px;
  height: 50px;
  line-height: 50px;
  margin: 0 auto;
  transition: all 0.2s ease 0s;
  width: 50px;
}
.single_about h3 {
    margin-bottom: 10px;
    text-transform: uppercase;
    font-size: 18px;
	color:#fff;
	    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s
}
.single_about p {color:#fff!important;}
.single_about_bg p {color:#aaa;}
/*START CORE FEATURE DESIGN*/
.single_feature { padding: 0 30px }
.feature-box {
background: #fff none repeat scroll 0 0;
border: 1px solid #e8e8e9;
margin-bottom: 25px;
padding: 20px 10px;
transition: all 0.2s ease 0s;
}
.feature-box-mbnone{margin-bottom:0px;}
.feature-box-icon {
    float: left;
    margin-right: 10px;
    position: relative;
    text-align: center;
    top: 5px;
}
.feature-box-icon i {
    background-color: #1cbac8;
    border-radius: 50px;
    color: #fff;
    font-size: 18px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    width: 50px;
	    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.feature-box:hover .feature-box-icon i{background-color: #333;color:#fff;}
.feature-box-info { padding-left: 65px }
.feature-box-info h4 {
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
		    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
@media only screen and (max-width:768px) { 
.feature-box-info h4{font-size: 14px; }
}
.feature-box:hover .feature-box-info h4 {color:#1cbac8;}
@media only screen and (max-width:480px) { 
.single_feature h2 {font-size: 24px; }
}
.single_feature h2 span { color: #1cbac8 }
@media only screen and (max-width:480px) { 
.feature_img img {margin-top:60px;}
}

/*END CORE FEATURE DESIGN*/
/*START WHAT WE OFFER YOU DESIGN*/
.single_why iframe{width:100%;height:360px;border:none}
@media only screen and (max-width:768px) { 
.single_why iframe{margin-bottom:40px;}
}
/*END WHAT WE OFFER YOU DESIGN*/
/* START SKILL DESIGN */
.progress-bar-text {
    color: #333;
    font-family: "Montserrat",sans-serif;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.progress-bar-text span { float: right }
.progress-bar {
    background: #e8e8e9 none repeat scroll 0 0;
    box-shadow: 0 0 0;
    height: 20px;
    margin: 0 0 20px;
    position: relative;
    width: 100%;
}
.progress-bar > span {
    background: #1cbac8 none repeat scroll 0 0;
    display: block;
    height: 100%;
    width: 0;
}
.pb-mb-none{margin-bottom:0}
/* END SKILL DESIGN */
/*
* ----------------------------------------------------------------------------------------
* 04.END ABOUT US DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
 * ----------------------------------------------------------------------------------------
 * 05.START PORTFOLIO DESIGN
 * ----------------------------------------------------------------------------------------
 */
.grid figure {
    position: relative;
    overflow: hidden;
}
.grid figure img {
    position: relative;
    display: block;
    height: 100%;
    width: 100%;
    filter: alpha(opacity=80);
}
.grid figure figcaption {
    padding: 20px;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.grid figure figcaption,
.grid figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.grid figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
    filter: alpha(opacity=0);
}
.grid figure p a { color: #fff }
figure.effect-sarah {background: #1cbac8 none repeat scroll 0 0;
margin-top: -1px; }
figure.effect-sarah img {
    max-width: none;
    width: calc(100% + 20px);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
figure.effect-sarah:hover img {
    opacity: 0.1;
    filter: alpha(opacity=10);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
figure.effect-sarah figcaption { text-align: left }
figure.effect-sarah h3 { display: none }
figure.effect-sarah:hover h3 {
    display: block;
    overflow: hidden;
    padding: 10px 0;
    position: relative;
    color: #fff;
}
figure.effect-sarah h3:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #fff;
    content: '';
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
}
figure.effect-sarah:hover h3:after {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
figure.effect-sarah p {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translate3d(100%, 0px, 0px);
            transform: translate3d(100%, 0px, 0px);
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
            transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    padding: 10px 0;
    font-size: 14px;
    font-weight: 700;
}
figure.effect-sarah:hover p {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.portfolio_btn { padding-top: 50px }

/*START PROJECT MODEL*/
.modal-dialog {
  margin: 30px auto;
  width: 800px;
}
.modal-title {
  color: #333;
  margin: 0;
  text-transform: uppercase;
}
.modal-content{
	padding: 10px 30px;
	border-radius: 0px;
}
.modal-body{
	margin-bottom: 15px;
}
.modal-body p{
margin-top: 10px;
}
.project-list label{
color: #333;
margin-bottom: 0;
width: 100px;
}
.project-list li{
font-family: "Merriweather",sans-serif;
padding: 7px 0;
font-size: 14px;
}
.project-list li a{
color: #777;
font-size: 13px;
transition: all 0.4s ease 0s;
}
.project-list li a:hover{color:#1cbac8;}
.model_social_profile{
overflow: hidden;
margin-bottom: 30px;
}
.model_social_profile h4{
border-bottom: 1px solid #e8e8e9;
color: #333;
margin-bottom: 20px;
padding-bottom: 10px;
text-transform: uppercase;
}
.model_social_profile ul{margin:0;padding:0;list-style:none}
.model_social_profile ul li{float:left}
.model_social_profile ul li a{}
.model_social_profile ul li a i{
border: 1px solid #ddd;
border-radius: 50px;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
color: #fff;
display: block;
font-size: 18px;
height: 45px;
line-height: 45px;
margin: 5px;
text-align: center;
transition: all 0.4s ease 0s;
width: 45px;
}
.model_social_profile ul li a i:hover{background: #fff  none repeat scroll 0 0;color:#333;}
.model_facebook{background: #1c58a1  none repeat scroll 0 0;}
.model_twitter{background: #0cbce3 none repeat scroll 0 0;}
.model_google{background: #f04537 none repeat scroll 0 0;}
.model_pinterest{background: #B40105 none repeat scroll 0 0;}
.btn-model-bg {
  background: #1cbac8 none repeat scroll 0 0;
  border: 2px solid #1cbac8;
  border-radius: 3px;
  color: #fff;
  padding: 8px 20px;
  text-transform: uppercase;
  transition: all 0.2s ease 0s;
  font-size: 12px;
}
.btn-model-bg:hover,
.btn-model-bg:focus {
    background: #333;
    color: #fff;
    border: 2px solid #333;
}
/*END PROJECT MODEL*/
/*
 * ----------------------------------------------------------------------------------------
 * 05.END PORTFOLIO DESIGN
 * ----------------------------------------------------------------------------------------
 */
 /*
* ----------------------------------------------------------------------------------------
* 06.START SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/
.our_service{position: relative;padding-top:60px;padding-bottom:30px;}
.our_service::before{
background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.services-box {
background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0;
border-radius: 3px;
clear: both;
margin-bottom: 30px;
padding: 30px 20px;
}
.services-box-icon {
    float: left;
    margin-right: 10px;
    position: relative;
    text-align: center;
    top: 5px;
}

.services-box-icon i {
    background-color: #1cbac8;
    border-radius: 50px;
    color: #fff;
    font-size: 18px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    width: 50px;
	    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.services-box:hover .services-box-icon i{background-color: #fff;color:#333;}
.services-box-info { padding-left: 65px }
.services-box-info h4 {
	color:#fff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
		    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.services-box-info p{color:#fff;} 
@media only screen and (max-width:768px) { 
.services-box-info h4{font-size: 14px; }
}
.services-box:hover .services-box-info h4 {color:#1cbac8;}
/*
* ----------------------------------------------------------------------------------------
* 06.END SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 07.START OUR PROCESS DESIGN
* ----------------------------------------------------------------------------------------
*/
.our_process{position: relative;padding-top: 60px;padding-bottom: 30px;}
.our_process::before{
background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.icon-box-secondary {
background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0;
border-radius: 3px;
clear: both;
margin-bottom: 30px;
padding: 20px;
}
.icon-box-icon {
  display: inline-block;
  float: left;
  height: 50px;
  line-height: 66px;
  margin-right: 10px;
  text-align: center;
  width: 50px;
}
.icon-box-icon i {
  color: #1cbac8;
  font-size: 36px;
}
.icon-box-info {
  padding-left: 70px;
}
.icon-box-info h4{
color: #fff;
text-transform: uppercase;
font-size: 16px;
}
.icon-box-info p{color:#fff;}

/*
* ----------------------------------------------------------------------------------------
* 07.END OUR PROCESS DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 08.START TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/
@media only screen and (max-width:768px) { 
    .tema-member { margin-bottom: 20px }
}
.tema-member .team-thumbnail {
    border: 1px solid #ddd;
    position: relative;
}
.tema-member .team-thumbnail .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: block;
    opacity: 0;
    filter: alpha(opacity=0);
    bottom: -1px;
    height: 100%;
    background-color: #fff;
    border: 1px solid #1cbac8;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.info {padding: 30px 10px 10px 10px; }
.tema-member .team-thumbnail .social-media {
    position: absolute;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    bottom: 0;
    -webkit-transform: translateY(100%);
    -moz-webkit-transform: translateY(100%);
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.tema-member .team-thumbnail .social-media a { display: inline-block }
.tema-member .team-thumbnail .social-media a i {
    font-size: 20px;
    color: #fff;
    width: 48px;
    margin: -2px;
    line-height: 48px;
    height: 48px;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.tema-member .team-thumbnail .social-media a i:hover { color: #fff }
.tema-member .team-thumbnail .social-media a.facebook i:hover { background: #507CBE }
.tema-member .team-thumbnail .social-media a.twitter i:hover { background: #63CDF1 }
.tema-member .team-thumbnail .social-media a.google i:hover { background: #F16261 }
.tema-member .team-thumbnail .social-media a.linkedin i:hover { background: #0077B5 }
.tema-member .info h4 {
    color: #42423f;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 0;
    padding-bottom: 10px;
    text-transform: uppercase;
}
.tema-member .info h5 {
    color: #42423f;
    margin-top: 0;
    text-transform: uppercase;
    font-weight: 600;
    padding-bottom: 10px;
    letter-spacing: 1px;
}
.tema-member .info p {
    color: #42423f;
    margin-bottom: 0;
    line-height: 24px;
}
.tema-member:hover .social-media {
    -webkit-transform: translateY(-90%);
    -moz-webkit-transform: translateY(-90%);
    -webkit-transform: translateY(-90%);
    -ms-transform: translateY(-90%);
    transform: translateY(-90%);
}
.tema-member:hover .overlay {
    opacity: 1;
    filter: alpha(opacity=100);
}
/*
* ----------------------------------------------------------------------------------------
* 08.END TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 09.START TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
.client_testimonial{position: relative;padding-top: 60px;}
.client_testimonial::before{
background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.testimonial-container {
  padding: 30px;
  background: rgba(0,0,0,0.4);
}
.padding-top-0{
	padding-top: 0;
}
.testimonial_img { float: left }
.testimonial_img img {
    border-radius: 100px;
    margin-bottom: 30px;
    width: 100px;
    height: 100px;
}
.single_testimonial { padding-left: 130px }
.single_testimonial h4 {
    color: #fff;
    margin: 0;
    padding-bottom: 15px;
	text-transform: uppercase;
}
.single_testimonial h5 {
color: #fff;
margin: 0;
padding-bottom: 13px;
text-transform: uppercase;
}
.single_testimonial p { color: #fff }
/*START COMPANY LOGO*/
.partner { background: #f7f7f7 }
.company_logo img {
    height: 100%;
    padding: 10px;
    width: 100%;
}
@media only screen and (max-width:768px) { 
    .company_logo img { margin-bottom: 20px }
}
/*END COMPANY LOGO*/
/*
* ----------------------------------------------------------------------------------------
* 09.END TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
 * ----------------------------------------------------------------------------------------
 * 10.START COUNT TIMER
 * ----------------------------------------------------------------------------------------
 */
.counter_feature { background: #1cbac8 none repeat scroll 0 0 }
.count {
    background: #040e18 none repeat scroll 0 0;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
}
.counter {
border-right: 1px solid #333;
padding: 60px 30px;
transition: all 0.2s ease 0s;
}
.counter-last {border-right: 0px}
.counter i {
    border: 1px solid #fff;
    color: #fff;
    padding: 22px;
    border-radius: 100px;
    margin-bottom: 20px;
    width: 70px;
    height: 70px;
    font-size: 22px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.counter h1 {
    font-weight: 700;
    color: #fff;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.counter p {
color: #fff;
font-size: 16px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
@media only screen and (max-width:768px) { 
    .counter p { font-size: 18px }
}

@media only screen and (max-width:480px) { 
    .counter p { font-size: 16px }
}
@media only screen and (max-width:360px) { 
    .counter p { font-size: 17px }
}
@media only screen and (max-width:320px) { 
    .counter p { font-size: 17px }
}
.count_line {
    background: #1cbac8 none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 20px auto;
    width: 50px;
}
/*
 * ----------------------------------------------------------------------------------------
 * 10.END COUNT TIMER
 * ----------------------------------------------------------------------------------------
 */


/*
* ----------------------------------------------------------------------------------------
* 11.START PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/
.pricing_table { background: #fff }
.pricing_table .plan.recommended .head { margin-bottom: 20px }
.plan {
    background: #f8f8f8 none repeat scroll 0 0;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
    min-height: 100px;
    padding-bottom: 25px;
    -webkit-transition: 0.2s;
    transition: 0.2s;
}
@media only screen and (max-width:480px) { 
    .plan { margin-bottom: 30px }
}
.plan .head {
    color: #333;
    padding: 15px 0;
    text-transform: uppercase;
}
.plan .head h1,
.plan .head h2,
.plan .head h3 {
    padding: 0;
    margin: 0;
    font-weight: 300;
}
.plan .price { border-top: 1px solid #eee }
.plan .price h3 {
    font-size: 82px;
    line-height: 1;
    vertical-align: top;
    color: #333;
}
.plan .price h3 span {
    font-size: 38px;
    vertical-align: top;
    position: relative;
    margin: 6px 0 0 -7px;
    display: inline-block;
}
.plan .price h4 {
    color: #aaa;
    font-size: 14px;
}
.plan ul {
    list-style-type: none;
    padding: 20px;
}
.plan ul li {
    border: 1px solid #ddd;
    color: #333;
    font-size: 18px;
    font-weight: 300;
    margin-top: -1px;
    padding: 10px 15px;
    text-transform: capitalize;
}
.plan ul li a {
    text-decoration: underline;
    color: #e6e9ed;
}
.plan.recommended {
    box-shadow: 0 0 22px rgba(10, 10, 10, 0.42);
    position: relative;
    z-index: 99;
}
.plan.recommended .btn { margin-bottom: 10px }
/*
* ----------------------------------------------------------------------------------------
* 11.END PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 12.START NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.newsletter{position: relative;}
.newsletter::before{
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  content: "";
  left: 0;
  top: 0;
}
.signup_form{}
.signup_form h3{
color: #fff;
margin-bottom: 30px;
margin-top: 0;
text-transform: uppercase;
}
.signup_form input{margin-bottom: 30px;}
.signup_form button {
font-family: montserrat,sans-serif;
font-size: 14px;
font-weight: 600;
letter-spacing: 1px;
padding: 10px 30px;
}
.signup_form button:hover{
background: #fff none repeat scroll 0 0!important; 
color: #333;
border:2px solid #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 12.END NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
 * ----------------------------------------------------------------------------------------
 *  13.START RESPONSIVE PROMOTION DESIGN
 * ----------------------------------------------------------------------------------------
 */
 @media only screen and (max-width:768px) { 
.device_responsive { margin-bottom: 40px }
}
.device_img { text-align: center }
.device_img img { display: inline-block }
.device_responsive h3 {
border-bottom: 1px solid #e8e8e9;
color: #333;
line-height: 34px;
margin-bottom: 20px;
margin-top: 0;
padding-bottom: 10px;
text-transform: uppercase;
}
@media only screen and (max-width:480px) { 
    .device_responsive h2 { font-size: 22px }
}
.device_responsive p { margin-bottom: 30px }
/*
 * ----------------------------------------------------------------------------------------
 *  13.END RESPONSIVE PROMOTION DESIGN
 * ----------------------------------------------------------------------------------------
 */
/*
* ----------------------------------------------------------------------------------------
* 14.START BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/
.single_blog {
    border: 1px solid #ddd;
    padding: 20px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.single_blog:hover {
    box-shadow: 0px 8px 24px rgba(0,0,0,0.25);
    border: 1px solid #1cbac8;
}
@media only screen and (max-width:480px) { 
    .single_blog { margin-bottom: 20px }
}
.single_blog_img { overflow: hidden }
.single_blog_img img {
    display: block;
    position: relative;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.single_blog:hover .single_blog_img img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.post_date {
background: #1cbac8 none repeat scroll 0 0;
color: #fff;
font-weight: 600;
left: 36px;
margin-bottom: 0 !important;
margin-top: -40px;
padding: 8px 20px;
position: absolute;
text-transform: uppercase;
}
.single_blog h4 {
margin-top: 15px;
text-transform: uppercase;
}
.single_blog p {
    text-align: justify;
    margin-bottom: 20px;
}
.single_blog .read_more {
	background: #1cbac8 none repeat scroll 0 0;
	border-radius: 3px;
	box-shadow: 0 10px 11px 0 rgba(0, 0, 0, 0.1);
	color: #fff;
	font-size: 14px;
	padding: 10px 20px;
}
.single_blog:hover .read_more {background: #333 none repeat scroll 0 0; color: #fff }
/*
* ----------------------------------------------------------------------------------------
* 14.END BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 15.START PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/
.buy_now {
    background: #040e18;
    padding: 30px 0;
}
.buy_now_title {
    color: #fff;
    font-family: montserrat,sans-serif;
    font-weight: 300;
    margin: 0;
    text-transform: uppercase;
    font-size: 18px;
}
@media only screen and (max-width:360px) { 
    .buy_now_title { font-size: 18px }
}
/*
* ----------------------------------------------------------------------------------------
* 15.END PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 16.START CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
.contact_form{position: relative;}
.contact_form::before{
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  content: "";
  left: 0;
  top: 0;
}
.single-address {
background: rgba(28, 186, 200, 0.3) none repeat scroll 0 0;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
padding: 30px 15px;
transition: all 0.2s ease 0s;
}
@media only screen and (max-width:768px) { 
    .single-address { margin-bottom: 20px; }
}
.single-address h4 {
color: #fff;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
.single-address p {
    margin-bottom: 0;
    color: #fff;
    -webkit-transition: all 0.2s ease 0s;
            transition: all 0.2s ease 0s;
}
.contact { margin-top: 30px }
#contact-form .form-control {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	border-color: -moz-use-text-color -moz-use-text-color #ccc;
	border-radius: 0;
	border-style: none none solid;
	border-width: 0 0 1px;
	box-shadow: none;
	color: #fff;
	height: 45px;
	padding: 0;
	transition: all 0.2s ease 0s;
}
#contact-form textarea.form-control{
	height: auto;
}
#contact-form .form-control::-moz-placeholder {
    color: #fff;
    opacity: 1;
    filter: alpha(opacity=100);
}
#contact-form .form-control:focus {
    border-radius: 0;
    background: none;
    box-shadow: none;
    outline: 0 none;
	border-color: #1cbac8;
}
.btn-contact-bg,
button, html input[type="button"], input[type="reset"], input[type="submit"] 
 {
    background: #1cbac8 none repeat scroll 0 0;
    border: 1px solid #1cbac8;
    border-radius: 0;
    box-shadow: 0 11px 10px 0 rgba(0, 0, 0, 0.1);
    color: #fff;
    font-family: montserrat,sans-serif;
    font-size: 14px;
    padding: 10px 30px;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease 0s;
            transition: all 0.2s ease 0s;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus

 {
    background: #fff;
    border: 1px solid #fff;
    color: #333;
}
button:hover, 
html input[type="button"]:hover, 
input[type="reset"]:hover, 
input[type="submit"]:hover,
button:focus, 
html input[type="button"]:focus, 
input[type="reset"]:focus, 
input[type="submit"]:focus {
	background: #222;
	color: #fff;
	border-color: #222;
}
.mb0 { margin-bottom: 0 }
.map { height: 450px }
.success {
    background: #fff none repeat scroll 0 0;
    color: #1cbac8;
    font-weight: 700;
    padding: 20px;
    text-align: center;
}
/*
* ----------------------------------------------------------------------------------------
* 16.END CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 17.START SOCIAL PROFILE DESIGN
* ----------------------------------------------------------------------------------------
*/
.footer_social ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.footer_social ul li a i{ 
color: #fff;
display: block;
font-size: 24px;
padding: 40px;
transition: all 0.2s ease 0s;
}
.footer_social ul li a i:hover {
    background: #333!important;
    color: #fff;
}
.facebook{background: #1C58A1;}
.twitter{background: #0CBCE3;}
.google{background: #F04537;}
.linkedin{background: #1C58A1;}
.instagram{background: #B67F61;}
.youtube{background: #E31B1B;}
/*
* ----------------------------------------------------------------------------------------
* 17.END SOCIAL PROFILE DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 18.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.footer {
    padding: 30px 0;
    background-color: #040E18;
}
.footer img { padding-bottom: 30px }
.footer_copyright {
    color: #aaa;
    font-family: "Montserrat",sans-serif;
    font-size: 14px;
    margin: 0;
}
/*
* ----------------------------------------------------------------------------------------
* 18.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/