/*
Author       : theme_ocean
Template Name: Kothari - App Landing Page
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. START BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME DESIGN
    04. START ABOUT US DESIGN
    05. START ABOUT US DESIGN
    06. START HOW IT WORKS DESIGN
    07. START FEATURES DESIGN
    08. START APP SCREENSHOT DESIGN
    09. START COUNTER & VIDEO DESIGN
    10. START TEAM DESIGN
    11. START TESTIMONIAL DESIGN
    12. START PRICING DESIGN
    13. START FAQ DESIGN
    14. START DOWNLOAD BUTTON DESIGN
    15. START BLOG DESIGN
    16. START COMPANY PARTNER LOGO
    17. START NEWSLETTER DESIGN
    18. START CONTACT DESIGN
    19. START  MAP & SOCIAL DESIGN
    20. START FOOTER DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
color: #333;
font-family: 'Quicksand', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 24px;
background:#fff;
overflow-x:hidden;
}
html,
body { height: 100% }
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Quicksand', sans-serif;
  letter-spacing: 0px;
  margin-top: 0px; 
  color: #333;
  font-weight: 400;
}
a {
font-family: 'Quicksand', sans-serif;	
text-decoration: none;
transition: all 0.2s ease 0s;
}
a:hover {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
p {
    margin-bottom: 0;
}
ul,
li {
    margin: 0;
    padding: 0;
}

::-webkit-input-placeholder {
  font-weight: 300;
  font-family: 'Quicksand', sans-serif; }

:-moz-placeholder {
  font-weight: 300;
 font-family: 'Quicksand', sans-serif; }

::-moz-placeholder {
  font-weight: 300;
  font-family: 'Quicksand', sans-serif; }

:-ms-input-placeholder {
  font-weight: 300;
  font-family: 'Quicksand', sans-serif; }
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: 99999;	
}
.spinner {
	width: 50px;
	height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	font-size: 10px;
	text-indent: -12345px;
	z-index: 10000;
}

.double-bounce1, .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #10c7e9;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
.section-padding {padding: 80px 0;}
.section-paddingsm {padding: 40px 0;}

/*START SECTION TITLE DESIGN*/
.section-title{margin-bottom:60px;}
.section-title  h1 {
color: #333;
font-size: 36px;
font-weight: 600;
margin-bottom: 0;
margin-top: 0;
position: relative;
text-transform: capitalize;
}

@media only screen and (max-width:480px) { 
.section-title  h1  {font-size:24px;}
}
.icon_wrap {
display: inline-block;
padding: 10px 0;
position: relative;
}
.icon_wrap:before {
    position: absolute;
    content: '';
    background-color: #10c7e9;
    height: 2px;
    left: -30px;
    width: 100%;
    top: 50%;
}
.icon_wrap:after {
    position: absolute;
    content: '';
    background-color: #10c7e9;
    height: 2px;
    right: -30px;
    width: 100%;
    top: 50%;
}
.icon_wrap i {
    font-size: 22px;
    color: #10c7e9;
}
.icon_wrap_white:before {
    position: absolute;
    content: '';
    background-color: #fff;
    height: 2px;
    left: -30px;
    width: 100%;
    top: 50%;
}
.icon_wrap_white:after {
    position: absolute;
    content: '';
    background-color: #fff;
    height: 2px;
    right: -30px;
    width: 100%;
    top: 50%;
}
.section-title-white-span{background: #fff !important;}
h1.section-title-white{
color: #fff;
font-size: 36px;
font-weight: 500;
margin-top: 0;
position: relative;
margin-top: 0;
text-transform: capitalize;
}
@media only screen and (max-width:480px) { 
h1.section-title-white {font-size:24px;}
}
p.section-title-white{color:#fff;}
.section-title  p{
padding: 0 10px;
width: 80%;
margin: auto;	
}
@media only screen and (max-width:768px) { 
.section-title  p{
padding: 0 10px;
width: 90%;
margin: auto;	
}
}
/*END SECTION TITLE DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
background: #fff none repeat scroll 0 0;
border-radius: 30px;
bottom: 5px;
box-shadow:0 0 10px rgba(0, 0, 0, 0.08);
color: #10c7e9;
cursor: pointer;
font-size: 18px;
height: 50px;
line-height: 50px;
opacity: 1;
position: fixed;
right: 5px;
text-align: center;
transition: all 0.2s ease 0s;
width: 50px;
}
.topcontrol:hover {
    background: #222;
    color: #fff;
}
/*END SCROLL TO TOP*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 02.START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.navbar {padding: 25px 0;}
.bg-faded {
background-color: transparent;
transition: all 0.3s ease 0s;
}
@media only screen and (max-width:768px) { 
.bg-faded {background:#333;}
}
.navbar-brand img {
  width: 150px;
}
.navbar-light .navbar-nav .nav-link {
color: #fff;
font-family: quicksand,sans-serif;
font-size: 16px;
font-weight: 500;
padding: 0 18px;
text-transform: capitalize;
}
@media only screen and (max-width:480px) { 
.navbar-light .navbar-nav .nav-link {padding: 8px 0px;}
}
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
  color: #10c7e9 !important;
}
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.open,
.navbar-light .navbar-nav .open > .nav-link {
  color: #10c7e9  !important;
}
.navbar-light .navbar-toggler {
  border-color: #fff;
  border-radius: 0px;
}
.navbar-light .navbar-toggler {
  float: right;
  margin: 14px;
  cursor: pointer;
    background-color: #10c7e9;
  border-color: #10c7e9;
  border-radius: 0;
}
.navbar-light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox=\'0 0 32 32\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Cpath stroke=\'rgba(0, 0, 0, 0.5)\' stroke-width=\'2\' stroke-linecap=\'round\' stroke-miterlimit=\'10\' d=\'M4 8h24M4 16h24M4 24h24\'/%3E%3C/svg%3E");
}
.navbar-light .navbar-toggler i {
  color: #666!important;
}
.site-navigation {
    border-radius: 0px;
}
@media only screen and (max-width:480px) { 
.collapse.show {
  display: block;
  padding: 0!important;
}
}
.navbar-fixed {
    z-index: 99999;
    position: fixed;
    width: 100%;
	padding:10px 0;
    top: 0;
    -webkit-animation: fadeInDown 800ms;
    animation: fadeInDown 800ms;
    -webkit-backface-visibility: hidden;
    border-radius: 0px;
    background:#fff;
	 box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width:768px) { 
.navbar-fixed {background:#fff;}
}
.navbar-fixed.navbar-light .navbar-nav .nav-link{color:#333;}

@media only screen and (max-width:768px) { 
.navbar-fixed.navbar-light .navbar-nav .nav-link{color:#333;}
}
/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03.START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
#particles-js {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}
@media only screen and (max-width:768px) { 
#fw_al_007 {margin-top: 114px;}
}
@media only screen and (max-width:480px) { 
#fw_al_007 {margin-top: 114px;}
}
.home_bg {
    height: 700px;
    position: relative;
}
@media only screen and (max-width:768px) { 
.home_bg {height: 1350px;}
}

@media only screen and (max-width:480px) { 
.home_bg {height: 1150px;}
}
@media only screen and (max-width:414px) { 
.home_bg {height: 1150px;}
}
@media only screen and (max-width:375px) { 
.home_bg {height: 1150px;}
}

@media only screen and (max-width:360px) { 
.home_bg {height: 1100px;}
}
@media only screen and (max-width:320px) { 
.home_bg {height: 1100px;}
}
.home_bg:before {
    background: rgba(0, 0, 0, 0.4);
    content: "";
    height: 100%;
    filter: alpha(opacity=80);
    position: absolute;
    width: 100%;
}
.home_bg_solid{background:#10c7e9;}
.hero-text h2 {
color: #fff;
font-size: 48px;
font-weight: 700;
letter-spacing: 0;
line-height: 56px;
margin-bottom: 0;
padding-top: 250px;
text-transform: capitalize;
}
@media only screen and (max-width:768px) { 
.hero-text h2 {
font-size: 40px;
line-height: 46px;
}
}
@media only screen and (max-width:480px) { 
    .hero-text h2 {
		padding-top: 200px;
        font-size: 30px;
        line-height: 40px;
    }
}
@media only screen and (max-width:360px) { 
    .hero-text h2 {
        font-size: 26px;
        line-height: 34px;
    }
}
.hero-text p {
color: #fff;
font-weight: 400;
padding: 16px 0 40px;
}
.home_btn{}
.google-bg {
  background: #fff none repeat scroll 0 0;
  border-radius: 5000px;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 20px;
  overflow: hidden;
  padding: 15px 30px;
  transition: all 0.3s ease 0s;
}
.google-bg:hover{box-shadow:0 12px 22px rgba(0,0,0,.15);}

.hero-text-img {
    padding-top: 150px;
}
@media only screen and (max-width:768px) { 
.hero-text-img{padding-top:0px; }
}
@media only screen and (max-width:480px) { 
.hero-text-img{
display: inline-block;
}
.hero-text-img img {width: 100%;}
}

/*
* ----------------------------------------------------------------------------------------
* 03.END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
 * ----------------------------------------------------------------------------------------
 * 04.START ABOUT US DESIGN
 * ----------------------------------------------------------------------------------------
 */
 .about-content {
  padding-top: 98px;
}
.single_about{
padding-bottom: 40px;
position: relative;
transition: all 0.3s ease 0s;
}
@media only screen and (max-width:480px) { 
.about-content{padding-bottom: 30px;}
}
@media only screen and (max-width:480px) { 
.single_about{margin-bottom: 60px;}
}
.single_about::after {
  background: transparent none repeat scroll 0 0;
  border-bottom: 1px solid #eee;
  border-top: 1px solid #eee;
  bottom: 0;
  content: "";
  height: 10px;
  left: 0;
  position: absolute;
  transition: all 0.5s ease 0s;
  width: 100%;
}
.single_about:hover:after{
    border-color: #10c7e9;
}
.single_about .single_about_icon{
    width: 80px;
    height: 80px;
    line-height: 80px;
    display: inline-block;
    font-size: 30px;
    color: #10c7e9;
    border: 1px solid #e1e1e1;
    position: relative;
    transform: rotate(-45deg);
    transition: all 0.3s ease 0s;
}
.single_about:hover .single_about_icon{
    background: #10c7e9;
    color: #fff;
    border-color: #10c7e9;
}
.single_about .single_about_icon:after{
    content: "";
    width: 100%;
    height: 100%;
    box-shadow: 0 0 0 2px #e1e1e1;
    position: absolute;
    top: -5px;
    left: -5px;
    opacity: 0;
    padding: 5px;
    transform: scale(1.2);
    box-sizing: content-box;
    transition: all 0.2s ease 0s;
}
.single_about:hover .single_about_icon:after{
    transform: scale(1);
    opacity: 1;
}
.single_about .single_about_icon i{
    transform: rotate(45deg);
}

.single_about h4{
font-weight: 500;
margin-bottom: 15px;
margin-top: 50px;
text-transform: capitalize;
}
.single_about p{
}
/*
 * ----------------------------------------------------------------------------------------
 * 04.END ABOUT US DESIGN
 * ----------------------------------------------------------------------------------------
*/
 
/*
 * ----------------------------------------------------------------------------------------
 *  05.START ABOUT US DESIGN
 * ----------------------------------------------------------------------------------------
*/
.about-us {
background: #f9f9f9 none repeat scroll 0 0;
padding-bottom: 60px;
}
.about-us-content { margin-top: 0px }
.about-us-content h2 {
font-size: 26px;
font-weight: 600;
margin: 0 0 24px;
}
.about-us-content p { margin-bottom:50px }
@media only screen and (max-width:768px) { 
    .about_img { width: 100% }
}
@media only screen and (max-width:768px) { 
    .about_img { margin-top: 60px;
text-align: center; }
}
.btn-google-bg {
  background: #fff!important;
  border-radius: 5000px;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 20px;
  overflow: hidden;
  padding: 15px 30px;
  transition: all 0.3s ease 0s;
}
.btn-google-bg:hover{box-shadow:0 12px 22px rgba(0,0,0,.15);}
@media only screen and (max-width:480px) { 
.btn-google-bg {margin-bottom: 20px;}
}
.btn-app-bg {
  background: #333 none repeat scroll 0 0;
  border-radius: 5000px;
  display: inline-block;
  overflow: hidden;
  margin-bottom: 20px;
  padding: 15px 30px;
  transition: all 0.3s ease 0s;
}
.btn-app-bg:hover{box-shadow:0 12px 22px rgba(0,0,0,.15);}
/*
 * ----------------------------------------------------------------------------------------
 *  05.END  ABOUT US DESIGN
 * ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 06.START HOW IT WORKS DESIGN
* ----------------------------------------------------------------------------------------
*/
.single_howitwork {
	margin-top: 80px;
}
@media only screen and (max-width:768px) { 
    .single_howitwork { padding-top: 0px }
}
.single_howitwork .single_howitwork_icon{
border: 1px solid #e1e1e1;
color: #10c7e9;
display: inline-block;
font-size: 30px;
height: 80px;
line-height: 80px;
margin-left: 15px;
position: relative;
text-align: center;
transform: rotate(-45deg);
transition: all 0.3s ease 0s;
width: 80px;
}
@media only screen and (max-width:480px) { 
.single_howitwork .single_howitwork_icon {margin-left: 25px; }
}
.single_howitwork:hover .single_howitwork_icon{
    background: #10c7e9;
    color: #fff;
    border-color: #10c7e9;
}
.single_howitwork .single_howitwork_icon:after{
    content: "";
    width: 100%;
    height: 100%;
    box-shadow: 0 0 0 2px #e1e1e1;
    position: absolute;
    top: -5px;
    left: -5px;
    opacity: 0;
    padding: 5px;
    transform: scale(1.2);
    box-sizing: content-box;
    transition: all 0.2s ease 0s;
}
.single_howitwork:hover .single_howitwork_icon:after{
    transform: scale(1);
    opacity: 1;
}
.single_howitwork .single_howitwork_icon i{
    transform: rotate(45deg);
}
.single_howitwork h3 {
display: block;
font-size: 20px;
font-weight: 600;
margin-bottom: 15px;
margin-top: 60px;
text-transform: capitalize;
}
.single_howitwork span {
    border-bottom: 1px dashed #ccc;
    width: 80px;
    display: none;
	margin-bottom: 10px;
}
.single_howitwork p { margin-bottom: 0 }
.single_howitwork_img {
margin-top: 40px;
text-align: center;
}
/*
* ----------------------------------------------------------------------------------------
* 06.END HOW IT WORKS DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 07.START FEATURES DESIGN
* ----------------------------------------------------------------------------------------
*/
.more_features {
background:#f9f9f9;
padding-bottom: 50px;
padding-top: 80px;
}
.single_more_feature {
background: #fff none repeat scroll 0 0;
box-shadow: 0 1px 2px 0 rgb(236, 236, 236);
margin-bottom: 30px;
padding: 60px 42px;
}
.single_more_feature .single_icon{
    width: 229px;
    height: 229px;
    border-radius: 50%;
    background: transparent;
    border: 13px solid #f7f7f7;
    margin: 0 auto 20px;
    padding: 35px 0 0;
    transition: all 0.25s ease 0s;
}
.single_more_feature:hover .single_icon{
    background:#10c7e9;
}
.single_more_feature .single_icon span{
border-bottom: 5px solid #10c7e9;
color: #10c7e9;
display: inline-block;
font-family: ubuntu,sans-serif;
font-size: 40px;
font-weight: 500;
line-height: 50px;
margin-bottom: 16px;
transition: all 0.25s ease 0s;
}
.single_more_feature:hover .single_icon span{
    color: #fff;
    border-bottom: 5px solid #fff;
}
.single_more_feature .single_icon h3{
color: #333;
display: block;
font-size: 20px;
font-weight: 500;
line-height: 24px;
margin-top: 0;
text-transform: capitalize;
transition: all 0.25s ease 0s;
}
.single_more_feature:hover .single_icon h3{
    color: #fff;
}
.single_more_feature p {
	margin: 0;
}
/*
* ----------------------------------------------------------------------------------------
* 07.END FEATURES DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 08.START APP SCREENSHOT DESIGN
* ----------------------------------------------------------------------------------------
*/
.s-slider .item { margin: 5px }
.s-slider .item img {
    display: block;
    width: 100%;
    height: auto;
}
.s-slider .owl-wrapper {
  margin-bottom: 50px;
}
.owl-theme .owl-controls {
    margin-top: 50px;
    text-align: center;
}
.owl-theme .owl-controls .owl-page { display: inline-block }
.owl-controls .owl-page,
.owl-controls .owl-buttons div { cursor: pointer }
.owl-theme .owl-controls .owl-page span {
background-color: #10c7e9 !important;
border-radius: 20px;
display: block;
height: 12px;
margin: 5px 7px;
width: 12px;
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span { background-color: #fff }
.owl-theme .owl-controls {
  display: block !important;
  margin-top: 20px;
  text-align: center;
}
/*
* ----------------------------------------------------------------------------------------
* 08.END APP SCREENSHOT DESIGN
* ----------------------------------------------------------------------------------------
*/
 
/*
* ----------------------------------------------------------------------------------------
* 09.START COUNTER & VIDEO DESIGN
* ----------------------------------------------------------------------------------------
*/ 
.video_section {
position: relative;
}
.video_section:before {
    background:rgba(0, 0, 0, 0) linear-gradient(rgba(34, 38, 75, 0.1), rgba(34, 38, 75, 0.5)) repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.complete-project-area {}
.counter_overlay{
/*background:rgba(0, 0, 0, 0.3);*/
padding-bottom: 40px;
padding-top: 100px;
}
.single-project-complete{
margin-bottom: 60px;
text-align: center;
}
.brnone{border-right: 0px ;}
@media only screen and (max-width:768px) { 
.single-project-complete {margin-bottom:30px;}
}
@media only screen and (max-width:480px) { 
.single-project-complete {margin-bottom:60px;}
}
.single-project-complete i{
color: #fff;
font-size: 30px;
margin-bottom: 5px;
}
.single-project-complete h2 {
color: #fff;
font-size: 45px;
font-weight: 600;
margin: 10px 0 15px;
}
.single-project-complete h3 {
color: #fff;
font-size: 16px;
font-weight: 600;
letter-spacing: 0.6px;
margin-top: 0;
text-transform: uppercase;
}

.company_video {
padding-top: 200px;
}
@media only screen and (max-width:768px) { 
.company_video {padding-top: 180px;}
}
@media only screen and (max-width:480px) { 
.company_video {
padding:90px 0;
}
}
.mfp-iframe-holder .mfp-content {
  line-height: 0;
  margin-top: 55px;
  max-width: 900px;
  width: 100%;
}
.company_video a {
  background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
  border: 10px solid rgba(0, 0, 0, 0.05);
  border-radius: 100px;
  color: #10c7e9;
  display: block;
  font-size: 30px;
  height: 100px;
  line-height: 80px;
  margin-bottom: auto;
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  text-align: center;
  width: 100px;
}
/*
* ----------------------------------------------------------------------------------------
* 09.END COUNTER & VIDEO DESIGN
* ----------------------------------------------------------------------------------------
*/ 

/*
* ----------------------------------------------------------------------------------------
* 10.START TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/ 
.our_team{background:#f9f9f9;}
.single_team{
background: #fff none repeat scroll 0 0;
border-radius: 5px;
box-shadow: 0 5px 15px 0 rgb(236, 236, 236);
margin: 0 15px 50px;
padding-bottom: 40px;
}
.single_team img{margin-bottom:35px;}
.single_team h4{
font-size: 18px;
font-weight: 700;
letter-spacing: 1px;
text-decoration: none;
text-transform: uppercase;	
}
.single_team span{
background: #333 none repeat scroll 0 0;
display: block;
height: 2px;
margin: 20px auto 15px;
width: 40px;
}
.single_team p{
margin-bottom: 20px;
padding: 0 30px;
}

.single_team_social ul{list-style: outside none none;
text-align: center;} 
.single_team_social ul li{display: inline-block;} 
.single_team_social a {
  display: block;
}
.single_team_social ul li a i{
border-radius: 50%;
box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
color: #fff;
cursor: pointer;
display: inline-block;
height: 40px;
line-height: 40px;
margin: 5px;
overflow: hidden;
padding: 0;
position: relative;
transition: all 0.2s ease-in-out 0s;
vertical-align: middle;
width: 40px;
z-index: 1;
}
.facebook{background:#3B5998;}
.twitter{background:#55ACEE;}
.gplus{background:#DD4B39;}
.linkedin{background:#0082CA;}
.instagram{background:#2E5E86;}

.owl-theme .owl-controls {
    margin-top: 50px;
    text-align: center;
}
.owl-theme .owl-controls .owl-page { display: inline-block }
.owl-controls .owl-page,
.owl-controls .owl-buttons div { cursor: pointer }
.owl-theme .owl-controls .owl-page span {
background-color: #10c7e9 !important;
border-radius: 20px;
display: block;
height: 12px;
margin: 5px 7px;
width: 12px;
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span { background-color: #fff }
.owl-theme .owl-controls {
  display: block !important;
  margin-top: 20px;
  text-align: center;
}
/*
* ----------------------------------------------------------------------------------------
* 10.END TEAM DESIGN
* ----------------------------------------------------------------------------------------
*/ 

 /*
* ----------------------------------------------------------------------------------------
* 11.START TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
.testimonial{
    padding: 20px 20px 20px 90px;
    margin: 10px 20px 70px 55px;
    border-left: 3px solid #10c7e9;
    position: relative;
}
.testimonial:after{
    content: "";
    border-bottom: 25px solid #10c7e9;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    position: absolute;
    bottom: -24px;
    left: -26px;
}
.testimonial .pic{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 3px solid #10c7e9;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: -50px;
}
.testimonial .pic img{
    width: 100%;
    height: auto;
}
.testimonial .title{
font-size: 20px;
font-weight: 600;
margin-bottom: 10px;
text-transform: capitalize;
}
.testimonial .post{
color: #10c7e9;
display: block;
font-size: 16px;
font-weight: 600;
margin-top: 5px;
text-transform: capitalize;
}
@media only screen and (max-width: 479px){
    .testimonial{
        padding: 20px 0 20px 60px;
        margin: 10px 20px 50px 50px;
    }
    .testimonial .title{ font-size: 20px; }
}
.testimonial .description {
  margin-top: 10px;
}
/*
* ----------------------------------------------------------------------------------------
* 11.END TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
 
/*
* ----------------------------------------------------------------------------------------
* 12.START PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/
.pricing-plan{
background:#f9f9f9;
}
.pricingTable {
border-radius: 5px;
box-shadow: 0 5px 15px 0 rgba(236, 236, 236, 0.3);
overflow: hidden;
}
.pricingTable .pricingTable-header{
    padding: 30px 0;
    background: #10c7e9;
    position: relative;
    transition: all 0.3s ease 0s;
}
.pricingTable .pricingTable-header:before,
.pricingTable .pricingTable-header:after{
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid #d9d9d8;
    position: absolute;
    bottom: 12px;
}
.pricingTable .pricingTable-header:before{
    left: 40px;
}
.pricingTable .pricingTable-header:after{
    right: 40px;
}
.pricingTable .heading{
color: #fff;
font-size: 24px;
font-weight: 600;
margin-bottom: 24px;
margin-top: 0;
text-transform: capitalize;
}
.pricingTable .price-value{
color: #fff;
display: inline-block;
font-size: 50px;
font-weight: 600;
position: relative;
transition: all 0.3s ease 0s;
}
.pricingTable:hover .price-value{
    color: #fff;
}
.pricingTable .currency{
font-size: 30px;
font-weight: 600;
left: -18px;
position: absolute;
top: -10px;
}
.pricingTable .month{
bottom: 15px;
color: #fff;
font-size: 16px;
position: absolute;
right: -34px;
text-transform: uppercase;
top: 15px;
}
.pricingTable .pricing-content{
    padding-top: 50px;
    background: #fff;
    position: relative;
}
.pricingTable .pricing-content:before,
.pricingTable .pricing-content:after{
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid #ccc;
    position: absolute;
    top: 12px;
}
.pricingTable .pricing-content:before{
    left: 40px;
}
.pricingTable .pricing-content:after{
    right: 40px;
}
.pricingTable .pricing-content ul{
    padding: 0 20px;
    margin: 0;
    list-style: none;
}
.pricingTable .pricing-content ul:before,
.pricingTable .pricing-content ul:after{
    content: "";
    width: 8px;
    height: 46px;
    border-radius: 3px;
    background: linear-gradient(to bottom,#f9f9f9 50%,#f9f9f9 50%);
    position: absolute;
    top: -22px;
    z-index: 1;
    box-shadow: 0 0 5px #707070;
    transition: all 0.3s ease 0s;
}

.pricingTable .pricing-content ul:before{
    left: 44px;
}
.pricingTable .pricing-content ul:after{
    right: 44px;
}
.pricingTable .pricing-content ul li{
border-bottom: 1px solid #eee;
padding: 10px 0;
}
.pricingTable .pricing-content ul li:last-child{
    border-bottom: none;
}
.pricingTable .read{
background: #10c7e9 none repeat scroll 0 0;
color: #fff;
display: inline-block;
font-size: 16px;
font-weight: 500;
margin: 30px 0;
padding: 8px 40px;
text-transform: uppercase;
transition: all 0.3s ease 0s;
}
.pricingTable .read:hover{
    text-decoration: none;
}
.pricingTable:hover .read{
	 border-radius: 100px;
}
@media screen and (max-width: 990px){
    .pricingTable{ margin-bottom: 25px; }
}
/*
* ----------------------------------------------------------------------------------------
* 12.END PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 13.START FAQ DESIGN
* ----------------------------------------------------------------------------------------
*/
.template_faq{}
.card {
  -moz-box-direction: normal;
  -moz-box-orient: vertical;
  background-color: #fff;
  border: medium none;
  border-radius: 0.25rem;
  display: flex;
  flex-direction: column;
  position: relative;
}
@media only screen and (max-width:480px) { 
.card-body {
  padding: 20px 10px;
}
}
.card-header {
  background-color: #f9f9f9;
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
  padding: 0.75rem 1.25rem;
}
.collapse.show {
  display: block;
  padding: 15px 36px;
}
.btn-link {
border-radius: 0;
color: #333;
cursor: pointer;
font-family: quicksand,sans-serif;
font-size: 20px;
font-weight: 600;
outline: 0 none;
text-transform: capitalize;
}
@media only screen and (max-width:414px) { 
.btn-link {font-size: 14px;
padding: 0;}
}
.btn-link:hover,.btn-link:focus{
color:#10c7e9;	
text-decoration:none;
outline: 0 none;
}
.collapse.show {
  display: block;
  padding: 15px 30px;
}
/*
* ----------------------------------------------------------------------------------------
* 13.END FAQ DESIGN
* ----------------------------------------------------------------------------------------
*/ 
 
/*
* ----------------------------------------------------------------------------------------
* 14.START DOWNLOAD BUTTON DESIGN
* ----------------------------------------------------------------------------------------
*/ 
.download_app_section {
background:#10c7e9;
padding-top:60px;
}
.app_download_img {
  margin: auto;
  width: 400px;
}
@media only screen and (max-width:480px) { 
.app_download_img {
  margin: auto;
  width: 100%;
}
}
.app_download{padding-top:90px;}
@media only screen and (max-width:768px) { 
.app_download {
  padding-bottom: 40px;
  padding-top: 60px;
  text-align: center;
}
}
.app_download h1{
color: #fff;
font-size: 44px;
font-weight: 600;
text-transform: capitalize;	
}
@media only screen and (max-width:360px) { 
.app_download h1{font-size: 30px;}
}
.app_download p{color: #fff;
font-weight: 400;
margin-bottom: 40px;
margin-top: 20px;}

.btn-google-download-bg {
  background: #fff none repeat scroll 0 0;
  border-radius: 5000px;
  display: inline-block;
  margin-right: 10px;
  overflow: hidden;
  margin-bottom: 20px;
  padding: 15px 30px;
  transition: all 0.3s ease 0s;
}
.btn-google-download-bg:hover{box-shadow:0 12px 22px rgba(0,0,0,.15);}
@media only screen and (max-width:480px) { 
.btn-google-download-bg {margin-bottom: 20px;}
}
/*
* ----------------------------------------------------------------------------------------
* 14.END DOWNLOAD BUTTON DESIGN
* ----------------------------------------------------------------------------------------
*/ 

/*
* ----------------------------------------------------------------------------------------
* 15.START BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/ 
.our_blog{background:#f9f9f9;}
.post-slide{
background: #fff none repeat scroll 0 0;
border-radius: 4px;
box-shadow: 0 5px 15px 0 rgb(236, 236, 236);
margin-bottom: 40px;
overflow: hidden;
padding: 10px;
}
.post-slide .post-img{
    position:relative;
    float: left;
    width:50%;
    height: auto;
}
@media only screen and (max-width:768px) { 
.post-slide .post-img{
    float: none;
    width:100%;
}
}
.post-slide .post-img img{
    width:100%;
    height: auto;
}
.post-slide .post-review{
float: left;
margin-top: 65px;
padding: 1px 20px 1px 30px;
width: 50%;
}
@media only screen and (max-width:768px) { 
.post-slide .post-review{
float: left;
margin-top: 40px;
padding: 1px 20px 20px;
width: 100%;
}
}
.post-slide .post-title{
    margin:0 0 5px 0;
}
.post-slide .post-title a{
color: #333;
display: block;
font-size: 22px;
font-weight: 500;
text-transform: capitalize;
transition: color 0.3s ease 0s;
}
.post-title > a:hover{
    text-decoration: none;
    color:#10c7e9;
}
.post-slide .post-date{
color: #10c7e9;
display: block;
font-weight: 500;
margin-bottom: 8px;
margin-top: 12px;
}
.post-description{
margin-bottom: 20px;
text-align: left;
}
.blog_btn {
color: #333;
font-size: 16px;
font-weight: 400;
text-transform: capitalize;
transition: all 0.3s ease 0s;
}
.blog_btn:hover{
color:#10c7e9;	
}
.section-content {
position: relative;
height: 400px;
}
.section-content:before {
    background:rgba(0, 0, 0, 0) linear-gradient(rgba(34, 38, 75, 0.1), rgba(34, 38, 75, 0.5)) repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.section-blog-title{
color: #fff;
font-weight: 700;
margin-top: 200px;
text-transform: uppercase;	
}

.blog_content{
background: #f9f9f9  none repeat scroll 0 0;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
margin-bottom: 40px;
padding: 20px;	
}
.date{
color: #10c7e9;
font-weight: 600;
margin-bottom: 15px;	
}
.title{
font-size: 26px;
font-weight: 500;
margin-bottom: 15px;
text-transform: capitalize;
}
.blog_content h4{margin-bottom:25px;}
.blog_content h4 span{
font-size: 16px;
margin-right: 30px;	
}
.blog_content img{width: 100%;}
.blog_content p{
margin-top: 20px;	
}
.author_part {
    margin-bottom: 60px;
    overflow: hidden;
}
.single_author {
background: #f9f9f9 none repeat scroll 0 0;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
overflow: hidden;
padding: 20px;
}
.author_part img {
    border: 4px solid #10c7e9;
    border-radius: 100px;
    float: left;
    height: 120px;
    margin-right: 20px;
    width: 120px;
}
.author_part h4 {text-transform: uppercase;
font-size: 16px;font-weight: 500; }
.author_part p { margin-bottom: 0 }
.blog_head_title {
border-bottom: 1px solid #eee;
font-size: 20px;
font-weight: 500;
margin: 0 0 30px;
padding-bottom: 10px;
text-transform: capitalize;
}
.comments_part {
    margin-bottom: 60px;
    overflow: hidden;
}
.single_comment {
background: #f9f9f9 none repeat scroll 0 0;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
margin-bottom: 30px;
overflow: hidden;
padding: 20px;
}
.single_comment_mbnone { margin-bottom: 0px }
.single_comment img {
    border: 4px solid #10c7e9;
    border-radius: 100px;
    float: left;
    height: 120px;
    margin-right: 20px;
    width: 120px;
}
.single_comment h4 {text-transform: uppercase;
font-size: 16px;font-weight: 500; }
.single_comment p { margin-bottom: 0 }
/*END BLOG SINGLE PAGE DESIGN*/
/*START BLOG SIDEBAR*/
.blog_sidebar_title {
border-bottom: 1px solid #eee;
font-weight: 500;
margin-bottom: 15px;
padding-bottom: 15px;
text-transform: capitalize;
}
.search input {
  border: 1px solid #eee;
  border-radius:30px;
  box-shadow: none;
  color: #333;
  height: 45px;
}
.search input:hover,.search input:focus{border: 1px solid #10c7e9;box-shadow: none;}
.search,
.video_post,
.categories { margin-bottom: 30px }
.categories ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.categories ul li { }
.categories ul li a {
color: #333;
display: block;
font-size: 16px;
font-weight: 400;
padding: 5px 0;
text-transform: capitalize;
}
.categories ul li a:hover { color: #10c7e9; }
.categories ul li a i { margin-right: 10px }
.video_post iframe {
border: medium none;
height: 100%;
width: 100%;
}
.tag a {
  margin-bottom: 10px;
  margin-right: 5px;
}
.btn-tag-bg {
background: #fff none repeat scroll 0 0;
border: 1px solid #eee;
border-radius: 30px;
color: #333;
display: inline-block;
font-size: 14px;
font-weight: 500;
outline: medium none;
padding: 15px 27px;
text-transform: capitalize;
transition: all 0.2s ease 0s;
}
.btn-tag-bg:hover,
.btn-tag-bg:focus {
    background: #10c7e9;
	border: 1px solid #10c7e9;
    color: #fff;
}
/*END BLOG SIDEBAR*/
/*
* ----------------------------------------------------------------------------------------
* 15.END BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/ 

/*
* ----------------------------------------------------------------------------------------
* 16.START COMPANY PARTNER LOGO
* ----------------------------------------------------------------------------------------
*/
.partner-logo {}
.partner { text-align: center }
.partner img {
opacity: 0.6;
transition: all 0.3s ease 0s;
}
.partner img:hover {
opacity:1;
}
.partner.owl-theme .owl-controls {display: none!important;}
/*
* ----------------------------------------------------------------------------------------
* 16.END COMPANY PARTNER LOGO
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 17.START NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/ 
.newsletter{
background:#10c7e9;
padding:40px 0 50px;
}
.newsletter_subscribe{}
.newsletter_subscribe h3{
color: #fff;
font-size: 36px;
font-weight: 600;
line-height: 46px;
margin-bottom: 30px;
text-align: center;
text-transform: capitalize;
}
.subscribe {
	display: block;
	position: relative;
	margin-top: 15px;
	width: 100%;
}
.subscribe__input {
background-color: #fff;
border: medium none;
border-radius: 500px;
color: #333;
display: block;
font-size: 18px;
font-weight: 500;
height: 60px;
letter-spacing: 0.4px;
margin: 0;
padding: 0 60px 0 20px;
text-align: center;
text-transform: capitalize;
width: 100%;
}
@media only screen and (max-width:768px) { 
.subscribe__input{
width: 62%;
margin:0 auto;
}
}
@media only screen and (max-width:480px) { 
.subscribe__input{
width: 80%;
}
}
@media only screen and (max-width:414px) { 
.subscribe__input{
width: 85%;
}
}
@media only screen and (max-width:375px) { 
.subscribe__input{
width: 90%;
}
}
.subscribe__btn {
background-color: transparent;
border-radius: 0 25px 25px 0;
color: #333;
cursor: pointer;
display: block;
font-size: 24px;
height: 60px;
position: absolute;
right: 0;
top: 0;
width: 60px;
}
.subscribe__btn i{transition: all 0.3s ease 0s;}
@media only screen and (max-width:768px) { 
.subscribe__btn{right: 135px;}
}
@media only screen and (max-width:480px) { 
.subscribe__btn{right: 50px;}
}
@media only screen and (max-width:414px) { 
.subscribe__btn{right: 40px;}
}
@media only screen and (max-width:375px) { 
.subscribe__btn{right: 20px;}
}
.subscribe__btn:hover i{
	color:#01c7e9;
}
button {
	padding: 0;
	border: none;
	background-color: transparent;
	-webkit-border-radius: 0;
	border-radius: 0;
}
/*
* ----------------------------------------------------------------------------------------
* 17.END NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/ 

/*
* ----------------------------------------------------------------------------------------
* 18.START CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
.contact_form {
position: relative;
}
.contact_form:before {
    background:rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.contact {
background: #10c7e9 none repeat scroll 0 0;
box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.25);
padding: 40px 30px;
transition: box-shadow 0.3s ease-in-out 0s;
height:510px;
border-radius: 3px;
}
@media only screen and (max-width:768px) { 
.contact {margin-bottom:60px;}
}
.contact input {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #eee;
    border-radius: 4px;
    box-shadow: none;
    color: #333;
    height: 52px;
    padding: 10px;
}
@media only screen and (max-width:768px) { 
    .contact input { width: 100% }
}
.contact textarea {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #eee;
    border-radius: 4px;
    box-shadow: none;
    color: #333;
    padding: 10px;
}
@media only screen and (max-width:768px) { 
    .contact textarea { width: 100% }
}
.contact input:focus {
    border: 1px solid #10c7e9;
    box-shadow: none;
    outline: 0 none;
}
.contact textarea:focus {
    border: 1px solid #10c7e9;
    box-shadow: none;
    outline: 0 none;
}
.btn-contact-bg {
background: #333  !important;
border: 2px solid #333 !important;
border-radius: 3px;
box-shadow: none;
color: #fff!important;
cursor: pointer;
font-size: 14px;
font-weight: 600;
padding: 15px 40px !important;
text-transform: uppercase;
transition: all 0.2s ease 0s;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus {
    background: #fff!important;
    color: #333!important;
    border: 2px solid #fff!important;
}
.contact_address{
background: #fff none repeat scroll 0 0;
padding: 40px 30px;
height:510px;
border-radius: 3px;
}
@media only screen and (max-width:360px) { 
.contact_address{height:530px;}
}
@media only screen and (max-width:320px) { 
.contact_address{height:570px;}
}
.single-address {
margin-bottom: 41px;
}
.single-address:last-child {
  margin-bottom: 0;
}
.contact_address h3{
color: #333;
font-size: 30px;
font-weight: 600;
margin-bottom: 40px;
text-transform: capitalize;
}
.single-address i {
background: #10c7e9 none repeat scroll 0 0;
border-radius: 100px;
box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.2);
color: #fff;
float: left;
font-size: 20px;
height: 50px;
line-height: 50px;
margin-right: 20px;
text-align: center;
width: 50px;
}
.single-address h4 {
color:#333;
font-size: 18px;
font-weight: 600;
overflow: hidden;
text-transform: capitalize;
}
.single-address p {
    margin-bottom: 0;
	overflow: hidden;
}

/*
* ----------------------------------------------------------------------------------------
* 18.END CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 19.START MAP & SOCIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
#map{height:400px;}
.social_profiles{
background: #fff none repeat scroll 0 0;
padding: 80px 0 75px;
}
.single_social_profile{} 
.single_social_profile h4{
color: #333;
font-size: 30px;
font-weight: 600;
margin-bottom: 30px;
text-align: center;
text-transform: capitalize;
}
.single_social_profile h4::after {
  background: #333 none repeat scroll 0 0;
  content: "";
  display: block;
  height: 2px;
  margin: 20px auto auto;
  width: 60px;
} 
.single_social_profile ul{list-style: outside none none;
text-align: center;} 
.single_social_profile ul li{display: inline-block;} 
.single_social_profile ul li a{
border-radius: 3px;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 16px;
font-weight: 400;
margin: 5px;
overflow: hidden;
padding: 8px 20px;
position: relative;
text-transform: capitalize;
transition: all 0.2s ease-in-out 0s;
vertical-align: middle;
z-index: 1;
} 
.s_facebook{background:#3B5998;}
.s_twitter{background:#55ACEE;}
.s_youtube{background:#ED302F;}
.s_gplus{background:#DD4B39;}
.s_linkedin{background:#0082CA;}
.s_dribbble{background:#EC4A89;}
.s_pinterest{background:#C61118;}
.s_github{background:#333333;}
.single_social_profile ul li a i{margin-right: 5px;} 
/*
* ----------------------------------------------------------------------------------------
* 19.START MAP & SOCIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
 
/*
* ----------------------------------------------------------------------------------------
* 20.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.footer {
background-color: #1d2e41;
padding: 30px 0;
}
.footer_copyright p {
color: #fff;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.6px;
margin: 0;
text-transform: uppercase;
}
/*
* ----------------------------------------------------------------------------------------
* 20.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/


