.calcenter-h{
	margin-top: -34px;
}
.divider-callcenter{
	border-right: 1px solid #ccc;
    height: 30px;
    position: absolute;
    left: 50%;
    top: 9%;
}
.divider-callcenter-inbound{
	border-right: 1px solid #ccc;
    height: 30px;
    position: absolute;
    left: 50%;
	top:12%;
}
.categories{
	margin-bottom: 3%;
	margin-top: 1%;
}
.callcenter img{
	border: 1px solid #ccc;
}
.categories a{
	color: #555252!important;
}
button.active{
	background: #bfcacd!important;
}
.tat{
	margin: 1px 0px 30px 0px;
    padding-top: 27px;
}
.tat p{
	text-align: justify;
}
.outsourcing h3{
	padding-top: 15px;
}
.outsourcing span{
	font-size: 23px;
    font-weight: 600;
    font-family: sans-serif;
}
.why-choose img{
	width: 100%;
    margin-left: 8px;
}
 .Box{
    border: 1px solid #ccc;
    text-align: center;
    padding: 17px;
    margin: 13% 0% 7%;
   }
   .Box:hover .Box-icon{
    background: #858686;
    border-color: #6f6f6f;
    color: #fff;
     transition:all 0.3s ease-out;
   
   }
   .Box .Box-icon{
    height: 100px;
    width: 100px;
    background:#ccc;
    border: 1px solid #ccc;
    text-align: center;
    font-size: 40px;
    line-height: 96px;
    transform: rotate(-45deg);
    margin: -68px auto -20px
   }
   
   .Box .Box-icon i{
    transform: rotate(45deg);
    color:#4f4f4f;
    transition:all 0.3s ease-out;
   }
   .Box:hover .Box-icon i {
    color: #fff;
   }
   .Box .Box-content h3{
      text-transform: capitalize;
    color:#d8d6d6;
    font-size: 20px;
    margin-top: 10%;
   }
   .Box .Box-content h3:after{
    
    border-top: 1px solid #c9c9c9;
    border-bottom: 1px solid #c9c9c9;
    width: 70px;
    height:4px;
    display:block;
    margin: 10px auto 20px;
   }
   .Box .Box-content p{
    text-align: justify;
    margin-bottom: 0px !important;
    color: #d8d6d6;
   }
   .merg{
    margin: 0px;
    padding: 0px 20px 0px 0px;
   }
   .Box .Box-content a{
    background: hsl(0, 0%, 62%);
    box-shadow: 0 1px 0 hsla(0, 0%, 100%, 0.3) inset, 0 1px 3px hsla(0, 0%, 0%, 0.1);
    border-color:transparent;
    color:#353535;
    font-size:13px;
    font-weight:bold;
    margin:0 0 -55px;
    padding: 10px 25px;
   }
   .Box .Box-content a:hover{
    background: hsl(0, 0%, 80%);
    text-decoration: none;
    border-color: #00000045;
   }
   .border-box{
    width: 70px;
    height: 3px;
    border-top: 1px double #c9c9c9;
    border-bottom: 1px solid #c9c9c9;
    margin: 0px auto;
    display: block; 
   	margin-top: -22px;
    margin-bottom: 9px;
  }
  center.Box-content {
  	color: #ffffff;
  }
  .light-green{
  	background: #4f697a;
  }
  .light-red{
  	background: #2f343d;
  }
  .white{
  	color: #d8d6d6;
  	font-size: 16px;
  }
  .outsourcing{
  	padding-top: 15px;
  }
  .call img{
  	margin-left: -19px;
    margin-bottom: 10px;
    margin-top: -16px;
  }
  .call p{
  	font-size: 14px;
  	margin-top: 5px;
  }
  .call strong{
  	font-size: 18px;
  }
  .call i{
  	font-size: 19px;
    line-height: 32px;	
    color: #676a6b;
    margin-right: 12px;
  }
  figcaption{
  	font-size: 16px;
    font-weight: 600;
  }
  h1{
             font-size:25px;
             text-align: left;
             text-transform:capitalize;
         }
        .service-box{
            position: relative;
            overflow: hidden;
            margin-bottom:10px;
            perspective:1000px;
            -webkit-perspective:1000px;
        }
        .service-icon{
            width: 100%;
            height: 220px;
            padding: 20px;
            text-align: center;
            transition: all .5s ease;
        }

        .service-content{
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            opacity: 0;
            width: 100%;
            height: 220px;
            padding: 20px;
            text-align: center;
            transition: all .5s ease;
            background-color: #474747;
            backface-visibility:hidden;
            transform-style: preserve-3d;
            -webkit-transform: translateY(110px) rotateX(-90deg);
            -moz-transform: translateY(110px) rotateX(-90deg);
            -ms-transform: translateY(110px) rotateX(-90deg);
            -o-transform: translateY(110px) rotateX(-90deg);
            transform: translateY(110px) rotateX(-90deg);
        }
        .service-box .service-icon .front-content{
            position: relative;
            top:80px;
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        .service-box .service-icon .front-content i {
            font-size: 100px;
            color: #fff;
            font-weight: normal;
        }

        .service-box .service-icon .front-content h3 {
            font-size: 15px;
            color: #fff;
            text-align: center;
            margin-bottom: 15px;
            text-transform: uppercase;
        }
        .service-box .service-content h3 {
            font-size: 15px;
            font-weight: 700;
            color: #fff;
            margin-bottom:10px;
            text-transform: uppercase;
        }
        .service-box .service-content p {
            font-size: 13px;
            color: #b1b1b1;
            margin:0;
        }
        .yellow{background-color: #ffc000;}
        .orange{background-color: #fc7f0c;}
        .red{background-color: #e84b3a;}
        .grey{background-color: #474747;}
        .service-box:hover .service-icon{
            opacity: 0;
            -webkit-transform: translateY(-110px) rotateX(90deg);
            -moz-transform: translateY(-110px) rotateX(90deg);
            -ms-transform: translateY(-110px) rotateX(90deg);
            -o-transform: translateY(-110px) rotateX(90deg);
            transform: translateY(-110px) rotateX(90deg);
        }
        .service-box:hover .service-content {
            opacity: 1;
            -webkit-transform: rotateX(0);
            -moz-transform: rotateX(0);
            -ms-transform: rotateX(0);
            -o-transform: rotateX(0);
            transform: rotateX(0);
        }
        .service_container{
        	margin: 0px;
        	padding:0px;
        }
       /* .wrap1{
          padding: 9% 0;
          padding-bottom: 0px;
        }*/
@media(max-width: 1199px) and (min-width: 992px)
{
	.testimonials-grid.grid-3 li{
		min-height: 490px;
	}
  .label-right input {
    width: 67%!important;
  }
  .contact-box-head h3{
    font-size: 16px!important;
  }
  .contact-box-head-circle
  {
    height: 55px!important;
    width: 55px!important;
  }
  .contact-box-head{
    min-height: 79px!important;
  }
}
@media(max-width: 991px)
{
	.testimonials-grid.grid-3 li{
		min-height: auto;
	}
	.divider-callcenter-inbound{
		display: none;
	}
	p.con-height-2a{
		min-height: auto;
	}
	.merg{
    
    padding: 0px;
   }
   .Box{
   	margin: 20% 0% 7%;
   }
   .call{
   	text-align: center;
   }
   .call img{
   	display: none;
   }
   /*.wrap1{
    padding: 16% 0!important;
   }*/
   img.small-device1{
    display: block;
    visibility: visible;
    padding: 0px;
   }
   img.large-device{
    display: none;
    visibility: hidden;
   }
   .img_wrap{
    width: 100% !important;
   }
   .img-wrap1{
    width: 100% !important;

   }
   p.img_wrap1{
    margin-top: 15px !important;
   }
   #about-hogo .about-img img{
    padding-top: 0px;
    margin-left: 0px;
   }
   .label-right input {
     width: 80%!important;
  }
  .contact-box-head-circle{
    left: 14%!important;
  }
  .contact-box-body{
    padding-top: 4%!important;
  }
  .grid-5 li{
    width: 100%;
    padding : 0px !important;
  }
  .elastic-img {
    margin-top: 5%!important;
  }
}
@media(max-width: 767px)
{
	.small-device{
		visibility: hidden !important;
    display: none !important;
	}
  #about-hogo .about-img{
    min-height: auto;
  }
  /*.wrap1{
    padding: 28% 0!important;
  }*/
}
@media(min-width:768px) and (max-width: 992px)
{
	.tat img{
		padding-top: 31px;
	}
}
@media(max-width: 570px)
{
	.Box{
		margin: 30% 0% 8%;
	}
  .label-right input {
    width: 68%!important;
  }
}
@media(max-width: 423px)
{
.Box .Box-icon{
	height: 80px;
    width: 80px;
    margin: -57px auto -20px;
	line-height: 76px;
	}
	.Box .Box-content h3{
		margin-top: 17%;
	}
}
/* --  contact ---*/
.label-left {
  float: left;
  color: #717070;
}
.label-right input{
  width: 73%;
  float: left;
  padding-left: 3px;
}
/* --- contact box design ---- */
.contact-box{
  /*border: 1px solid #ccc;*/
  height: 250px;
  width: 65%;
  margin: 0px auto;
  background: #e0edfd;
  margin-bottom: 42px;
}
.card{
  padding-top: 2%;
}
.contact-box-head {
  background: #49709b;
    min-height: 61px;
    /*position: absolute;*/
    width: 100%;
    left: 37px;
}
.contact-box-head-left{
    height: 27px;
    width: 3.5%;
    border-radius: 5px 5px 0px 42px;
    position: absolute;
    left: 0px;
    background: #1d3856;
    bottom: -11px;
    z-index: -1;
}
.contact-box-head-circle{
    height: 40px;
    width: 40px;
    border-radius: 50%;
    /* float: left; */
    background-color: white;
    /* margin: 11px 11px 11px 29px; */
    position: absolute;
    left: 80px;
    right: 10px;
    top: 12px;
}
.contact-box-head-circle img{
  border-radius: 50%;
}
.contact-box-head-text{
  float: right;
}
.contact-box-head h3{
  font-size: 17px;
    font-family: sans-serif;
    padding: 6px 21px 0px 2px;
    margin-bottom: 0px!important;
    text-align: center;
    color: white;

}
.contact-box-head p{
    font-size: 15px;
    color: white;
    margin-bottom: 0px!important;
    text-align: center;
    margin-top: 0px;
}
.contact-box-footer{
  width: 100%;
  height: 37px;
  background: #85a2c1e0;
  /*position: absolute;*/
  bottom: 0px;
}
.contact-box-footer .contact-box-social ul
  {
    list-style: none;
    /* min-height: 5px; */
    min-height: 61px;
    /* position: relative; */
    /*left: 0px;*/
    /*right: 0px;*/
    /*margin-bottom: 0px;*/
    /* margin: 0px auto; */
    /* text-align: center; */
    width: 100%;
    padding: 6px;
    margin-bottom: 0px;
    /*margin-left: 26px;*/
    /*margin-top: 6px;*/

}
.contact-box-footer .contact-box-social ul li{  
    width: 25%;
    height: auto;
    float: left;
    text-align: center;
    margin-top: 5px;
  }
  .contact-box-footer .contact-box-social ul li img{
    width: 40px;
    height: auto;
  } 
  .contact-box-social{
    height: 60px;
    width: 100%;
    /* margin-top: 13px; */
    padding: 5px;
  }
  .contact-box-body{
    padding-top: 9%;
    padding-left: 18px;
    padding-right: 18px;
    min-height: 158px;
  }
  .contact-box-body h4{
    font-size: 16px;
    /*text-aligns: justify;*/
    color: #65696d;
    padding: 8px;
    margin-bottom: 0px;
  }
  .contact-box-body p{
    font-size: 14px!important;
    text-align: center!important;
    font-family: sans-serif;
    float: left;
    padding: 8px;
  }
  .contact-button{
    padding-left: 0px!important;
  }
  .contact-wrap form .btn-contact{
  padding: 7px 30px!important;
  }
  .development-li li{
    min-height: 290px!important;
  }
  .testi{
    min-height: 230px !important;
  }
  .testi img{
    border:3px solid #133d6d;
  }
  .testired img{
        border: 3px solid #770c07!important;
  }
  p.testimonial-p{
    margin-bottom: 0px!important;
    padding-top: 20px!important;
  }
  .testi-content a{
    padding: 7px 16px;
    background: #38669a;
    text-align: center;
    line-height: 39px;
    color: white;
  }
  /*--  Marketing ----*/
  .marketing-a{
    font-size: 16px!important;
    padding: 12px!important;
  }
  .marketing-button{
    margin-right: 14px!important;
  }
.clients-grid li:after, .testimonial-1 li:after
{
  border-bottom: none!important;
}
.marketing-li li
{
  min-height: 342px !important;
}
.marketing-li a{
  background: none !important;
}
.active{
  background-color: rgba(162, 162, 162, .5);
    /*-webkit-transition: 0.5s;*/
    /*transition: 0.5s;*/
}
h2.marketing-h{
  margin-top: -34px;
  margin-bottom: 9px!important;
}
.market{
  margin-top: -1%!important;
}
.oms{
    padding: 30px 0px;
    /* background: #b1b1b1; */
    border-bottom: 1px solid #888;
    padding-bottom: 0px;
  }
  .oms-img{
    width: 80px;
  }
  .mark{
    background: #dedede;
  }
  .oms p{
    font-size: 15px;
    margin-bottom: 5px;
    line-height: 20px;
    text-align: justify;
  }
  .oms a{
        color: #4c4d4e!important;
  }
  .mark{
    background-image: url(../images/about1.png);
    background-attachment: fixed;
    background-position: center;
  }
  .callc{
    background-color: #222e40!important;
  }
  .callc a{
    color: #949494!important;
      }
 .callc h3
 {
  color: #b5b5b5!important;
 }
 .callc h4
 {
  color: #949494!important;
 }    
 h2.sotware-h{
  margin-bottom: 0px !important;
  margin-top: -33px;
 } 
 h3.float-left{
  float: left;
 }
 .software-1{
  /*background-image: url(../images/banner/software-bg.png);*/
  background-color: #283a3e!important; 
 }
 .software-1 h3{
  color: #b5b5b5;
 }
 .software-1 p{
  color: #b5b5b5;
 }
 .software-1 h4{
  color: #b5b5b5;
 }
 .software-2{
  background-color:#4f5d5f!important;
 }
 .software-2 h3{
  color: #c5c5c5;
 }
 .software-2 p{
  color: #c5c5c5;
 }
 .software-2 h4{
  color: #c5c5c5;
 }
 /*.software-2{
  background-color: #738a8d!important;
 }*/
 .sd-li li{
  min-height: 280px !important;
 }
 .s-development li{
 min-height: 446px!important;
}
.api-li li{
  min-height: 457px!important;
}
li.api-1 {
  min-height: 620px!important;
}
li.api-2{
  min-height: 620px!important;
}
#services a{
  color: #8b9094!important;
}
/*-- software Designing --*/
.dp-text{
  padding: 25px;
}
.dp-text h1{
  margin-bottom: 10px;
}
.dp-text p{
  text-align: justify;
  font-size: 14px!important;
  margin-bottom: 0px
  line-height: 22px!important;
}
.dp-img{
  padding: 35px;
}
.dp-img img{
  min-height: 321px;
  width: 100%;
}
.designing-li li{
  min-height: 237px!important;
}
.designing-li li p{
  margin-bottom: 0px!important;
  min-height: 100px!important;
}
.designing-div{
  min-height: 140px!important;
}
.consulting{
  padding: 60px 0 0px 0px!important;
}
.consulting-wrap{
  padding: 6px 0px!important;
}


/* ---  our works --- */

    
.gallery-title
{
    font-size: 30px;
    color: #717570;
    margin : 25px 25px;
    text-align: center;
    font-weight: 500;
    /*margin-bottom: 70px;*/
}
.gallery-title:after {
    content: "";
    position: absolute;
    width: 5.5%;
    left: 47.5%;
    height: 56px;
    border-bottom: 1px solid #5e5e5e;
}
.filter-button
{
    font-size: 18px;
    border: 1px solid #757575;
    border-radius: 5px;
    text-align: center;
    color: #80827f;
    margin-bottom: 30px;

}
.filter-button:hover
{
    font-size: 18px;
    border: 1px solid #888686;
    border-radius: 5px;
    text-align: center;
    color: #ffffff;
    background-color: #909090;

}
.ser-col p {
    color: #777777;
}
.oc-item{
  background-color: white;
}
#copyrights
{
  min-height: 50px;
}
#copyrights a{
  padding: 9px 20px;
  background: #4785b8;
  border-radius: 2px;
  color: #ffffff;
}
.port-image
{
    width: 100%;
}

.gallery_product
{
    margin-bottom: 30px;
}

.work-section
{
    padding: 5px;
    background: #dedede;
    border: 1px solid #ccc;
}
.work-section img{
    border: 2px solid #d0d0d0;
    width: 100%;
}
.works-content{
  /*padding-bottom: 5px;*/
  padding-bottom: 5px;
  background: #ffffff;
  min-height: 60px;
  margin-top: 5px;
  min-height: 71px;
}
.works-content h4{
    text-align: center;
    margin-bottom: 0px;
    padding: 7px 0px 2px;
    color: #515456;
}
.works-content p{
    margin-bottom: 0px;
    font-size: 13px;
    text-align: center;
    color: #535556;
    line-height: 15px;
}
@media(max-width: 480px)
{
  .work-sm{
    width: 100%!important;
  }
  .contact-box-head h3{
    font-size: 16px!important;
  }
  .contact-box-body{
    min-height: 145px!important;
  }
}
/* --  cloud computing --- */

.cc-top{
  padding: 36px 0px;
}
.cc-text h1{
  margin-bottom: 10px;
}
.cc-text p{
  text-align:  justify;
  margin-bottom: 10px;
}
.cc-img{
      padding: 9px 4px;
}
.cc-top-border{
  border-right: 2px dashed #ccc;
}
.cc-img img{
  width: 100%;
}
.cc-body{
  padding-top: 25px;
}
.cc-body h4{
  margin-bottom: 10px;
}
.cc-top h4{
  margin-bottom: 17px;
}
.cc-top p{
  font-size: 16px;
  margin-bottom: 10px;
}
.cc-top p span{
  font-size: 19px;
  font-weight: 600;
  margin-left: 8px;
}
.cc-body-left{
  padding-left: 0px !important;
}
.cc-body p{
  text-align: justify;
}
.google-cloud{
  padding-top: 25px;
}
.cc-top img{
  width: 100%;
}

/*  ---   call-center-wrap  --  */
.call-center-wrap{
  padding-bottom: 0px!important;
}
.callcenter-wrap-bottom{
  padding-top: 10px!important;
}
.callcenter-outsourcing{
  margin-bottom: 14px;
}
h3.ecommerce{
  margin-bottom: 7px;
    font-size: 20px;
}
.ecommerce-bottom{
  padding: 30px;
}
.ecommerce-bottom p{
  font-size: 15px;
  text-align: justify;
  margin-bottom: 10px;
}
.crm-solution h3{
  margin-bottom: 10px;
}
.crm-solution p{
  margin-bottom: 15px;
}
.ecommerce-top{
  padding: 0px 0px!important;
}
.testimonials-grid.grid-4 li
{
  min-height: 350px !important;
}
.elastic-img{
  margin-top: 25%;
}
.elastic-ul p::before{
  content: '';
}
.elastic-ul p::after{
  content: '';
}
.elastic-ul p{
  line-height: 25px!important;
  margin-top: 5px;
}
h3.elastic-head{
  padding-top: 15px!important;
  margin-bottom: 10px!important;
}
.wrape-elastic{
  padding-top: 10px!important;
}
.testimonials-grid.grid-5 li{
  min-height: 315px !important;
}
address{
  margin-bottom: 15px !important;
}
.call p {
    margin-bottom: 5px;
}