/*
Author       : Syed Ekram.
Template Name: Kashmir - Multipurpose 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 SERVICE DESIGN
    05. START PROMOTION DESIGN
    06. START FEATURE DESIGN
    07. START PRICING TABLE DESIGN
    08. START TESTIMONIAL DESIGN
    09. START VIDEO DESIGN
    10. START NEWSLETTER DESIGN
    11. START DOWNLOAD APP DESIGN
    12. START FOOTER DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
color: #666666;
font-family: 'Raleway', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 30px;
background:#fff;
}
html,
body { height: 100% }
h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0px;
  margin-top: 0px; 
  font-family: 'Raleway', sans-serif;
  color: #333;
  font-weight: 400;
}
a {
font-family: 'Raleway', 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;
}
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;
}

.status-mes {
    width: 45px;
    height: 45px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -40px;
    font-size: 10px;
    text-indent: -12345px;
    border-top: 8px solid #347bed;
    border-right: 8px solid #347bed;
    border-bottom: 8px solid #347bed;
    border-left: 8px solid #fff;
    border-radius: 50%;
    -webkit-animation: spinner 700ms infinite linear;
    animation: spinner 700ms infinite linear;
    z-index: 10000;
}

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.status-mes h4 {
color: #f7f7f7;
position:relative;
font-size:24px;
margin-top: 30px;
text-transform: capitalize;
letter-spacing: 1px;
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
.section-padding { padding: 60px 0 }
/*START SECTION TITLE DESIGN*/
.section-title{margin-bottom:60px;}
.section-title  h2 {
font-size: 45px;
font-weight: 600;
margin-top: 0;
position: relative;
text-transform: uppercase;
}
@media only screen and (max-width:480px) { 
.section-title  h2  {font-size:30px;}
}
.section-title span{
background: #347bed;
height: 10px ;
width: 70px;
display: block;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;	
}
.section-title-white{color:#fff;position:relative;}
.section-title  p{
padding: 0 10px;
width: 60%;
margin: auto;	
}
@media only screen and (max-width:480px) { 
.section-title  p{
padding: 0 10px;
width: 90%;
margin: auto;	
}
}
/*END SECTION TITLE DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
background: #347bed none repeat scroll 0 0;
border-radius: 30px;
bottom: 5px;
box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
color: #fff;
cursor: pointer;
font-size: 22px;
height: 50px;
line-height: 45px;
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*/
/*START BTN LIGHT BUTTON*/
.btn-light-bg {
border: 2px solid #ddd;
border-radius: 0;
color: #333;
font-size: 16px;
overflow: hidden;
padding: 10px 40px;
position: relative;
text-transform: capitalize;
transition: all 0.4s ease 0s;
z-index: 1;
}
.btn-light-bg:hover {
  color: #ffffff;
  border: 2px solid #347bed ;
}
.btn-light-bg::after {
  background: #347bed;
  color: #ffffff;
  content: "";
  height: 100%;
  left: 18px;
  position: absolute;
  top: 0;
  transform: skewX(360deg);
  width: 75%;
  z-index: -1;
  transition: all 0.4s;
  opacity: 0;
  visibility: hidden;
}
.btn-light-bg:hover::after {
  transform: skewX(61deg);
  opacity: 1;
  visibility: visible;
}
/*END BTN LIGHT BUTTON*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 02.START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.bg-faded {
background-color: #fff;
transition: all 0.5s ease 0s;
}
.navbar-brand img {
  width: 150px;
}
.navbar-light .navbar-nav .nav-link {
color: #333;
font-size: 16px;
letter-spacing: 0.5px;
margin-left: 5px;
padding: 7px 14px;
text-transform: capitalize;
}
.block-menu{
background: #347bed none repeat scroll 0 0;
border-radius: 30px;
/*box-shadow:0 3px 10px rgba(65, 205, 82, 0.5);*/
color: #fff !important;
padding: 7px 25px !important;
transition: all 0.3s ease 0s;	
}
.navbar-light .navbar-nav .nav-link:hover.block-menu{color:#fff !important;}
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
  color: #347bed  !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: #347bed  !important;
}
.navbar-light .navbar-toggler {
  border-color: #333;
  border-radius: 0px;
}
.navbar-light .navbar-toggler {
  float: right;
  margin: 14px;
}
.navbar-light .navbar-toggler i {
  color: #666!important;
}
.site-navigation {
    border-radius: 0px;
}
.navbar-fixed {
animation: 800ms ease 0s normal none 1 running fadeInDown;
backface-visibility: hidden;
background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
border-radius: 0;
box-shadow: 0 5px 4px rgba(0, 0, 0, 0.02);
opacity: 0.98;
padding: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 99999;
}
/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03.START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
.home_parallax{height: 700px;position:relative;}
.home_parallax:before {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0;
  content: "";
  left: 0;
  top: 0;
}
.hero-text{padding-top:250px;}
@media only screen and (max-width:360px) { 
.hero-text{padding-top:150px;}
}
.hero-text h1{	
color: #fff;
font-size: 75px;
font-weight: 400;
}
@media only screen and (max-width:480px) { 
.hero-text h1{font-size:40px;}
}
@media only screen and (max-width:320px) { 
.slider-info h1{font-size:30px;}
}
.hero-text p{
	color:#fff;
	margin-bottom: 25px;	
}
@media only screen and (max-width:480px) { 
.hero-text p {
  color: #fff;
  margin: auto;
  width: 90%;
  margin-bottom: 25px;
}
}

.btn-home-bg i{margin-right:5px;}
.btn-home-bg {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: 2px solid #ddd;
border-radius: 0;
color: #fff;
font-size: 16px;
margin: 0 20px;
overflow: hidden;
padding: 10px 40px;
position: relative;
text-transform: capitalize;
transition: all 0.4s ease 0s;
z-index: 1;
}
@media only screen and (max-width:480px) { 
.btn-home-bg {margin:20px;}
}
.btn-home-bg:hover {
  color: #ffffff;
  border: 2px solid #347bed ;
}
.btn-home-bg::after {
  background: #347bed ;
  color: #ffffff;
  content: "";
  height: 100%;
  left: 18px;
  position: absolute;
  top: 0;
  transform: skewX(360deg);
  width: 75%;
  z-index: -1;
  transition: all 0.4s;
  opacity: 0;
  visibility: hidden;
}
.btn-home-bg:hover::after {
  transform: skewX(61deg);
  opacity: 1;
  visibility: visible;
}
/*
* ----------------------------------------------------------------------------------------
* 03.END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 04.START SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/
.our_services{
padding-top:60px;
padding-bottom:0px;
}
.service-title h2{
font-size: 30px;
line-height: 46px;
margin: auto auto 60px;
width: 70%;	
}
@media only screen and (max-width:768px) { 
.service-title h2{
padding:0px 10px;
width: 100%;	
}
}
.service {
margin-bottom:60px;
transition: all 0.4s ease 0s;
}
.service i {
background: #347bed none repeat scroll 0 0;
border-radius: 30px;
/*box-shadow: 0 3px 10px rgba(65, 205, 82, 0.5);*/
color: #fff;
font-size: 24px;
height: 60px;
line-height: 60px;
margin-bottom: 24px;
transition: all 0.3s ease 0s;
width: 60px;
}
.service:hover i{
transform:scale(1.1);
}
.service h4 {
font-size: 18px;
font-weight: 600;
margin-bottom: 15px;
text-transform: uppercase;
}
.service p {}
/*
* ----------------------------------------------------------------------------------------
* 04.END SERVICE DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
 * ----------------------------------------------------------------------------------------
 * 05.START PROMOTION DESIGN
 * ----------------------------------------------------------------------------------------
 */
.promotion_offer{position:relative;
background-position: center top;
background-repeat: repeat-y;
}
.promotion_offer:before {
background: rgba(0, 0, 0, 0.2);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.promotion_content {
background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
border-radius: 3px;
margin: 60px 0;
padding: 70px 30px;
transition: all 0.3s ease 0s;
}
.promotion_content:hover{background:#fff;}
.promotion_content h1{}
.promotion_content p{
margin: 30px auto;
width: 80%;
}
/*
 * ----------------------------------------------------------------------------------------
 * 05.END PROMOTION DESIGN
 * ----------------------------------------------------------------------------------------
 */

/*
 * ----------------------------------------------------------------------------------------
 * 06.START FEATURE DESIGN
 * ----------------------------------------------------------------------------------------
 */
.single_feature{padding-top: 150px;}
@media only screen and (max-width:768px) { 
.single_feature{padding-top: 50px;}
}
@media only screen and (max-width:480px) { 
.single_feature{padding-bottom: 50px;padding-top: 0px;}
}
.single_feature h3{
color: #2a2b2f;
font-size: 45px;
font-weight: normal;
line-height: 50px;
margin: 0;
}
.single_feature p{margin: 30px 0;}
.single_feature_img{}

.single_feature_img img{width: 100%;}
/*
 * ----------------------------------------------------------------------------------------
 * 06.END FEATURE DESIGN
 * ----------------------------------------------------------------------------------------
 */

/*
 * ----------------------------------------------------------------------------------------
 * 07.START PRICING TABLE DESIGN
 * ----------------------------------------------------------------------------------------
 */
.pricing_plan{background:#f7f7f7;}
.pricing-title h2{
font-size: 30px;
line-height: 46px;
margin: auto auto 60px;
width: 70%;		
}
@media only screen and (max-width:768px) { 
.pricing-title h2{
padding:0px 10px;
width: 100%;	
}
}
.single_price{
padding:40px 0;
background: #fff;
border-radius: 6px;
box-shadow: 0px 20px 20px rgba(0,0,0,0.03);	
}
@media only screen and (max-width:480px) { 
.single_price{margin-bottom:40px}
}
.single_price h2{
font-size: 22px;
font-weight: 500;
text-transform: capitalize;
}
.price{
border: 1px solid #eee;
border-radius: 500px;
font-size: 26px;
height: 100px;
line-height: 95px;
margin: 30px auto;
width: 100px;
}
.single_price ul{list-style: outside none none;
margin-bottom: 30px;}
.single_price ul li{padding: 5px 0;}
/*
 * ----------------------------------------------------------------------------------------
 * 07.END PRICING TABLE DESIGN
 * ----------------------------------------------------------------------------------------
 */

 
/*
 * ----------------------------------------------------------------------------------------
 * 08.START TESTIMONIAL DESIGN
 * ----------------------------------------------------------------------------------------
 */ 
.testimonial{
    background: #fafafa;
    text-align: center;
    padding: 30px 30px 50px;
    margin: 0 15px 100px;
    position: relative;
}
.testimonial-title h2{
font-size: 30px;
line-height: 46px;
margin: auto auto 60px;
width: 70%;		
}
@media only screen and (max-width:768px) { 
.testimonial-title h2{
padding:0px 10px;
width: 100%;	
}
}
.testimonial:before,
.testimonial:after{
    content: "";
    border-top: 40px solid #fafafa;
    border-right: 125px solid transparent;
    position: absolute;
    bottom: -40px;
    left: 0;
}
.testimonial:after{
    border-right: none;
    border-left: 125px solid transparent;
    left: auto;
    right: 0;
}
.testimonial .icon{
    display: inline-block;
    font-size: 70px;
    color: #347bed;
    margin-bottom: 20px;
    opacity: 0.6;
}
.testimonial .description{
    font-size: 15px;
    color: #777;
    text-align: left;
    margin-bottom: 30px;
    opacity: 0.8;
}
.testimonial .testimonial-content{
    width: 100%;
    position: absolute;
    left: 0;
}
.testimonial .pic{
border: 2px solid #fff;
border-radius: 50%;
box-shadow: 0 0 2px 2px #347bed;
display: inline-block;
margin-bottom: 5px;
overflow: hidden;
position: relative;
z-index: 1;
}
.testimonial .pic img{
    width: 100%;
    height: auto;
}
.testimonial .title{
    font-size: 15px;
    font-weight: 600;
    text-transform: capitalize;
    margin: 0 0 5px 0;
}
.testimonial .post{
    display: block;
    font-size: 14px;
    color: #347bed;
}

@media only screen and (max-width: 650px) and (min-width: 400px){
    .testimonial:before{ border-right: 325px solid transparent; }
    .testimonial:after{ border-left: 325px solid transparent; }
}
.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: #347bed !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 TESTIMONIAL DESIGN
 * ----------------------------------------------------------------------------------------
 */ 

/*
 * ----------------------------------------------------------------------------------------
 * 09.START VIDEO DESIGN
 * ----------------------------------------------------------------------------------------
*/ 
.video_section {
position: relative;
background-position: center top;
background-repeat: repeat-y;
padding: 200px 0;}
.video_section:before {
    background:rgba(0,0,0, 0.4);
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  margin-top: 55px;
  max-width: 900px;
  width: 100%;
}
.company_video h2{
color: #fff;
margin-bottom: 30px;}
.company_video a{
background: #fff none repeat scroll 0 0;
border-radius: 100px;
color: #347bed;
display: block;
font-size: 22px;
height: 60px;
line-height: 60px;
margin: auto;
padding-left: 5px;
padding-top: 2px;
text-align: center;
width: 60px;	
}
/*
 * ----------------------------------------------------------------------------------------
 * 09.END VIDEO DESIGN
 * ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 10.START NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.signup_form h3 {
  font-size: 40px;
  font-weight: 400;
  margin-bottom: 30px;
  margin-top: 0;
  color:#333;
}
.signup_form input {
background: #fff none repeat scroll 0 0;
border: 2px solid #eee;
border-radius: 30px;
box-shadow: none;
color: #333;
height: 50px;
margin-bottom: 30px;
}
.signup_form input:focus{
box-shadow: none;
border:2px solid #347bed;
border-radius: 30px;
}
.signup_form button  {background:none repeat scroll 0 0;;}
/*
* ----------------------------------------------------------------------------------------
* 10.END NEWSLETTER DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 11.START DOWNLOAD APP DESIGN
* ----------------------------------------------------------------------------------------
*/
.download_bg {
padding: 100px 0;
background:#347bed;
}
.download_app{}
.download_app h2{
color: #fff;
font-weight: 500;
font-size: 40px;
margin-bottom: 20px;
}
.download_app p{
color: #fff;
margin: auto auto 20px;
width: 60%;
}
.download_app a{}
.download_app a img{margin: 0 10px;}
@media only screen and (max-width:480px) { 
.download_app a img{margin:10px;}
}
/*
* ----------------------------------------------------------------------------------------
* 11.END DOWNLOAD APP DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 12.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.about_us img{width:200px;margin-bottom:30px}
.about_us p{}
.footer {
  border-top: 1px solid #eee;
  padding: 30px 0;
}
.copyright p {
color: #333;
font-size: 14px;
margin-bottom: 0;
text-transform: capitalize;
}
@media only screen and (max-width:768px) { 
.copyright p{padding-left:20px;}
}
.footer_links{}
.footer_links ul{list-style:none;}
.footer_links ul li{float: left;}
.footer_links ul li a{
color: #333;
font-size: 14px;
padding: 0 13px;	
}
.footer_links ul li a:hover{color:#347bed;}
/*
* ----------------------------------------------------------------------------------------
* 12.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/

