/* Show/hide carousel images for desktop and mobile */
.carousel-img-desktop { display: block !important; }
.carousel-img-mobile { display: none !important; }
@media (max-width: 767px) {
  .carousel-img-desktop { display: none !important; }
  .carousel-img-mobile { display: block !important; }
}
/*********************center_home****************/
.carousel-hero-title {
font-size: 60px;
line-height: 1em;
}
.carousel-caption{
text-align:left;
background: rgba(9, 63, 153, 0.55);
-webkit-backdrop-filter: blur(12px);
backdrop-filter: blur(12px);
padding:35px 30px;
right: 10%;
bottom: 6.25rem;
left: 10%;
width:50%;
border-radius: 16px;
border: 1px solid rgba(255, 255, 255, 0.12);
 }
.carousel-indicators{
bottom:45px; 
 }
/*********************center_home_end****************/


/*********************serv****************/
#serv {
background: #0c5adb;
}
.serv_m{
padding-top: 50px;
padding-bottom: 50px;
background: transparent;
 }
/*********************serv_end****************/

/*********************feature****************/
#feature{
background: #0c5adb;
padding-top:40px;
padding-bottom:40px; 
 }
.team_h_2m2{
background: rgba(255, 255, 255, 0.85);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
top:145px;
left:10%;
width:80%;
padding:20px 15px;
border-radius:12px;
border: 1px solid rgba(12, 90, 219, 0.08);
display:none;
 }
.team_h_2m:hover .team_h_2m2{
display:block;
 }
/*********************feature_end****************/

/*********************case****************/
#case{
padding-top:40px;
padding-bottom:40px; 
 }
.case_1i h5{
background:#0c5adb;
color:#fff;
width:60px;
height:60px;
line-height:50px; 
border-radius:50%;
border:3px solid #093f99;
font-weight:normal;
 }
.case_1i h5:hover{
background:#093f99;
border:3px solid #0c5adb;
 }
/*********************case_end****************/

/*********************join****************/
#join{
background: linear-gradient(135deg, #0c5adb 0%, #093f99 100%);
padding-top:50px;
padding-bottom:140px; 
 }
.join_1r span{
font-size:100px; 
 }

.client_1{
box-shadow: 0 8px 32px rgba(12, 90, 219, 0.1);
background: rgba(255, 255, 255, 0.75);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
padding-top:50px;
padding-bottom:50px;
border-radius:16px;
border: 1px solid rgba(12, 90, 219, 0.06);
 }
.join_m2{
bottom:-90px;
width:100%; 
 }
/*********************join_end****************/


/*********************quote****************/
#quote{
padding-top:40px;
padding-bottom:40px;
background: linear-gradient(135deg, #0c5adb 0%, #093f99 100%); 
 }
.quote_2l .form-control{
background: rgba(255, 255, 255, 0.08);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
height:50px;
font-size:18px;
color:#eee; 
border-color: rgba(65, 95, 143, 0.5);
border-radius: 10px;
transition: border-color 0.3s ease, background 0.3s ease;
 }
.quote_2l .form-control:focus {
background: rgba(255, 255, 255, 0.15);
border-color: rgba(12, 90, 219, 0.5);
box-shadow: 0 0 0 3px rgba(12, 90, 219, 0.1);
 }
.quote_2l ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #999;
  opacity: 1; /* Firefox */
}
/*********************quote_end****************/


@media screen and (max-width : 767px){
.case_1i{
margin-bottom:10px; 
 }
.join_m2{
position:static!important; 
 }
#join {
padding-top:50px;
padding-bottom:40px;
}
.client_1i{
background: rgba(248, 250, 255, 0.9);
padding:20px;
margin-bottom:10px;
border-radius: 12px;
 }
.client_1 {
padding-top: 30px;
padding-bottom: 30px;
border-radius: 12px;
}
.carousel-caption {
width: 85%;
left: 7.5%;
right: 7.5%;
bottom: 1.5rem;
padding: 16px 16px;
border-radius: 12px;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
text-align: center;
}
.carousel-caption h1,
.carousel-hero-title {
font-size: 20px !important;
line-height: 1.3em !important;
margin-bottom: 0;
}
.carousel-caption h4 {
font-size: 14px;
margin-bottom: 8px !important;
}
.carousel-caption p {
font-size: 13px;
}
.carousel-caption .button,
.carousel-caption .button_1 {
padding: 8px 18px;
font-size: 13px;
}
.carousel-caption ul li {
margin-right: 8px !important;
}
.carousel-indicators {
bottom: 5px;
}
.center_home img,
.carousel-item img {
width: 100%;
height: 55vh;
max-height: 500px;
object-fit: cover;
object-position: center;
}

@media (min-width: 600px) {
  .center_home img,
  .carousel-item img {
    width: 100%;
    height: 45vh;
    max-height: 350px;
    object-fit: cover;
    object-position: center;
  }
}

/* Mobile: let the default or mobile-specific media queries apply */
.join_1r span {
font-size: 60px;
}
#quote {
padding-top: 30px;
padding-bottom: 30px;
}
.quote_2l .form-control {
height: 45px;
font-size: 16px;
margin-top: 10px;
}
.serv_m {
padding-top: 30px;
padding-bottom: 30px;
}
#feature {
padding-top: 30px;
padding-bottom: 30px;
}
.team_h_2m2 {
width: 90%;
left: 5%;
top: auto;
bottom: 10px;
border-radius: 10px;
}
 }
@media (min-width:768px) and (max-width:991px) {
.center_home img{
width: 100%;
height: auto;
 }
.carousel-caption h1{
font-size:40px!important; 
 }
.carousel-caption{
width:60%;
padding: 25px 22px;
 }
.team_h_2m1 img{
width: 100%;
height: auto; 
 }
.client_1 {
padding-top: 35px;
padding-bottom: 35px;
}
.join_1r span {
font-size: 70px;
}
 }
@media (min-width:992px) and (max-width:1200px) {
.center_home img{
width: 100%;
height: auto;
 }
.carousel-caption h1{
font-size:40px!important; 
 }
 }

/* Extra small phones */
@media screen and (max-width: 400px) {
.carousel-caption {
bottom: 1rem;
padding: 12px 12px;
border-radius: 10px;
}
.carousel-caption h1,
.carousel-hero-title {
font-size: 17px !important;
line-height: 1.3em !important;
}
.carousel-caption .button,
.carousel-caption .button_1 {
padding: 6px 14px;
font-size: 12px;
}
.center_home img,
.carousel-item img {
height: 70vh;
object-fit: cover;
object-position: center;
}
}
