body{background:#fcfcfc;}
h3, h4{font-size:18px; font-weight: 500; text-transform: uppercase; line-height: 30px;}
h3 + span, h4 + span {width: 50px; margin: 30px auto;}
span.blu {border-color: #fff;}
.ylw, .grn, .mrn, .prp{color: #86888d}
.blu{color: #0197cb}
.h1 p{font-size:28px; font-weight: 500; margin-bottom: 10px}

/*h3 css and paragraph and h4*/
.h3size{font-size:40px;text-transform: capitalize;margin-bottom:50px; margin-top: 40px}
.h4size{font-size:33px;text-transform: capitalize;margin-bottom:10px;}
.contact1 p{color:#2c313c; font-size:22px;}
.color1 b{color:#0197cb;}
.color1 p{color: #a9abb1;}
.color11 h4{line-height: 0px;font-size: 15px;}
.color11 p{font-size: 14px;}

/*carousel css*/
.bs-slider{overflow:hidden;position:relative;background:#000; z-index: 0}.bs-slider .bs-slider-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.4)}.bs-slider>.carousel-inner>.item>a>img,.bs-slider>.carousel-inner>.item>img{margin:auto;width:100%!important}.fade{opacity:1}.fade .item{top:0;z-index:1;opacity:0;width:100%;position:absolute;left:0!important;display:block!important;-webkit-transition:opacity ease-in-out 1s;-moz-transition:opacity ease-in-out 1s;-ms-transition:opacity ease-in-out 1s;-o-transition:opacity ease-in-out 1s;transition:opacity ease-in-out 1s}.fade .item:first-child{top:auto;position:relative}.fade .item.active{opacity:1;z-index:2;-webkit-transition:opacity ease-in-out 1s;-moz-transition:opacity ease-in-out 1s;-ms-transition:opacity ease-in-out 1s;-o-transition:opacity ease-in-out 1s;transition:opacity ease-in-out 1s}.control-round .carousel-control{top:47%;opacity:0;width:45px;height:45px;z-index:100;color:#fff;display:block;font-size:24px;cursor:pointer;overflow:hidden;line-height:43px;text-shadow:none;position:absolute;font-weight:400;background:0 0;-webkit-border-radius:100px;border-radius:100px}.control-round:hover .carousel-control{opacity:1}.control-round .carousel-control.left{left:1%}.control-round .carousel-control.right{right:1%}.control-round .carousel-control.left:hover,.control-round .carousel-control.right:hover{color:#fdfdfd;background:rgba(0,0,0,.5);border:0 transparent}.control-round .carousel-control.left>span:nth-child(1){left:45%}.control-round .carousel-control.right>span:nth-child(1){right:45%}.indicators-line>.carousel-indicators{display: none;right:0;bottom:5%;left:0;margin:auto;width:90%;height:20px;font-size:0;overflow-x:auto;overflow-y:hidden;padding-left:10px;padding-right:10px;padding-top:1px;white-space:nowrap}.indicators-line>.carousel-indicators li{padding:0;width:15px;height:15px;border:1px solid #9e9e9e;text-indent:0;overflow:hidden;text-align:left;position:relative;letter-spacing:1px;background:#9e9e9e;-webkit-font-smoothing:antialiased;-webkit-border-radius:50%;border-radius:50%;margin-right:5px;-webkit-transition:all .5s cubic-bezier(.22,.81,.01,.99);transition:all .5s cubic-bezier(.22,.81,.01,.99);z-index:10;cursor:pointer}.indicators-line>.carousel-indicators li:last-child{margin-right:0}.indicators-line>.carousel-indicators .active{margin:1px 5px 1px 1px;box-shadow:0 0 0 2px #fff;background-color:transparent;position:relative;-webkit-transition:background-color .3s ease;-moz-transition:background-color .3s ease;-o-transition:background-color .3s ease;transition:background-color .3s ease}.indicators-line>.carousel-indicators .active:before{transform:scale(.5);background-color:#fff;content:"";position:absolute;left:-1px;top:-1px;width:15px;height:15px;border-radius:50%;-webkit-transition:background-color .3s ease;-moz-transition:background-color .3s ease;-o-transition:background-color .3s ease;transition:background-color .3s ease}.slide_style_left{text-align:left!important}.slide_style_right{text-align:right!important}.slide_style_center{text-align:center!important}.slide-text{left:0;top:25%;right:0;margin:auto;position:absolute;text-align:left;padding:10px 85px}.slide-text>.h1{font-size:51px;margin-top:40px;letter-spacing:3px;display:inline-block;font-weight: 700;-webkit-animation-delay:.7s;animation-delay:.7s}.slide-text>p{padding:0;color:#fff;font-size:20px;line-height:24px;font-weight:300;margin-bottom:40px;letter-spacing:1px;-webkit-animation-delay:1.1s;animation-delay:1.1s}.slide-text>a.btn-default,.slide-text>a.btn-primary{font-weight:400;font-size:13px;line-height:15px;text-align:center;padding:17px 30px;white-space:nowrap;letter-spacing:1px;display:inline-block;text-transform:uppercase;border:none}.slide-text>a.btn-default{color:#000;margin-right:10px;-webkit-animation-delay:2s;animation-delay:2s;-webkit-transition:background .3s ease-in-out,color .3s ease-in-out;transition:background .3s ease-in-out,color .3s ease-in-out}.slide-text>a.btn{color:#fff;cursor:pointer;margin-left:10px;background:#00bfff;text-decoration:none;-webkit-animation-delay:2s;animation-delay:2s;-webkit-transition:background .3s ease-in-out,color .3s ease-in-out;transition:background .3s ease-in-out,color .3s ease-in-out}.slide-text>a:active,.slide-text>a:hover{color:#fff;background:#222;-webkit-transition:background .5s ease-in-out,color .5s ease-in-out;transition:background .5s ease-in-out,color .5s ease-in-out}.headerLine{z-index: 3}
.regDiv{position: absolute; margin:0; bottom:80px; left:0; right:0; text-align:center; z-index: 2}
/*Custom buttons*/
.btn{font-weight:600; transition:.3s all}
.btn-default{background:rgba(0,0,0,.15); border:2px solid rgba(256,256,256,.5); color: #fff}
.btn-default:hover, .btn-default:focus{border-color:rgba(256,256,256,.5); background:rgba(0,0,0,.4) !important; color:#fff !important;}
.btn-lg{padding:10px 22px; font-size: 20px}
/*slide backgrounds*/
.bg1{background: url(../images/home/bg2.jpg) no-repeat top left / cover;}
.bg2{background: url(../images/home/bg1.jpg) no-repeat center top / cover;}
.bg3{background: url(../images/home/bg3.jpg) no-repeat center top / cover;}

/*Develop Class*/
#develop_class{margin-top: 20px;}
#develop_class .container{padding-bottom: 0}
#develop_class .fontsize p{font-size: 16px;color: #2c313c;}
.dimond{height: 160px;margin-bottom: 41px;}
.rightbordar{border-right: 2px solid #f1f1f1;width: 20%;}
.leftpa{padding-left: 42px;padding-right: 1px;line-height: 27px;}
.leftpa h4{margin-bottom: 25px;font-size: 18px;font-weight: 700;color: #4f5565;}
#develop_class h4{margin-bottom: 25px;}
#develop_class h3{}
#develop_class .develop{padding-right: 145px;}
/*Intro*/
#intro {text-align: left;background:url(../images/home/product_bg.png) no-repeat center top / cover;}
#intro{color:#372b41}
#intro .col-sm-4 > a {display: block; padding: 30px; border: 1px solid transparent; transition: .3s all ease-in; text-decoration: none}
#intro .col-sm-4 > a:hover{border-color: #fff; box-shadow: 0 0 10px rgba(0,0,0,.07);}

#intro .col-sm-4 > a .icon12{margin: -1px 0 0 5px; transition: .2s all ease-in}
#intro .col-sm-4 > a:hover .icon12{margin-left: 10px}

#intro img{margin-bottom: 10px}
#intro p{text-align: left}
#intro a{color:#acacac; font-weight: 500}
#intro .readmore1 span{display: block; text-decoration: none;color: #0197cb; font-size: 16px; margin-top: 28px}
.dblue{border-color: #0197cb ;margin-right: 251px;}
#intro h4{font-size: 18px;font-weight: 700;color: #4f5565;}


/*API*/
#api{color:#372b41; text-align: left}
.text-left .left{padding-left:0px ! important;}
#api a{display:inline-block; -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity:.5; padding:0 16px; transition: .3s all}
#api a:hover{-webkit-filter: grayscale(0); filter: grayscale(0); opacity:1;}


/*Solutions*/
.con1{padding: 0px 40px;}
#solutions h4{font-size: 18px}
#solutions aside a{display:block; padding: 30px 30px 28px; margin-bottom: 20px; text-decoration: none; cursor: pointer; background-repeat: no-repeat; background-position: center; background-size: cover; color:#fff; transition: all .6s;}
#solutions .col-md-6, #solutions .col-md-3, #solutions .col-xs-6{padding-right:10px; padding-left:10px}
#solutions .col-md-3 a{padding:10px 30px;}
#solutions a:hover{background-position: 0 600px;}
#solutions .col-md-3 a:hover{background-position: 0 200px;}
#solutions a h4+span{border-color:#a3e0ff; margin:30px 0}
a.sol1{background-color: #5ac5fc;border:1px solid #99d8f8;}
a.sol1 .col-sm-6{margin-bottom: 10px}
a.sol2{background-color: #de0041; background-image: url(../images/home/chrome-bg.png);}
a.sol3{background-color: #edb40d; background-image: url(../images/home/firefox-bg.png);}
a.sol4{background-color: #443a4c; background-image: url(../images/home/tally-bg.png);}
a.sol5{background-color: #793c84; background-image: url(../images/home/spreadsheet-bg.png);}
a.sol6{background-color:#766e7d; background-image: url(../images/home/otp-bg.png);}#solutions a.more{background-color:#cdcccf;}
a.sol6:hover{background-color:#372b41}#solutions a.more:hover{background-color:#10adff;}
#solutions {text-align:left;background-color: #edf1fc;}
#solutions .con1{margin-top: -99px;}
#solutions .potion{position:relative;top:60px; margin-top: 40px}
#solutions .col-md-3{padding:25px 30px; transition: all .3s; text-align: left; border:1px solid transparent;}
#solutions h4, #specialities h4{font-size: 17px,color:#2c313c;}
#solutions p{color: white;padding: 0px 37px;}
#solutions a:hover{color:#ff2e6b}
.mar{padding-top: 86px;}
.tabcontent aside{-webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; perspective: 1000; height:235px; position: relative; z-index: 1; cursor: pointer; margin-top:30px;}
.tabcontent aside a{display: block;color: #fff;width: 74%;height: 214px;transform-style: preserve-3d;transition: all .2s linear;text-decoration: none;}
.tabcontent aside:hover a { transform: rotateY(180deg);}
.tabcontent aside a h4{line-height: 32px;margin-top: 20px;font-size: 19px;}
.face{position: absolute;width: 100%;backface-visibility: hidden;padding: 30px;height: 235px;top: 1px;left: 1px;box-shadow: 0 7px 20px rgba(0,0,0,.06);}
.back{display: block; top:0; position: absolute; transform: rotateY(180deg); box-sizing: border-box;}
.sol7 .front, .sol7 .back{background:#9d99a0}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {color: #555555;cursor: default;background-color: #5ac5fc;border: none;border-bottom-color: transparent;/* border-radius: 60px; */border-top-left-radius: 64px;border-top-right-radius: 64px;}
.nav-tabs > li, .nav-pills > li {float:none;display:inline-block;display:inline; /* ie7 fix */zoom:1; /* hasLayout ie7 trigger */margin-bottom: -23px ! important;}
.nav-tabs, .nav-pills{text-align:center;}
.back{display: block;top: 0;position: absolute;transform: rotateY(180deg);box-sizing: border-box;}
.face {position: absolute;width: 100%;backface-visibility: hidden;padding: 36px 0px;height: 213px;box-shadow: 0 7px 20px rgba(0,0,0,.06);}
.nav-tabs>li>a:hover {border: none;}
.nav>li>a:focus, .nav>li>a:hover {text-decoration: none;background: none;}
.urlshort{color: white ! important;font-size: 24px;font-weight: 300;}
.urlshortblockleft{padding-left: 51px;margin-right: -75px;}
.urlshortblockright{padding-left:10px;margin-right: -48px;}
.leftpart{width:30%;}
.centerpart{width:40%;}

/* Style the tab */
.tab {
    overflow: hidden;
    text-align:center;
}

/* Style the buttons inside the tab */
.tab button {
    background-color: inherit;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 32px 28px 18px;
    transition: 0.3s;
    font-size: 17px;
    border-top-left-radius: 100%;
    border-top-right-radius: 100%;
}

/* Create an active/current tablink class */
.tab button:hover {
	background: #fafafa
}
.tab .active img{
    filter: brightness(100);
}
.tab .tab1.active {
    background-color: #5ac5fc;
}

.tab .tab2.active {
    background-color: #018af4;
}
/* Style the tab content */
.tabcontent {
	position: relative;
    display: none;
    padding: 6px 12px;
    border-top: none;
}
#urlshorttab{background-color: #5ac5fc;}
#othertab{background-color: #018af4;}

/*plugin*/
#plugin {text-align:left}
#plugin .col-md-3{padding:25px 30px; transition: all .3s; text-align: left; border:1px solid transparent;}
#plugin .n, #addons .n{font-size: 32px;text-transform: capitalize;}
#addons .n{margin-top: 5px}
#plugin h4, #specialities h4{font-size: 17px,color:#2c313c;}
#plugin p{color: #b8b3bd;font-size: 18px; margin-top:15px}
#plugin .topknowmore{font-weight: 400;color: #aaa; margin-top: 15px;display:inline;text-decoration: none;text-align: center;}
#plugin .topknowmore:hover{color:#ff2e6b}
#plugin a {text-decoration:none;}
#plugin .paddingplug:hover{border-color:#f5f5f5;}
.plug img{margin-top:290px;}
.paddingplug{margin: 0px 0px;}
.bottommar{margin-bottom: 80px;}
.bottommar p{font-size:24px;}
.color123 p, .color123 h3{margin-top:15px;}
.pugproduct{margin: 25px 98px; position: relative; z-index: 2;}
#plugin .pugproduct p{margin-top:25px}
#plugin .paddingplug{border: 4px solid transparent;}
.color123 p{font-size:24px;}

/*Addons*/
#addons{text-align:left; background: url(../images/home/bg-addons.jpg) no-repeat center top / cover; color:#fff}
#addons .container{padding-bottom: 0}
#addons h3{color:#fff}
#addons p{color:#dcedff}
#addons .clearfix a{display:block; background: #fff; border-radius:8px; padding: 15px 20px; box-shadow: 0 15px 30px rgba(0,0,0,.2)}
#addons .clearfix a:hover{cursor: pointer; background: #dcedff}
#addons .sides{margin-top:150px;}
.sides .text-left img{margin-left:20px}
.sides .text-right img{margin-right:20px}
#addons .btncomman {top: -50px; position: relative;}
.add4{position: relative; top:-150px; width:52%; margin: 0 auto}
.add4 > img{position: absolute; z-index: 2; left: 0; right: 0; margin: auto; top: 15px;}
.add4 a{width:80%; position: relative}
.as1,.as2{z-index: 1}
.as1,.as3{left:-20px}
.as2,.as4{right:-70px}
.add4 a:after{content: " ";position: absolute; display: block; width: 100%; height: 100%; top: 0; left: 0; border-radius: 8px; background: #fff;}
.add4 a:hover:after{background:#dcedff}
.add4 a img{position: relative; z-index: 1}
.as1:after{transform-origin: top left;transform: skew(50deg, 0deg);}
.as2:after{transform-origin: top left;transform: skew(-50deg, 0deg);}
.as3:after{transform-origin: bottom left;transform: skew(-50deg, 0deg);box-shadow:175px 0 60px rgba(0,0,0,.1)}
.as4:after{transform-origin: bottom left;transform: skew(50deg, 0deg);}
/*Plugins*/

/*integrations*/
#integrations {text-align:left}
#integrations h3{margin:0 0 100px}
#integrations .col-md-3{padding:25px 30px; transition: all .3s; text-align: left; border:1px solid transparent;}
#integrations h4, #specialities h4{font-size: 17px,color:#2c313c;}
#integrations p{color:#b8b3bd}
#integrations .focus1{transition:.3s all; position: relative;}
#integrations .focus1 div{border-radius: 100%; position: absolute; transition:.3s all}
#integrations .focus1 div:hover{margin-top: -10px}
#integrations .focus1 div img{display: block;margin-left: auto;margin-right: auto;}
#integrations .btncomman{margin-top:370px}
.shapeezee {width: 179px;height: 179px;background-color: #fbca0e;left: 237px;top: -28px;}
.Shapefocus {width: 234px;height: 234px;background-color: #eaeaea;top: 59px;left: -30px;}
.Shapebusy {width: 146px;height: 146px;background-color: #024a8d;left: 179px;top: 150px;}
.Shapemarg {width: 185px;height: 185px; background-color: #5ac5fc;top: -25px;left: 50px;}
.Shapefocus img{padding-top: 86px;}
.Shapebusy img{padding-top: 56px;}
.shapeezee img{padding-top: 30px;}
.shapecy img{padding-top: 90px;}
.shapezaze img{padding-top: 74px;}
.Shapemarg img{padding-top: 65px;}
.shapezaze {width: 193px;height: 193px;background-color: #c72127;left: 145px;top:160px;}
.shapecy {width: 267px;height: 267px;background-color: rgba(235,173,38,0);border: solid 3px #d9d9d9;left: 155px;top: 95px;}
.color1{color:#2c313c;}
.other1{position: relative;top: 300px;left: 120px;}
.other2{position: relative;left: 300px;top: 109px;}
.other3{ position: relative;top: 56px;left: 135px;}

/*Services*/
#services {background:#372b41; text-align:left}
#services .col-md-3{padding:25px 30px; transition: all .3s; text-align: left; border:1px solid transparent;}
#services .col-md-3:hover{background:#27202c; border-color:#3b2948; box-shadow: 0 9px 23px rgba(0,0,0,.1);}
#services h4, #specialities h4{font-size: 17px}
#services p{color:white;}
#services a{font-weight: 400;color: white; margin-top: 15px; display: inline-block; text-decoration: none;}
#services a:hover{color:#ff2e6b}
#services button{border: none; background: transparent; color: #fff; font-weight: 100; font-size: 16px; padding:0; letter-spacing: 1px; margin-top: 20px}
#services button .icon12{margin: -1px 0 0 5px; transition: .2s all ease-in}
#services a:hover .icon12{margin-left: 10px}

/*Download msg app*/
#download{text-align: left;background: url(../images/home/download-bg.jpg) no-repeat center top / cover;height: 670px;margin-bottom: 35px;}
.imgpo{text-align: center;}
.po h3{right: 218px;color:white;}
.po p{color: white;font-size: 18px; margin-top: 36px; line-height: 30px;}
.po .qr-code{top: 91px;right: 373px;}
.po .googleplay{top: 235px;right: 343px;}
.phone1 img{height: auto;margin-right: 50px;}
.qr12{margin:50px 0 42px;}
#download h3{margin-top: 93px;margin-bottom: 52px;}
.phonewhite{width: 43%;}

/*Specialities*/
#specialities, #clients {text-align:left; color:#372b41}
#specialities h3, #clients h3, #contact h3{color:#2c313c}
#specialities p{color:#69646d}
#specialities .col-md-3{padding:25px 8px;text-align: left;}
#specialities .row{margin-left:-8px;}

/*Facts*/
#facts {text-align: left; background: #494644 url(../images/home/bg-fnf.jpg) no-repeat center top / cover;}
#facts h5{font-size:36px; margin-bottom: 20px; color:#5fc19f;}
#facts h4{font-size:17px}
#facts .col-md-3{padding:0px 17px; padding-top:20px;}

/*Clients*/
#clients img {padding: 9px 18px 0; margin-bottom:20px; width:210px}
.marleft1{margin-left:-15px;}
span.blu{border-color: #ffffff;}

/*Contact*/
#contact{background:#fff; color:#372b41}
#contact p{color:#69646d}
#contact .img-responsive{width:100%}

/*bottom images*/
#bottom {text-align: left; background:url(../images/home/bottom.png) no-repeat center bottom / cover; height: 249px;}


/*------------------------------------------------------*/
/* RESPONSIVE
/*------------------------------------------------------*/
@media (min-width: 1400px) {
	.regDiv{bottom:160px;}
	.item .col-md-8.col-md-offset-2 {margin-top:30px;}
	.item .points.row {margin-top:15px;}
}
@media (max-width: 991px) {
	.navbar-inverse .navbar-nav > li > a{margin-right:10px}
	.col-sm-3, .col-md-4 {margin-bottom: 30px}
	
    .slide-text .h1, #aboutHd h1 {
        font-size: 40px;
        line-height: 50px;
        margin-bottom: 20px;
    }
    .slide-text > p, #aboutHd p {font-size: 18px;}
	#watch .tv{margin: 80px auto 0;}
}

@media  (max-width: 480px) {
	h1 p{font-size: 18px}
    .slide-text {
        padding: 10px 30px;
    }
    .slide-text .h1 {
        font-size: 20px;
        line-height: 25px;
        margin-bottom: 5px;
    }
    .slide-text > p {
        font-size: 12px;
        line-height: 18px;
        margin-bottom: 10px;
    }
    .slide-text > a.btn-default, 
    .slide-text > a.btn-primary {
        font-size: 10px;
        line-height: 10px;
        margin-right: 10px;
        text-align: center;
        padding: 10px 15px;
    }
}


@media only screen and (max-width: 768px) {
	
.bs-slider > .carousel-inner > .item > a > img, .bs-slider > .carousel-inner > .item > img{margin-top: 55px}
.slide-text > .h1{margin-top:0}
.navbar-nav > li > a{padding-left:0}
.slide-text {
	padding: 10px 20px; top:70px;
}
.slide-text .h1 {
	font-size: 24px;
	line-height: 36px;
	margin-bottom: 10px;
}
.slide-text p {
	font-size: 18px;
	line-height: 30px;
	margin-bottom: 10px;
}
.control-round .carousel-control{
	display: none;
}

.h3size{font-size: 30px; line-height: 45px; margin: 20px 0 0}
#intro{background:#EDF1FC}	
#intro .col-sm-4 > a{padding: 0 0 20px; border-width: 0; box-shadow: none;}
.add4, .add4 a{width:auto; position: static; margin-bottom: 50px}
.add4 a:after, .add4 > img{display: none;}
#addons .sides{margin-top:0}
#addons a, .shapeezee{margin-top: 30px !important}
	#addons .text-left, #addons .text-right{text-align: center}
	.sides .text-left img, .sides .text-right img{margin: 0}
	#integrations h3{margin: 0 0 30px}
	.bottommar{margin-bottom: 40px}
#integrations .btncomman{margin: 60px auto 30px}
#integrations .focus1 div{position: static; margin:0 auto;}
.new112 .icon12 {
    color: white !important;
    margin-left: 15px;
    height: 17px;
    width: 6px;
    width: 22px;
}
 	.leftpart {
    width: 102%;
}
 	#develop_class h4 {
    margin-bottom: 25px;
}
   .urlshortblockleft {
    padding-left: 14px;
    margin-right: -75px;
}
.urlshortblockright {
    padding-left: 10px;
    margin-right: -81px;
}
.leftpa {
   padding-left: 1px;
padding-right: 1px;
margin-bottom: 12px;
text-align: center;
}
.rightbordar {
border-right: none;
width: 100%;
text-align: center;
}
.rightbordar img{float:none !important}
#develop_class .fontsize p {
    margin-bottom: 49px;
}
.pugproduct {margin: 25px -14px;}
#integrations .focus1 div{position: static}
	 
	
#plugin h3.n, #addons h3.n {
    line-height: 43px;
}
#download{height: auto}
#download h3{margin-top:40px; line-height: 0}
.responapi h3{
	margin-bottom: 40px
}
#api a {
    padding: 0 0px ! important;
}
.text-left .left {
    padding-left: 16px !important;
}
.contact1 p {
    font-size: 16px;
}
#clients .left {
   margin-left:19px !important;
}

.leftpa {
    text-align: center;
}
.color123 p, .color123 h3 {
    margin-left: 11px;
}
#develop_class .develop{padding-right: 0px;}

.tab {
    margin-top: 119px;
}
	.regDiv{bottom:40px}
}