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

body { font-family: 'Roboto Slab', serif; font-size: 14px; color: #666; padding-top: 148px; transition: 0.05s; text-align: justify;}
h1, h2, h3, h4, h5, h6 { margin: 0;}
p { line-height: 25px; text-align: justify;}

.navbar-brand { height: auto;}

.top { border-bottom: #ddd solid 1px; color: #999;}
.top b { color: #666;}
.top p { margin: 0;}
.top .email { padding: 10px 0; border-right:#ddd solid 1px;}
.top .phone { padding: 10px 0; }
.top .email a, .top .phone a { color: #666}

.top .soc { padding: 14px 0 15px; }
.top .soc i { display: inline-block; padding: 13px 0; border: #ddd solid 1px; border-radius: 50px; width: 40px; height: 40px; text-align: center; color: #999; float: right; margin-left: 4px;}
.top .soc i a { color: #666}
.top .soc i:hover { background:#147b70; color: #fff; }

.nav>li>a { padding: 13px 20px;}
.navbar-default { background: #fff;}
.navbar-nav { float: right; margin-top: 20px;}
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { color: #147b70; border: #147b70 solid 2px; padding: 11px 18px}
.nav>li>a.active { color: #147b70; border: #147b70 solid 2px; padding: 11px 18px}  

.dropdown-menu>li>a { padding: 12px 20px;}

.enga { background:#147b70; }
.enga a { color: #fff !important;}

.banner-container { background: #f6f6f6}

.banner-container .carousel-indicators { bottom: 5px; }
.banner-container .carousel-indicators li { width: 15px; height: 15px;}
.banner-container .fade-carousel .carousel-indicators > li.active { width: 15px; height: 15px; }
.banner-container .fade-carousel .carousel-indicators > li { background-color: #1b9588; border-color: #23af9e;} 


/*------------Fade Bs-carousel------------*/
.fade-carousel { position: relative; /*height: 100vh;*/ }
.fade-carousel .carousel-inner .item { /*height: 100vh;*/ }
.fade-carousel .carousel-indicators > li { margin: 0 2px; background-color: #f39c12; border-color: #f39c12; opacity: .7; }
.fade-carousel .carousel-indicators > li.active { width: 10px; height: 10px; opacity: 1; }

/*------------Hero Headers------------*/
.hero { position: absolute; top: 22%; left: 0; z-index: 3; color: #666; width: 500px; }
.hero h1 { font-size: 55px; font-weight: bold; margin: 0; padding: 0; color: #333; margin-bottom: 20px; }
.hero h3 { font-size: 15px; line-height: 25px;}

.fade-carousel .carousel-inner .item .hero { opacity: 0; -webkit-transition: 2s all ease-in-out .1s; -moz-transition: 2s all ease-in-out .1s;-ms-transition: 2s all ease-in-out .1s; -o-transition: 2s all ease-in-out .1s;	transition: 2s all ease-in-out .1s; }
.fade-carousel .carousel-inner .item.active .hero { opacity: 1; -webkit-transition: 2s all ease-in-out .1s; -moz-transition: 2s all ease-in-out .1s; -ms-transition: 2s all ease-in-out .1s; -o-transition: 2s all ease-in-out .1s; transition: 2s all ease-in-out .1s; }

/*------------Overlay------------*/
.overlay { position: absolute; width: 100%; height: 100%; z-index: 2; /*background:rgba(0,0,0,0.1);*/ opacity: .7; }

/*------------Custom Buttons------------*/
.btn.btn-lg {padding: 10px 40px;}
.btn.btn-hero, .btn.btn-hero:hover, .btn.btn-hero:focus { color: #f5f5f5; background-color: #1abc9c; border-color: #1abc9c; outline: none;	margin: 20px auto; }

/*------------Slides backgrounds------------*/
.fade-carousel .slides .slide-1, .fade-carousel .slides .slide-2, .fade-carousel .slides .slide-3 { height: 610px; background-position: center center; background-repeat: no-repeat; }
.fade-carousel .slides .slide-1 { background-image:url(../images/banner1.jpg); }
.fade-carousel .slides .slide-2 { background-image:url(../images/banner2.jpg); }
.fade-carousel .slides .slide-3 { background-image:url(../images/banner3.jpg); }

/*--------------------------------------*/

.content-area { padding: 100px 0;}



.serv-area h1 { font-size: 30px; text-align: center; color: #147b70; padding-bottom: 25px;}
.serv-area h1::after { display: block; content: ""; position: relative; margin: auto; width: 120px; height: 2px; background: #147b70; top: 15px; margin-bottom: 15px; }
.serv-area h4 { font-size: 18px; text-align: center; margin-bottom: 10px; }
.serv-area p { text-align: center; margin-bottom: 40px;}

.serv-box { margin-bottom: 35px; padding:35px; min-height: 320px;text-align: center; }
.serv-box h3 { font-size: 18px; margin: 20px 0; }
.serv-box p {  line-height: 25px; margin-bottom: 20px; }

.serv-box .rdmore { display: block; margin: auto; color: #666;}
.serv-box .rdmore::after { display: block; content: ""; position: relative; margin: auto; width: 50px; height: 2px; background: #147b70; top: 5px; text-decoration: none;}
.serv-box .rdmore:hover { text-decoration: none;}

.serv-box:hover { background: #147b70; color: #fff;}

.serv-box .ico1 { width: 75px; height: 75px; display: block; margin: auto; background: url(../images/software-dev-icon.png) no-repeat 0 0;}
.serv-box:hover .ico1 { background-position: -75px 0;}

.serv-box .ico2 { width: 75px; height: 75px; display: block; margin: auto; background: url(../images/web-des-icon.png) no-repeat 0 0;}
.serv-box:hover .ico2 { background-position: -75px 0;}

.serv-box .ico3 { width: 90px; height: 75px; display: block; margin: auto; background: url(../images/mob-app-icon.png) no-repeat 0 0;}
.serv-box:hover .ico3 { background-position: -90px 0;}

.serv-box .ico4 { width: 90px; height: 75px; display: block; margin: auto; background: url(../images/dig-mar-icon.png) no-repeat 0 0;}
.serv-box:hover .ico4 { background-position: -90px 0;}

.serv-box .ico5 { width: 60px; height: 75px; display: block; margin: auto; background: url(../images/brand-icon.png) no-repeat 0 0;}
.serv-box:hover .ico5 { background-position: -60px 0;}

.serv-box .ico6 { width: 60px; height: 75px; display: block; margin: auto; background: url(../images/test-icon.png) no-repeat 0 0;}
.serv-box:hover .ico6 { background-position: -60px 0;}



.serv-box:hover .rdmore { color: #fff;}
.serv-box:hover .rdmore::after { background: #fff;}


.smart-blk { padding: 85px 0; width: 100%; background: url(../images/smart-bg.jpg) no-repeat center center; color: #fff;}
.smart-blk h2 { margin-bottom: 45px; font-size: 25px;}
.smart-blk p { margin-bottom: 50px; line-height: 25px; padding-right: 40%;}
.smart-blk .smartbx {}
.smart-blk .smartbx h3 { margin-bottom: 30px; font-weight: normal;}
.smart-blk .smartbx h3 b { border: #fff solid 1px; border-right: 0; padding: 5px 10px;}
.smart-blk .smartbx h3 span { border: #fff solid 1px; padding: 5px 10px;}
.smart-blk .smartbx p { padding-left: 30px; margin-bottom: 0; padding-right: 50px;}

.nums-work { padding: 100px 0; border-bottom: #ddd solid 1px;}
.num-blk { color: #666; text-align: center;}
.num-blk img { display: block; margin: auto; margin-bottom: 20px;}
.num-blk h2 { margin-bottom: 20px;}
.num-blk h4 {}
.num-blk h4::after { display: block; position: relative; width: 100px; height: 2px; background: #147b70; top: 15px; content: ""; margin: auto;}

.blog-area { padding: 100px 0;}
.blog-area h4 { text-align: center; margin-bottom: 20px;}
.blog-area h2 { font-size: 30px; text-align: center; color: #147b70; padding-bottom: 70px;}
.blog-area h2::after { display: block; position: relative; width: 100px; height: 2px; background: #147b70; top: 15px; content: ""; margin: auto;}

.blog-box {}
.blog-box .img-div { position: relative;}
.blog-box .img-div img { position: relative;}
.blog-box .img-div .date-blk { position: absolute; left: 0; top: 0; background:#147b70; color: #fff; padding: 7px 10px 10px; }
.blog-box .img-div .date-blk h3 { margin-bottom: 5px;}
.blog-box .img-div .date-blk h4 { margin-bottom: 0px;}
.blog-box .desc { padding: 25px; border: #eee solid 1px;}
.blog-box .desc h3 { font-size: 18px; margin-bottom: 15px; line-height: 25px; text-align: left;}
.blog-box .desc p { font-size: 14px; line-height: 25px; margin-bottom: 20px;}
.blog-box .desc .rdmore { color: #666;}
.blog-box .desc .rdmore::after { display: block; position: relative; width: 40px; height: 2px; background: #147b70; top: 5px; content: "";}

.viewbtn { padding: 15px 20px; border: #ddd solid 1px; color: #666; display: block; margin-top: 35px; text-align: center;}
.viewbtn:hover { text-decoration: none; background:#147b70; color: #fff;  }

.home-blk1 { padding: 35px 0;}
.client-blk h2 { font-size: 30px; color: #147b70; padding-bottom: 30px; }
.client-blk h2::after { display: block; position: relative; width: 100px; height: 2px; background: #147b70; top: 10px; content: "";}
.client-blk .client-slider { margin-top: 20px;}
.client-blk .client-slider p { margin-bottom: 25px;}
.client-blk .client-slider h4 { margin-bottom: 7px; color: #147b70;}

.cont-bx { background:#147b70; padding: 20px 0; margin-top: 80px; color: #fff; text-align: center; }
.cont-bx h2 { font-size: 30px; margin-bottom: 15px;}
.cont-bx i { display: block; margin:5px auto; font-size: 20px; }
.cont-bx h5 { font-size: 16px; margin-bottom: 8px;}
.cont-bx h3 { font-size: 20px; }
.cont-bx hr { margin-top: 10px; margin-bottom: 10px; border: 0; border-top: 1px solid #35978c; }

.reqqt-area { background: url(../images/req-bg.jpg) no-repeat center center; background-size: cover; text-align: center; color: #fff; padding: 70px 0;}
.reqqt-area h2 { font-size: 30px; margin-bottom: 35px;}
.reqqt-area h2::after { display: block; position: relative; width: 100px; height: 2px; background: #fff; top: 10px; content: ""; margin: auto;}
.reqqt-area .reqbtn { background: rgba(0,0,0,0.7); color: #fff; padding: 20px 80px; margin-top: 30px; font-size: 18px;}
.reqqt-area p { text-align: center;}

footer { padding: 60px 0 40px; border-top:#ddd solid 1px; }
footer h4 { font-size: 18px; padding-bottom: 15px; margin-bottom: 20px;}
footer h4::after { display: block; position: relative; width: 50px; height: 2px; background: #147b70; top: 10px; content: ""; }

footer .col1 h5 { font-size: 16px; line-height: 25px;}
footer .col1 h5 span { color: #147b70;}
footer .col1 ul { padding: 0; padding-left:15px;}
footer .col1 ul li { line-height: 30px; color: #147b70;}
footer .col1 ul li a { color: #666; }
footer .col1 .input-group { display: block;}
footer .col1 .form-control { width: 80%; border-radius: 0; height: auto; padding: 12px; display: inline-block;}
footer .col1 .gobtn { background: #147b70; color: #fff; text-align: center; border-radius:0; display: inline-block; padding: 12px 13px;}

footer .col1 .soc { margin-top: 20px; }
footer .col1 .soc i { display: inline-block; padding: 13px 0; border: #ddd solid 1px; border-radius: 50px; width: 40px; height: 40px; text-align: center; color: #999; margin-right:8px;}
footer .col1 .soc i a { color: #666}
footer .col1 .soc i:hover { background:#147b70; color: #fff; }
footer .copy {  text-align: center; padding: 50px 0 20px; border-top:#ddd solid 1px; margin-top: 40px; }


.prof-blk { border: #ddd solid 1px; padding: 20px; border-radius: 5px; margin-top: 23px;}
.prof-blk h3 { margin-bottom: 30px;}
.prof-blk h3::after { display: block; position: relative; width: 50px; height: 2px; background: #147b70; top: 10px; content: ""; }
.prof-blk p { text-align: left; margin-bottom: 0}

.serv-page .serv-box { border: #ddd solid 1px; border-radius: 5px;}

.client-box { border: #ddd solid 1px; border-radius: 5px; text-align: center; padding: 15px; margin-bottom: 30px;}
.client-box img { display: block; margin: auto; border-bottom: #ddd solid 1px;}
.client-box h5 { margin: 10px 0 0;}

.adrs-box { padding: 0; margin-top: 40px; text-align: center;}
.adrs-box h4 { margin: 25px 0 10px;}
.adrs-box i { font-size: 50px; color: #147b70;}
.adrs-box.adj { border: 0}
.adrs-box p { text-align: center;}

.form-area { background: #147b70 url(../images/contact-bg.jpg) no-repeat center center; padding: 80px 0;}

.cont-form h5 { color: #fff; margin-bottom: 20px; }
.cont-form .form-control { margin-bottom: 20px; height: auto; padding: 10px; background: rgba(255,255,255,0.7); border-color: #fff;}
.cont-form .btn-sbmt { padding:15px 25px; background: #147b70; border-color: #0f685e; display: block; color: #fff; width: 100%; text-transform: uppercase;}


.serv-page .serv-box { text-align: left; min-height: 250px;} 
.serv-page .serv-box .rdmore::after { display: block; content: ""; position: relative; margin: 0; width: 50px; height: 2px; background: #147b70; top: 5px; text-decoration: none;}
.serv-page .serv-box .rdmore:hover { text-decoration: none;}
.serv-page .serv-box p { text-align: left !important;}
.serv-page .serv-box:hover { background:none; color: #666; border-color: #ccc; box-shadow: 0 0 2px 2px #ddd;}
.serv-page .serv-box:hover .rdmore { color: #666;}
.serv-page .serv-box:hover .rdmore::after { background: #147b70;}

.serv-det h2 { margin-bottom: 25px;}
.serv-det p { text-align: justify;}
.serv-det h3 { margin-bottom: 20px; font-size: 20px;}


.serv-det-bx { margin-bottom: 35px; padding:35px; min-height: 320px; background: #147b70; color: #fff; }
.serv-det-bx h3 { font-size: 18px; margin: 20px 0; }
.serv-det-bx p {  line-height: 25px; margin-bottom: 20px; }
.serv-det-bx .ico1 { }
.serv-det-bx.adj { min-height: 0;}

.serv-b1 { padding: 15px; /*border: #147b70 solid 2px;*/ margin-bottom: 20px; background: #f4f4f4;}
.serv-b1 p { margin-bottom: 0}

.cb1 { min-height: 250px;}
.cb1 ul { padding: 20px; border: #ddd solid 1px; border-radius: 5px; list-style-position: outside; padding-left: 35px;}
.cb1 ul li { margin-bottom: 10px;}
.success { color: #FFF; font-size: 16px; margin-bottom: 15px; display: block; margin-top: -10px;}

.col1 .blg { display: inline-block; padding: 10px 20px; border: #147b70 solid 2px; margin-top: 25px; color: #147b70; text-decoration: none; }
.col1 .blg:hover { background: #147b70; color: #fff;}

.eng-btn { padding: 15px 20px; color: #fff; display: block; margin-top: 35px; text-align: center; background:#147b70; text-transform: uppercase;}
.eng-btn:hover { text-decoration: none; background:none; color: #fff; border: #147b70 solid 1px;  color: #666; padding: 14px 19px;}


@media (min-width: 1340px)
{
	.container { width: 1300px;}
}
@media screen and (max-width: 1190px)
{
	.smart-blk .smartbx p { padding-right:20px;}
}
@media screen and (max-width: 992px)
{
	.nav>li>a { padding: 13px 13px; }
	.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { padding: 11px 11px}
	.smart-blk { background-size: cover;}
	.content-area { padding: 50px 0;}
	.serv-box { min-height: 325px;}
	.smart-blk p { padding-right: 0; }
	.smart-blk .smartbx { margin-bottom: 40px; }
	.blog-box { margin-bottom: 20px; }
	.blog-area { padding: 50px 0; }
	.client-blk .client-slider img { margin-bottom: 20px;}
	.serv-page .serv-box { min-height: 0;}
	.serv-page .serv-box h3 { margin-top: 0}
	
}
@media screen and (max-width: 768px)
{
	.top .email { display: none;}
	.navbar-toggle { margin-top: 30px;}
	.fade-carousel .slides .slide-1, .fade-carousel .slides .slide-2, .fade-carousel .slides .slide-3 { height: 400px; background-size: contain;}
	.hero h1 { font-size: 30px;}
	.hero { width: 400px;}
	.serv-box { min-height: 0; padding: 20px; border-bottom: #ddd solid 1px; }
	.nums-work { padding: 50px 0; }
	.num-blk {padding-bottom: 40px;}
	.navbar-nav { float: none; margin-top: 0; }
}
@media screen and (max-width: 576px)
{
	.fade-carousel .slides .slide-1, .fade-carousel .slides .slide-2, .fade-carousel .slides .slide-3 { height: 200px; background-size: contain;}
	.hero h3 { display: none;}
	.hero h1 { font-size: 20px;}
	.btn.btn-hero, .btn.btn-hero:hover, .btn.btn-hero:focus {margin: 10px auto;}
	.banner-container .btn.btn-lg { padding: 5px 20px; font-size: 14px; }
	
}

