@charset "utf-8";
/* CSS Document */


/*
Copyright (c) 2017
[Master Stylesheet]
Template Name : Insurance Agent-Multipurpose Landing Page-UiSumo
Version    : 1.0
Author     : UISuMo Team
Author URI : https://uisumo.com
Support    : uisumo@gmail.com
*/


/* ==========================================================================
   1.General
   ========================================================================== */
   
body { font-family: 'signikaregular';line-height: 24px; font-weight: 400; font-size: 16px; overflow-x: hidden; }
p { font-weight: 400; color: #6a6a6a; font-size: 14px; margin: 0 0 24px  }
h1, h2, h3, h4, h5, h6 {font-family: 'signikabold'; color: #4c4c4c; }
h2.title{ font-size: 32px; color: #30d29e; margin: 0 0 30px; line-height: 32px;}
h4 { font-size: 20px; margin: 12px 0; }
a { color: #6a6a6a; transition: all 0.3s ease-in-out; }
a:hover, a:focus { color: #30d29e; text-decoration: none; }
a:focus { outline: none; }
img { max-width: 100%; height: auto; }
ul, li { list-style: none; padding: 0; margin: 0; }
b, strong { font-weight: 600; }
select.form-control { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(../img/select-arrow.png) no-repeat right 0px  !important; }
select.form-control option { line-height: 30px; padding: 5px 20px; border: none; }
.btn{border-radius: 0px; transition: all 0.3s ease-in-out; }
.btn-custom{padding:0 44px; height: 45px; line-height: 42px; }
.btn-primary{background: #30d29e; color: #fff;border: 2px solid #30d29e; }
.btn-primary:hover{background:none; color: #30d29e; border: 2px solid #30d29e}
.btn-primary-outline{background:none; color: #30d29e; border: 2px solid #30d29e}
.btn-primary-outline:hover{background: #30d29e; color: #fff; }
.section-heading h2{background: url(../img/section-title-bg.png) no-repeat center center; height: 43px; padding: 0; line-height: 43px; color: #30d29e; font-size: 26px; margin: 0 0 20px;}




/*NAVIGATION SECTION*/
.navbar-custom{background-color: #fff; transition: all 0.3s ease-in-out;}
.navbar-custom .topbar{}
.navbar-brand{display: inline-block; vertical-align: middle; line-height: 36px;font-family: 'signikabold'; font-size: 32px; color: #30d29e}
.navbar-brand img{float: left; margin-right: 20px }
.topbar ul{margin: 0; padding: 0; list-style: none;}
.topbar ul li{display: inline-block; vertical-align: middle;margin-left: 65px; margin-top: 40px;font-family: 'signikalight'; font-size: 16px; color: #222222}
.topbar ul li a{color: #222222}
.topbar ul li .icon{ color: #30d29e; display: inline-block; vertical-align: middle; margin-right: 3px;}
.navbar-collapse{background-color: #30d29e;transition: all 0.3s ease-in-out; }
.navbar-nav > li > a{font-family: 'signikasemibold'; font-size: 12px; color: #fff;}
.nav > li > a:hover, .nav > li > a:focus, .nav > li.active > a{background:rgba(255,255,255,.1)}
.navbar-fixed-top .navbar-collapse .navbar-right{margin: 0}
.navbar-fixed-top .navbar-collapse .navbar-right .btn{background:rgba(255,255,255,.2); padding-left:25px; padding-right: 25px; border:none;}
.navbar-fixed-top .navbar-collapse .navbar-right .btn:hover{background: rgba(0,0,0,.1); color: #fff}



@media (min-width: 768px) {.top-nav-collapse .topbar{max-height: 0px; margin: 0; padding: 0; overflow: hidden; }
.top-nav-collapse.navbar-custom{background-color: #30d29e;}}

/*CAROUSEL SECTION*/
.carousel .item{background-color: #222222; }
.carousel-control{top: 50%; bottom: auto; width: 50px; height: 50px; background: #30d29e; color: #fff;}
.carousel-control.left, .carousel-control.right{background-image: none; opacity: 1; text-shadow: none; text-align: center;padding: 0; line-height: 50px; z-index: 999}
.carousel-control.left{left: 3%; text-indent: -2px}
.carousel-control.right{right: 3%; text-indent: 2px}
.carousel-control:hover{background: #fff; color:#30d29e}
.carousel-inner{min-height: 600px}
.carousel-inner > .item > img, .carousel-inner > .item > a > img{width: 100%; opacity: .43; height: 100%;}
.carousel-caption{left: 0; right: 0; top: 0; display: flex; align-items: center;}
.carousel-caption h1{text-shadow: none; color: #fff; font-size: 24px; margin: 0 0 20px;}
.carousel-caption .icon{text-shadow: none;font-size: 32px; color:#30d29e; margin: 0 0 30px; display: inline-block}
.carousel-caption .icon:hover{color: #fff;}
.carousel-caption a + a{margin-left: 30px}

/*FONR SCTION*/
.form-section{padding: 60px 0 45px 0; background: #30d29e;}
.form-section .form-control{border: none; border-radius: 0px; background:none; box-shadow: none; border-bottom: 2px solid #fff; color: #fff; padding-left: 0; padding-right: 0;}
.form-section ::-webkit-input-placeholder { color:    #ffffff;}
.form-section :-moz-placeholder { color:    #ffffff; opacity:  1;}
.form-section ::-moz-placeholder { color:    #ffffff; opacity:  1;}
.form-section :-ms-input-placeholder { color:    #ffffff;}
.form-section:placeholder-shown { color:    #ffffff;}
.form-section .btn{color: #30d29e; font-size: 16px; text-transform: uppercase; border: 2px solid #fff;font-family: 'signikabold'; background: #fff;}
.form-section .btn:hover{background: none; color: #fff;}
/*MY FEATURES*/
.my-features{padding: 90px 0 50px;}
.my-features [class*="col-"]{margin-bottom: 40px;}
.my-features h3{font-size: 18px; position: relative; padding-left: 70px; line-height: 20px; padding-top: 8px; padding-bottom: 8px; margin: 20px 0 20px}
.my-features h3 i{position: absolute; left: 0;top: 0; font-size: 36px; line-height: 36px; color: #30d29e;}
/*ABOUT ME*/
.aboutme *{margin: 0; padding: 0;}
.aboutme .about{background: url(../img/aboutme-bg.png) no-repeat center center #30d29e}
.aboutme .details{background: url(../img/insurance-bg.png) no-repeat center center #22313f}
.aboutme .video{background: url(../img/video-bg.png) no-repeat center center #30d29e}
.aboutme [class*="col-"]{padding: 90px 30px; background-size: cover;}
.aboutme h3, .aboutme p, .aboutme{color: #fff; letter-spacing: .6px}
.aboutme .about h3{font-size: 26px; background: url(../img/section-title-white-bg.png) no-repeat center center; height: 43px; line-height: 43px; margin: 0 0 20px;}
.aboutme .details h3{font-size: 32px; margin: 0 0 20px;}
.aboutme .details  p{margin: 0 0 24px}
.aboutme .details ul{margin: 0; padding: 0; }
.aboutme .details ul li{position: relative; padding-left: 24px; font-family: 'signikasemibold'; line-height: 24px; font-size: 14px;}
.aboutme .details ul li + li{margin-top: 18px;}
.aboutme .details ul li:before{position: absolute; left: 0; top: 5px;  content: ''; width: 13px; height: 13px; border-radius: 100%; background: #fff;}
.aboutme .video a{font-size: 48px; color: #fff}
.aboutme .video a:hover{opacity: .7}

/*AM ACHIVED*/
.achived{padding: 90px 0 50px}
.achived [class*="col-"] {margin-bottom: 40px;}
.achived ul{margin: 0; padding: 0; list-style: none;}
.achived ul li{ min-height: 50px; background: #30d29e; position: relative; color: #fff; font-size: 14px;font-family: 'signikabold'; padding-left: 200px;}
.achived ul li + li{margin-top: 30px;}
.achived ul li .left{position: absolute; left: 0; top: 0px; height: 50px; line-height: 50px; text-align: center; max-width: 200px; width: 100%;}
.achived ul li .right{display: block; position: relative; line-height: 50px;padding-left: 60px}
.achived ul li .right:before{position: absolute; left: 0; top: 0; height: 100%; background: rgba(255,255,255,.2); content: '';}
.achived ul li .right.insured-10:before{width: 10%;}
.achived ul li .right.insured-20:before{width: 20%;}
.achived ul li .right.insured-30:before{width: 30%;}
.achived ul li .right.insured-40:before{width: 40%;}
.achived ul li .right.insured-50:before{width: 50%;}
.achived ul li .right.insured-60:before{width: 60%;}
.achived ul li .right.insured-70:before{width: 70%;}
.achived ul li .right.insured-80:before{width: 80%;}
.achived ul li .right.insured-90:before{width: 90%;}
.achived ul li .right.insured-100:before{width: 100%;}
/*POLICIES*/
.policies{background-color: #fcfcfc; padding: 90px 0 50px}
.policies [class*="col-"] {margin-bottom: 40px;}
.policies .box{display: inline-block; position: relative; width: 100%; background: #30d29e}
.policies .box img{float: left; width: 100%; max-width: inherit; opacity: .63;}
.policies .box *{transition: all 0.3s ease-in-out;}
.policies .box .box-content{position: absolute; height: 100%; width: 100%; display: flex; align-items: center; padding:0 50px; background: #fff; border: 5px solid #30d29e; }
.policies .box .box-content > div{padding-top: 10px;}
.policies .box .box-content .picon{position: relative; font-size: 36px; color: #30d29e; line-height: 36px; padding-top: 25px; margin-top: 25px; }
.policies .box .box-content .picon:after{position: absolute; content: ''; width: 40px; height: 5px; border-radius: 5px; position: absolute; left: 0; top: 0; background:#30d29e }
.policies .box .box-content h3{font-size: 18px;}
.policies .box .box-content p{margin: 0;}
.policies .box:hover .box-content{background: none; border-color: transparent; }
.policies .box:hover .box-content .picon, .policies .box:hover .box-content h3, .policies .box:hover .box-content p{color: #fff} 
/*GET FREE CONSULTATION*/
.consultation{background: url(../img/user-bg.png) no-repeat center center #30d29e; background-size: cover;padding: 90px 0 50px }
.consultation [class*="col-"] {margin-bottom: 40px;}
.consultation [class*="col-"]:last-child .pull-right{float: none;}
.consultation h4{color: #fff; font-size: 24px; margin: 0 0 24px;}
.consultation p{margin: 0; color: rgba(255,255,255, .8)}
.consultation h2{font-size: 32px; color: #fff; margin: 0 0 15px}
.consultation .btn{box-shadow: 0 2px 2px rgba(0,0,0,.2);font-family: 'signikabold';}
.consultation .btn:hover{color: #fff; border-color: #fff;}
/*CLIENT SAY‘S*/
.testimonial{padding: 90px 0}
.testimonial img{display: inline-block;}
.testimonial .clientimage img{ border-radius: 100%;margin: 20px auto}
.testimonial h3{font-size: 18px; line-height: 30px; margin: 15px 0 25px;}
.testimonial .client-details h4{text-transform: uppercase; color: #30d29e; font-size: 14px;}
.testimonial .client-details h6{font-size: 14px; color: #6a6a6a; margin: 0 0 40px}
.testimonial .owl-theme .owl-controls .owl-page span{opacity: 1; background-color: #222222; transition: all 0.3s ease-in-out;}
.testimonial .owl-theme .owl-controls .owl-page.active span, .testimonial .owl-theme .owl-controls.clickable .owl-page:hover span{background-color:#30d29e }
/*STATISTIC*/
.statistic{background: url(../img/statistic-bg.png) no-repeat center center #30d29e; background-size: cover;padding: 90px 0 50px }
.statistic [class*="col-"] {margin-bottom: 40px;}
.statistic i{color: #fff; font-size: 32px;}
.statistic h6{font-size: 16px; color: #fff; margin: 10px 0 15px}
.statistic h2{font-size: 32px; color: #fff; margin: 0}
/*GET IN TOUCH*/
.getin-touch{padding: 90px 0 50px; background: #fff}
.getin-touch [class*="col-"] {margin-bottom: 40px;}
.maplocation { padding: 50px 0; text-align: center; background:url(../img/googlemap-bg.png) no-repeat center center #30d29e; background-size: cover;}
.maplocation h2{font-size: 16px; color: #fff;}
.maplocation  h2 i{font-size: 32px; display: inline-block; vertical-align:middle; margin-right: 15px}
#google-map { height: 600px; width: 100%; background-color: #eee }
/*CONTACT DETAILS*/
.contact-details{padding: 56px 0 16px; background: #fff}
.contact-details > .container> .row > [class*="col-"] {margin-bottom: 40px;}
.contact-details h2{color: #30d29e; margin: 0 0 25px; font-size: 32px;}
.contact-details .logo img{float: left; margin:0 20px 0 0 }
.contact-details .social-icons{margin:30px -5px 0; display: block}
.contact-details .social-icons a{width: 42px; height: 42px; display: inline-block; text-align: center; line-height: 42px; color: #fff; background: #30d29e; border: 2px solid #30d29e; font-size: 18px; margin: 0 5px;}
.contact-details .social-icons a:hover{background: #fff; color:#30d29e }
.contact-details .form-group{margin-bottom: 25px;}
.contact-details .form-control{border: 1px solid #30d29e; border-radius: 0px; font-size: 12px;}
.contact-details input.form-control{height: 42px;}
.contact-details textarea.form-control{max-height: 100px;}
footer{background: #000; padding: 40px 0 10px;}
footer > .container> .row > [class*="col-"] {margin-bottom: 30px;}
footer p{margin: 0; line-height: 20px; color: #fff;}
footer ul.footer-link{margin: 0 -5px; padding: 0;}
footer ul.footer-link li{display: inline-block; margin: 0 5px;line-height: 20px;}
footer ul.footer-link li a{font-size: 12px; color: #fff;font-family: 'signikasemibold'; padding: 0 5px; line-height: 20px;}


@media all and (min-width: 990px) {
    body{padding-top: 100px}
    .navbar-custom{max-height: 100px; margin: 0; border: none;}
    .topbar{max-height: 100px; transition: all 0.3s ease-in-out; overflow: hidden}
    .navbar-brand{height: auto; padding-top: 32px; padding-bottom: 32px;}
    .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse{max-height: 50px;}
    .navbar-fixed-top .navbar-collapse .navbar-left{margin-left: 50px}
    .carousel-caption h1{font-size: 32px;}
    .form-section .btn{height: 84px;}
    .aboutme .row {    display: table;}
    .aboutme [class*="col-"] {    float: none;    display: table-cell;    vertical-align: middle;}
    .achived [class*="col-"]:first-child{padding-right: 50px;}
    .achived [class*="col-"]:last-child{padding-left: 50px;}
    .consultation .btn{width: 300px; }
    .testimonial .clientimage img{margin: 60px auto}
    .testimonial h3{margin: 15px 0 40px;}
    footer ul{margin: 0; padding: 0; float: right;}


}
@media all and (max-width: 1200px) {
    .topbar ul li{margin-left: 20px}
}
@media all and (max-width: 990px) {
    .topbar ul{display: none;}
    .navbar-brand{height: auto;}
    .carousel-control.left, .carousel-control.right{display: none;}
}
@media (max-width: 767px) {
.navbar-custom .topbar{position: absolute}
    .navbar-header{box-shadow: 0 2px 2px rgba(0,0,0,.1)}
}
@media (max-width: 430px) {
  
    .carousel-caption a + a{margin: 0;}
    .carousel-caption a{ width: 100%; margin: 20px 0}
    .achived ul li{padding-left: 150px; font-size: 13px}
    .achived ul li .left{width: 150px}
    .achived ul li .right{padding-left: 30px;}
}
    
    @media (min-width: 300px) {
  .carousel {
    min-height: 700px;
   margin-bottom: 0px;
  }
  /* Since positioning the image, we need to help out the caption */
  .carousel-caption {
    z-index: 10;
    }

   /* Declare heights because of positioning of img element */
   .carousel .item {
    min-height: 700px;
    }
   .carousel-inner > .item > img {
    position: absolute;
   top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
   width: auto;
    max-width: inherit;
   min-height: 700px;
  }


}