/*
Template Name: Software Development
File: Layout CSS
Author: TemplatesOnWeb
Author URI: https://www.templateonweb.com/
Licence: <a href="https://www.templateonweb.com/license">Website Template Licence</a>
*/

/*********************center_home****************/
.center_h {
    background-image: url(../image/1.jpg);
    background-position: center center;
    background-size: cover;
}
.main_1{
  padding-top:170px;
   padding-bottom:80px;
 }
.center_h1_right{
  border:5px solid var(--bs-white);
 }
.date_box{
  top:30px;
  left:-50px;
 }

/*********************center_home_end****************/

/*********************about_h****************/
.user_box{
    border-top:5px solid var(--blue);
 }
.icon_1 {
  width:50px;
  height:50px;
  line-height:50px; 
  transition: 0.3s;
 }
.about_h1_left_inner_left ul li:hover .icon_1{
   background:var(--orange)!important;
   transition: 0.3s;
 }
.rotate{
  border:5px solid var(--bs-white);
  right:-20px;
 }
/*********************about_h_end****************/

/*********************spec****************/
 .spec_1_left {
   border-top:5px solid var(--orange);
    transition: 0.3s;
 }
 .spec_1_left:hover {
    background:var(--orange)!important;
    transition: 0.3s;
 }
.spec_1_left:hover span {
   color:var(--bs-white)!important;
    transition: 0.3s;
 }
.spec_1_left:hover h5 a {
   color:var(--bs-white);
    transition: 0.3s;
 }
/*********************spec_end****************/

/*********************serv_h****************/

.serv_h2_left2 span{
  width:80px;
  height:80px;
  line-height:78px;
  margin-top:-40px;
  transition: 0.3s;
 }
.serv_h2_left:hover .serv_h2_left2 span{
  transition: 0.3s;
   background:var(--orange)!important;
   color:var(--bs-white)!important;
   border:1px solid var(--orange);
 }
/*********************serv_h_end****************/

/*********************client****************/
.price_1_left .span_1{
  width:100px;
  height:100px;
  line-height:100px;
 }
.price_1_left:hover{
  transition: 0.3s;
  background:var(--orange)!important;
  color:var(--bs-white);
 }
.price_1_left:hover h1{
  color:var(--bs-white)!important;
 }
.price_1_left:hover .span_1{
  color:var(--bs-dark)!important;
  background:var(--bs-white)!important;
 }
.price_1_left:hover ul li i{
  color:var(--bs-white)!important;
 }
/*********************client_end****************/

/*********************expert****************/

#expert {
    background-image: url(../imgs/bg.png);
    background-position: center center;
    background-size: cover;
}

/*********************expert_end****************/


/*********************blog_h****************/
.blog_h1_left1{
  border-radius:0px 0px 5px 5px;
 }
 
/*********************blog_h_end****************/
@media screen and (max-width : 767px){
.main_1 {
   padding-top: 80px;
}
.center_h1_right{
  margin-top: 20px;
 }
.date_box {
    top:0;
    left:0;
}
.about_h1_left{
  margin-right:0!important; 
 }
.about_h1_left_inner_left ul{
  padding-top:30px!important;
  padding-bottom: 30px;
 }
.rotate {
    right:0;
}
.about_h1_right{
    margin-top: 20px;
 }
.spec_1_left{
   margin-top: 10px;
   margin-bottom: 10px;
 }
.client_1_right ul li{
   margin-top: 10px;
 }
.price_1_left{
   margin-top: 10px;
   margin-bottom: 10px;
 }
 }


@media (min-width:576px) and (max-width:767px) {

 }
 
@media (min-width:768px) and (max-width:991px) {
.date_box {
    top:0;
    left:0;
}
.about_h1_left_inner_left ul{
  padding-top:15px!important;
  padding-bottom: 15px;
 }
.rotate {
   position:static!important;
}
.spec_1_left{
   margin-top: 10px;
   margin-bottom: 10px;
 }
.spec_1_left h5{
  font-size:16px;
 }
.client_1_right ul li{
   margin-top: 10px;
 }
.client_1_right{
 padding:0!important;
 margin:0!important;
 }
#client{
  padding-top:50px;
  padding-bottom:50px;
 }
#client .p-0{
  padding-left:12px!important;
  padding-right:12px!important;
 }
 }

@media (min-width:992px) and (max-width:1200px) {
.date_box {
    top:0;
    left:0;
}
.about_h1_left_inner_right  .img-fluid{
  min-height:480px!important;
 }
.about_h1_left_inner_left ul{
  padding-top:15px!important;
  padding-bottom: 15px;
 }
.spec_1_left h5{
  font-size:16px;
 }
.client_1_right ul li{
   margin-top: 10px;
 }
.client_1_right{
 padding:0!important;
 margin:0!important;
 }
#client{
  padding-top:50px;
  padding-bottom:50px;
 }
#client .p-0{
  padding-left:12px!important;
  padding-right:12px!important;
 }
 }

@media (min-width:1201px) and (max-width:1250px) {

 }
@media screen and (min-width : 1400px){

 }
.cmci-logo{
    max-height: 100px;
    transform: skewX(10deg);
}
.video-boxcmci{
      width: 400px;  /* Change as needed */
      height: 250px; /* Change as needed */
      overflow: hidden;
      border: 2px solid #ccc;
      border-radius: 10px;
    }

    .video-boxcmci video {
      width: 100%;
      height: 100%;
      object-fit: cover; /* or "contain" if you want full video visible */
    }

.misvis{
        justify-content: center;
    margin-top: 50px;
}
.col-of-misvis{
    display: flex;
}
.misvis-cmci{
   background:  linear-gradient(#000000b0, #00000078),url(../imgs/mission.jpg);
    margin: auto;
    /*border: 1px solid #001588;*/
    padding: 70px 50px;
    border-radius: 5px;
    /* padding-bottom: 0; */
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
}
.cmci-nvision{
    background: linear-gradient(#000000b0, #00000078), url(../imgs/vision.jpg);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
}
.mis-vis{
    font-size: 35px;
    color: #fff;
}

@media (max-width:768px){
.newbox {
    height: auto;
}
 .button {
    padding: 10px;
 }
    
.newideatodesign{
   display: flex;
}
.newideatodesign li{
    width:33.3%;
    padding-top: 0 !important;
        margin-top: 0 !important;
        border: none;
        border-color: transparent ! IMPORTANT;
}    
.cmci-logo{
    max-height: 60px;
}    
 .col-of-misvis {
    display: block;
}   
.misvis-cmci {
    margin: 10px;
}
    
    
    
    
    
    
    
}