﻿@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900&display=swap');

body {overflow-x:hidden;font-size:16px;color:#999;font-family: 'Lato', sans-serif;text-decoration:none;}
ul{padding:0}
ul li{list-style:none;}
a,a:hover{text-decoration:none;}
.color-white, .footer-bg a:hover,footer .information span.right-write{color:#fff;}
.my-30{margin:30px 0;}
.color-black, .feature-box a.home-btn:hover, .contact-form .home-btn:hover, .modal-footer .home-btn:hover{color:#333;}
.navbar-default{background-color:#fff;border-color:transparent;box-shadow:0 0 10px 3px #ccc;}
.navbar-brand{padding:0px 15px;}
.navbar-brand img{max-height:70px;}
.navbar-nav{float:right;}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus,.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus{color:#ff6a00;background-color:transparent;transition:all ease-in 0.3s;}
.navbar-nav .dropdown:hover .dropdown-hover{transition:all 0.3s;display:block;overflow:hidden;opacity:1;border-radius:10px;transition:all ease-in 0.3s; }
.navbar-nav li:last-child>a:hover{border:1px solid #ff6a00;color:#333;transition:all ease-in 0.3s;cursor:pointer;}
.navbar-nav .dropdown-menu>li>a:hover, .navbar-nav .dropdown-menu>li:last-child>a:hover, .navbar-nav .dropdown-menu>li>a:focus,.dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus{background-color:#ff6a00;color:#fff;border:none;transition:all ease-in 0.3s;}
.navbar-default .navbar-nav>li>a {color: #333;text-transform: uppercase;font-weight: 600;font-size: 16px;margin: 10px;transition:all ease-in 0.3s;line-height:30px;padding-bottom:0;}
.navbar-nav li a.demo{background-color:#ff6a00;color:#fff;border-radius:10px;padding:7px 20px;border:1px solid transparent;margin-top:15px;}
.navbar-nav>li>a:after {
    content: ""; display: block;background-color: #ff6a00; height: 2px; width: 0%;-webkit-transition: 0.3s width; transition: 0.3s width;
}
.navbar-nav>li>a:hover:after, .navbar-nav>li.active>a:after { width: 100%;}
.navbar-nav>li:last-child>a:after{display:none;}

/*Home Banner*/
home-banner{background:url(../images/home-banner.jpg) top center no-repeat; background-size:cover;height:700px;position:relative;}
.home-banner{padding-top:0%;}
.home-banner video {height: auto;width: 100%;}
.home-banner.crm-mobile{background:url(../images/crm-banner.jpg) top center no-repeat; background-size:cover;height:700px;position:relative;}
home-banner:before {position: absolute;height: 100%;width: 100%;top: 0;left: 0;background: rgba(0,0,0,0.4);content: '';}
.home-banner.crm-mobile:before {position: absolute;height: 100%;width: 100%;top: 0;left: 0;background: rgba(250,250,250,0.2);content: '';}

.home-banner .home-content {padding-top:33%;text-align: center;}
.home-content h1{font-size: 52px;text-transform: uppercase;margin-bottom: 20px;}
.home-content p{font-size:16px;}
.home-btn{padding:10px 25px;background-color:#ff6a00;color:#fff;text-transform:uppercase;font-size:18px;font-weight:600;margin:15px 0;border:1px solid transparent;transition:all ease-in 0.3s;border-radius:10px;}
.home-btn:hover{background-color:transparent;border:1px solid #ff6a00;color:#fff;transition:all ease-in 0.3s;}

/*timechart attendance crm system page*/
.bg-mobile-white{background:rgba(0,0,0,0.5);padding:20px 0;}
.logo img {width: 10%;}
.home-banner .home-content.crm-content{padding-top:25%;}
.crm-box{padding-top:65%;}
.crm-box .contact-form {padding-left: 5px;}
.home-content.crm-content h1{font-size:28px;}
.crm-box .text-danger{color:#fff;}
.crm-box .home-btn{margin:0;margin-left:20px;}
.crm-box button, .crm-box h1{margin-left:20px;}
.crm-box h1{text-transform:uppercase;font-size:28px;margin-top:0;}
.crm-box-mobile{display:none;}
.home-banner.crm-mobile{height:600px;}
.top-arrow-fix.soci-footer{position:fixed;bottom:32px;z-index:11;right:0;}
.soci-footer a{padding:15px 0;height:55px;width:60px;border-radius:50%;color:#fff;background-color:#ff6a00;display:inline-block;border:2px solid transparent;transition:all ease-in 0.3s;text-align:center;}
.soci-footer a:hover{color:#000;background-color:transparent;border:2px solid #ff6a00;transition:all ease-in 0.3s;}
.soci-footer a i{font-size:15px;}
.soci-footer a{margin-right:16px;}
.app-text a.home-btn:hover, .services a.home-btn:hover, .advantages a.schedule:hover{color:#333;}
/*Home Section*/
section{padding:80px 0;}
section.home{padding:80px 0 40px;}
.About-app-content, .feature-box, .service-sec{padding:60px 0;}
h2{font-size:46px;color:#333;line-height:60px;text-align:center;position:relative;margin-bottom:20px;}
h2:after{content:'';height:4px;width:60px;background:rgb(255, 216, 0);position:absolute;left:45%;bottom:-10%;right:0;text-align:center;}
.service-sec h2:after,.advantages-sec h2:after{left:47%;}
.app-text h3 {font-size: 40px;line-height: 55px;font-weight: 700;text-transform: uppercase;}
.owl-theme .owl-nav [class*=owl-]{font-size:20px;padding:4px 10px;background:#ff6a00;transition:all ease-in 0.3s;border:1px solid transparent;}
.owl-theme .owl-nav [class*=owl-]:hover{background:transparent;color:#333;transition:all ease-in 0.3s;border:1px solid #ff6a00;}
.owl-theme .owl-nav {margin-top: 20px;}
.app-text p{margin-top:20px;color: #333;line-height: 30px;}
.link-btn, .link-btn i, .link-btn:hover{color:#ff6a00;transition:all ease-in 0.3s;}
.link-btn:hover i{transform:translateX(10px);transition:all ease-in 0.3s;}

/*Feature section*/
.feature-image img{padding-top:15%;}
.feature-item i{font-size:42px;color:#ff6a00;padding:10px;}
.feature-item{padding:10px;border-bottom:1px dashed #ff6a00;}

/*Service Section*/

.service-box{padding:40px 0;}
.service-box p{padding:0 15px;margin-top:10px;}
/*Advantages*/
.advantages{padding-top:90px;}
.advantages-box:after{content: ''; font-size: 70px;color: #ff6a00; position: absolute; top: -50px; left: -20px; z-index:0;background: #f5f5f5;
    border-radius: 50%; padding: 0 10px;box-shadow:2px 4px 4px 0px #ddd;}
.advantages-box.one:after{content:'01';}
.advantages-box.two:after{content:'02';}
.advantages-box.three:after{content:'03';}
.advantages-box.four:after{content:'04';}
.advantages-box.five:after{content:'05';}
.advantages-box.six:after{content:'06';}
.advantages-box.seven:after{content:'07';}
.advantages-box.eight:after{content:'08';}
.advantages-box.nine:after{content:'09';}
.advantages-box.ten:after{content:'10';}

.advantages-box{padding:10px 20px 20px;margin-bottom:100px;border:1px solid #ff6a00;}
.advantages-box h3{font-size:24px;font-weight:700;line-height:40px;margin-bottom:15px;z-index: 6; position: relative; margin-top: 50px;}
.advantages-box.last{background-color:#ff6a00;color:#fff;transition:all ease-in 0.3s;}
.advantages-box.last:hover{background-color:transparent;color:#ff6a00;transition:all ease-in 0.3s;}

/*Counter section*/

.counter-sec{background: rgba(246,41,12,1);padding:70px 0 60px;
background: -moz-linear-gradient(left, rgba(246,41,12,1) 0%, rgba(240,47,23,1) 0%, rgba(251,217,80,1) 0%, rgba(247,92,30,1) 35%, rgba(255,72,0,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(246,41,12,1)), color-stop(0%, rgba(240,47,23,1)), color-stop(0%, rgba(251,217,80,1)), color-stop(35%, rgba(247,92,30,1)), color-stop(100%, rgba(255,72,0,1)));
background: -webkit-linear-gradient(left, rgba(246,41,12,1) 0%, rgba(240,47,23,1) 0%, rgba(251,217,80,1) 0%, rgba(247,92,30,1) 35%, rgba(255,72,0,1) 100%);
background: -o-linear-gradient(left, rgba(246,41,12,1) 0%, rgba(240,47,23,1) 0%, rgba(251,217,80,1) 0%, rgba(247,92,30,1) 35%, rgba(255,72,0,1) 100%);
background: -ms-linear-gradient(left, rgba(246,41,12,1) 0%, rgba(240,47,23,1) 0%, rgba(251,217,80,1) 0%, rgba(247,92,30,1) 35%, rgba(255,72,0,1) 100%);
background: linear-gradient(to right, rgba(246,41,12,1) 0%, rgba(240,47,23,1) 0%, rgba(251,217,80,1) 0%, rgba(247,92,30,1) 35%, rgba(255,72,0,1) 100%);}
.single-box i {color: #fff;font-size: 40px;line-height: 50px;}
.single-box h4 {font-size: 36px;line-height: 50px;}

/*Blog*/

.blog h2{margin-bottom:60px;}
.blog h2::after{left:47%;}
.news-caption p.color-orange, .sitemap li a:hover{color:#ff6a00;}
.bg-white{background-color:#ff6a00;color:#fff;padding:5px;margin-right:10px;}
.news-details h3, .blog-tab h3{margin:0 0 20px;font-weight:600;}
.news-list li a { width: 70%;display: inline-block;vertical-align: middle;}
.news-caption p{color:#333;}
.blog a:hover{transform:translateY(30deg);}
.vertical-text {overflow: hidden; box-sizing: border-box; height: 330px;}
.vertical-text .newsclass {animation: vertical-text 25s linear infinite; overflow: hidden;}
.blog-tab .nav-pills>li.active>a, .blog-tab .nav-pills>li.active>a:hover, .blog-tab .nav-pills>li.active>a:focus, .blog-tab .nav>li>a:hover, .blog-tab .nav>li>a:focus{background-color:#ff6a00;color:#fff;}
.blog-tab .nav li a{color:#333;font-size:15px;border-bottom:1px dashed #ff6a00;}
.blog-content img{margin:25px 0;}
.blog-content ul li b, .sitemap li a, .sitemap li b{color:#333;font-weight:600;}
.blog-content ul li p{margin-left:10px;margin-bottom:20px;}
.blog-content p{color:#555;}

/* Move it (define the animation) */
@keyframes vertical-text {
 0% {transform: translateY(0%);}
50% {transform: translateY(-50%);}
100% {transform: translateY(-100%);}}
.vertical-text .newsclass:hover {animation-play-state: paused;}
.ul.news-list{height:350px !important;}


/*getin touch*/
.getintouch, .blog{padding-top:80px;}
.contact-form{padding-left:30px;}
.contact-form h2{text-align:left;text-transform:uppercase;line-height:50px;}
.contact-form h2:after{display:none;}
.contact-form .form-control{border:none;border-bottom:1px solid #ff6a00;box-shadow:none;}
.contact-form .home-btn{margin-top:25px;display:inline-block;}
/*Footer Sec*/
footer{background:linear-gradient(to right, #4F5865, #353A43);padding:40px 0 ;}
footer h2{font-size:26px;text-align:left;line-height:35px;margin-bottom:10px;}
footer h2:after,.inner-banner-content h2:after{display:none;}
.footer-logo img{max-height:100px;}
footer ul li a, footer a,.footer-bg a{color:#fff;}
footer ul li {margin-bottom: 10px;padding-left: 20px;position: relative;}
footer ul li:after {content: '\f105';left: 0;top: 0;position: absolute;color: #fff;font-family:fontawesome;}
footer ul li a:hover, footer ul li.active a, footer a:hover,footer ul li.active:after,footer ul li:hover:after,.information span.right-write a:hover,.information .right-write a:hover i{color:#ff6a00;}
.social-link a{margin:5px 10px;position:relative;display:inline-block;cursor:pointer;}
.footer-bg{background:rgba(78, 87, 100,0.8);padding:10px 0;}
.footer-bg p, .footer-bg p a{margin-bottom:0;text-transform:uppercase;}

/*Inner Banner*/
.inner-banner{background:url(../images/inner-banner.png) top center no-repeat;height:340px;background-size:cover;position:relative;}
.inner-banner-content {padding-top:15%;}
.inner-banner-content h2 { text-align: left;text-transform: uppercase;font-size: 34px;margin-bottom: 0;font-weight: 600;}
.breadcrumb {background-color:transparent;}
.breadcrumb li a { color: #fff;}
.breadcrumb li.active {color: #000;}

/*About us page*/
.about-page-content h3{text-transform: uppercase;font-weight: 600;font-size: 36px;margin: 0 0 20px;}
.app-screen, .feature-section{padding:40px 0;}
.app-screen #screenshot-slider{padding-top:50px;}
.app-screen #screenshot-slider.owl-theme .owl-nav{position:relative;}
.app-screen #screenshot-slider.owl-theme .owl-nav {margin-top: 20px; position: absolute;top: -5%;right: 5%;}
.pb-30{padding-bottom:30px;}
.feature-section .feature-item{border-bottom:none;}
.feature-content{border-right:1px dashed #ff6a00;padding-right:30px;}
.feature-content1{border-left:1px dashed #ff6a00;padding-left:30px;}

/*Contact Page*/
.map{height:420px;}
.map iframe{width:100%;height:100%;border:none;}
.information{padding:0 30px;}
.information span.icon-soc {display: inline-block;width: 7%;vertical-align: top;color:#ff6a00;}
.information span.right-write {display: inline-block;width: 85%;line-height: 22px;margin-bottom: 4px;color:#333;margin-bottom:20px;}
.information span.right-write a,.information .right-write a i{color:#333}


/*Solution Page*/
.solution-content{margin-bottom:30px;background: rgba(250,250,250,1);box-shadow: 0 1px 10px 0px #999;padding: 30px 50px 30px 40px;}
.solution-content h4{color:#333;font-size:26px;margin-bottom:20px;}
.solution-content ul li{margin-left:30px;font-size:18px;position:relative;margin-bottom:15px;}
.solution-content ul li::after{position:absolute;left:-20px;top:0;content:'\f105';font-family:fontawesome;}
.solution-page hr{border-bottom:1px dashed #ff6a00;}

/*Feature Page*/
.space {padding: 40px 0;}
.service-1 {background: url(../images/feature-5.jpg) left center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-2 {background: url(../images/feature-2.jpg) right center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-3 {background: url(../images/feature-7.jpg) left center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-4 {background: url(../images/feature-4.jpg) right center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-5 {background: url(../images/feature-1.jpg) left center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-6 {background: url(../images/feature-6.jpg) right center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-7 {background: url(../images/feature-3.jpg) left center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-8 {background: url(../images/feature-8.jpg) right center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-9 {background: url(../images/feature-9.jpg) left center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-10 {background: url(../images/feature-10.jpg) right center no-repeat;background-size: contain;height: 357px;align-content: flex-start;}
.service-content {padding: 30px 50px 30px 40px;margin-top: 40px;background: rgba(250,250,250,1);box-shadow: 0 1px 10px 0px #999;}
.service-content h5 {font-size: 18px;font-weight: 700;color: #333;text-transform: uppercase;}

/*Testimonial*/
.testimonial-sec{padding-top:60px;background:url(../images/testimonial-bg.jpg) top center no-repeat;background-size:cover;height:600px;position:relative;margin-top:80px;}
.testimonial-sec:after {height: 100%;width: 100%;content: '';position: absolute;background-color: rgba(30, 66, 57, 0.5);top: 0;}
.testimonial-sec h2:after{left:47%;}
#test-slider{padding-top:40px;}
#test-slider.owl-theme .owl-nav{margin-top:50px;}
#test-slider h2, #test-slider p, #test-slider b, .testimonial-sec h2{color:#fff;z-index:2;}
#test-slider h4{font-size:28px;font-weight:600;color:#fff;margin-top:20px;}
.test-image img{border-radius:50%;margin-bottom:20px;height:90px;width:90px;}
#test-slider p{font-size:24px;font-weight:600;}

/*Sitemap/404 page*/

.sitemap h1{margin-top:0;}
.sitemap ul li ul{padding-left:30px;margin-top:10px;}
.sitemap ul li{position:relative;}
.sitemap ul li:after {content: '\f105';left: -20px;top: 0;position: absolute;color: #333;font-family:fontawesome;}


/*-----------------------------------Responsive Section----------------------------*/
@media screen and (max-width: 400px){
   footer .col-xs-6{width:100%;}
   .home-content h1{font-size:30px;}
   .home-banner .home-content{padding-top:60%;}
   .home-banner{padding-top:20%;}
   .About-app-content, .feature-box, .service-sec{padding:25px 0;}
   .service-sec h2:after, .advantages-sec h2:after{left:40%;}
   .footer-bg p, .footer-bg p a{font-size:15px;}
   .crm-box-mobile{display:block;}
   .crm-box-mobile h1{font-size:34px;}
   .crm-box{display:none;}
   .home-banner.crm-mobile{height:200px;background-size:contain;}
   .logo img{width:30%;}
   .home-banner .home-content.crm-content{padding-top:30%;}
   .crm-box-mobile .modal-body{padding:15px 0;}
   .crm-box-mobile .contact-form{padding-left:0;}
   section.mobile{padding:20px 0 40px;}
}


@media screen and (min-width: 401px) and (max-width: 767px){
   .home-banner .home-content{padding-top:35%}
   .home-banner{padding-top:10%;}      
   .About-app-content, .feature-box, .service-sec{padding:40px 0;}
   .contact-image{display:none;}
   .home-content h1{font-size:42px;}
   .logo img{width:20%;}
   .home-banner .home-content.crm-content{padding-top:10%}
   .home-banner .home-content.crm-content h1{font-size:30px;}
   .crm-box{padding-top:40%;}
   .crm-box h1{font-size:24px;margin-top:0;}
   .crm-box button{margin-top:0;margin-left:30px;}
   footer.m-footer h2{font-size:22px;}
}
@media screen and (min-width: 401px) and (max-width: 510px){
    footer.m-footer .col-xs-6{width:100%;text-align:center;}
    footer.m-footer h2{text-align:center;}
    .home-banner{padding-top:15%;}
}
@media screen and (max-width: 767px){
   h2{font-size:28px;line-height:45px;}
   section{padding:40px 0;}
   .contact-form{padding-left:10px;}
   .navbar{min-height:75px;}
   .navbar-toggle{margin-top:20px;}
   .navbar-nav li a.demo{background-color:transparent;padding:10px 15px;color:#333;}
   .navbar-nav li:last-child>a:hover{border:none;}   
   .feature-box a.home-btn { margin-top: 30px; position: relative; display: inline-block;}
   .news-details {margin-top: 30px;}
   .news-box {padding: 30px 0;border-bottom: 1px dashed #ff6a00;}
   .about-page-img img{margin-bottom:30px;}
   .feature-content1, .feature-content{border:none;border-bottom:1px dashed #ff6a00;padding-bottom:30px; }
   .information{margin-top:30px;}
   #test-slider p{font-size:14px;}
   .navbar-nav .dropdown-menu{left:-52%;}
   .advantages-box:after{left:10px;}
   .m-footer .social-link a{display:initial;position:relative;}
   .m-footer .social-link a img{width:30%;display:inline-block;}
   .home-banner.crm-mobile{background-size:contain;}
}
@media (min-width:768px) and (max-width:991px){
    
   .navbar{ min-height:70px;}
   .navbar-toggle{margin-top:20px;}
   .home-banner .home-content{padding-top:28%;}
   .home-banner{padding-top:10%;}
   section, .About-app-content, .feature-box, .service-sec{padding:40px 0;}
   h2{font-size:34px;}
   .feature-item h3{font-size:20px;}
   .feature-item p{font-size:13px;}
   .single-box h4 {font-size: 23px;line-height: 35px;}
   .blog,.getintouch{padding-top:0;}
   .contact-form h2{font-size:26px;line-height:30px;}
   .footer-logo p{font-size:12px;}
   .footer-bg p, .footer-bg p a{font-size:14px;}
   .home-banner.crm-mobile{background-size:contain;height:390px;}
   footer h2{font-size:19px;}
   footer .information span.right-write{font-size:14px;margin-bottom:15px;}
   .crm-box{padding-top:30%;}
   .crm-box h1{font-size:22px;margin-bottom:0;}
   .crm-box .home-btn{font-size:14px;padding:5px 10px;}
   .crm-box .modal-content{padding:15px 15px 0;}
}
@media (min-width:992px) and (max-width:1199px){
    .navbar-default .navbar-nav>li>a{font-size:14px;margin:5px;}
    .navbar-nav li a.demo{padding:5px 10px;margin-top:15px;}
    .navbar-nav{margin-top:10px;}
    .navbar{min-height:75px;}
    .home-banner .home-content{padding-top:25%;}
    .home-banner{padding-top:5%;}
    .advantages-box h3{font-size:20px;line-height:30px;}
    .single-box h4{font-size:32px;}
   
}
@media (min-width: 1200px){}