@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,200;9..40,400&family=Rethink+Sans:wght@400;700&family=Roboto:ital,wght@0,100;0,300;0,400;0,700;1,500&display=swap');


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.no-select {
    -webkit-user-select: none;  / Chrome, Safari /
    -moz-user-select: none;     / Firefox /
    -ms-user-select: none;      / Internet Explorer/Edge /
    user-select: none;          / Non-prefixed version, currently supported by most browsers /
}
.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}
ul {
    margin: 0;
    padding: 0;
}
.serr{
    padding-top: 70px;
    padding-bottom: 70px;
}
h1{
    font-size: 40px; 
    line-height: 50px; 
    font-weight: 700; 
    font-family: 'Roboto', sans-serif; 
}
p{
    font-size: 17px; 
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
h2{ 
    font-weight: 700; 
    font-family: 'Roboto', sans-serif;  
}
 
img{
    border-radius: 15px;
}

small {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
 
.bannertext h1 {
    color: #fff; 
}
.bannertext p{
     color: #ffffff;  
}
.bannertext ul li{
    font-size: 16px; color: #ffffff; list-style-type: none;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.content h1{ 
        color: #242729;
         
}
.indus h1{
    color: #ffffff; 
    line-height: 50px; 
}
.indus2 h6{
    color: #ffffff;
        font-size: 18px;  
        font-weight: 400;
        font-family: 'Roboto', sans-serif; 
}

.dev{
    margin-bottom: 20px;
 }
.dev h1{ 
    color: #242729; 
    line-height: 50px;  
    padding: 15px 0;
}
.dev p{
     color: #242729;  
}
.devii h1{
    color: #242729; 
}
.devii p{
   color: #242729;  
}
.caption h3{
      color: #ffffff; font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.caption p{
    color: #ffffff; 
}
header {
    position: sticky;
    top: 0;
    z-index: 1;
    width: 100%;
    /* margin-bottom: 60px; */
    float: left;
    max-width: 1600px;
}
.devv h4{
    color: #242729;  
    font-family: 'Roboto', sans-serif;
}
.devv p{
    font-size: 16px;  color: #242729; font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.yearRow strong {
    font: 3.2rem/4.2rem robotomedium, sans-serif;
    color: #216fb3;
}

.yearRow span {
    font-size: 18px;
    color: #cecece;
} 
.wrapper{
    background: url(../img/bg.png);
    background-repeat: no-repeat; 
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%; 
}
.fourthh {
    background: #204279;
}
.col_box {
    background: #204279;
    padding: 40px 40px;
    border-radius: 10px;
    color: #fff;
    text-align: center;
}
 
.list2 {
    border: 1px solid #204279;
    height: 180px;
    padding: 16px 25px;
    margin: 10px;
    border-radius: 20% 7%;
    background: #fff;
    box-shadow: -4px 0px 20px 0px rgb(0 0 0 / 30%); 
}
.react {
    font-size: 17px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.sec-tag-lines span {
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    font-style: italic;
    font-size: 17px;
    line-height: 64.8px;
    text-align: left;
    position: relative;
    color: #000;
    padding-left: 60px;
}
.sec-tag-lines span::before {
    content: "";
    height: 2px;
    width: 40px;
    position: absolute;
    left: 0;
    background-color: #216fb3;
    top: 9px;
}
.sec-description .sec-desc-title {
    margin: 18px 0;
    position: relative;
}
.sec-description .sec-desc-title::before {
    content: "";
    background-color: #216fb3;
    width: 51px;
    height: 51px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 0px;
}
.sec-description .sec-desc-title h3 {
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    width: auto;
    font-size: 20px;
    line-height: 52px;
    text-align: left;
    color: #001033;
    margin-right: 30px;
    margin-left: 26px;
    background-color: #fff;
    position: relative;
    padding-left: 15px;
}
.emc-dlm .emc-dlm-box {
    border-left: 0px;
    padding-left: 0px;
    height: inherit;
    padding: 30px !important;
    border-radius: 10px;
    background-color: #fff;
    height: 100%;
}
.emc-dlm .emc-dlm-box-icon {
    width: 80px;
    height: 80px;
    border-radius: 50px;
    background-color: #216fb3;
}
.emc-dlm .emc-dlm-box-icon img {
    padding: 15px;
    filter: invert(1);
}
.node:hover{
    background-image: linear-gradient(180deg,#fff,#cef4fb); 
}
.node{
    border: 1px solid gray;
    padding: 30px;
    height: 100%;
}
.node img{
    width: 100%;
    max-width: 70px;
}
.magento2 {
    padding: 20px 20px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    border-radius: 40px 10px;
    border: 1px solid #216fb3;
    height: 100%;
    margin-bottom: 20px;
}
.laravel2 {
    padding: 20px 20px;
    border-radius: 10px;
    border: 2px solid #216fb3;
    height: 100%;
}
.laravel3 {
    padding: 20px 20px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    height: 100%;
}
.laravel3 i {
    font-size: 60px;
    color: #216fb3;
}
.expertise-box {
    margin-left: 20px;
    border-bottom: 2px solid #b3b3b3;
    height: calc(100% - 24px);
    padding: 30px 30px;
}

.card-body2 img {
    height: 140px;
    border-radius: 50%;
}
.acc {
    margin-bottom: 1.5rem;
}
.card-body img {
    width: 75px;
    height: 75px;
    border-radius: 50%;
}
.design {
    border: 1px dashed #204279;
    padding: 20px;
    height: 100%;
}
.web-application-block-inner {
    background: #f7fcfd;
    padding: 30px 30px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    margin-bottom: 20px;
    height: 100%;
}
.first {
    padding-bottom: 60px;
    padding-top: 40px;
}

.hireform {
    width: 100%;
    background: #fff;
    float: right;
    border-radius: 10px;
    text-align: center;
    overflow: hidden;
}

.hireform .formHeading {
    padding: 20px 0 10px;
    text-align: center;
    background: #216fb3;
    color: white;
}

.hireform form {
    padding: 20px 30px;
}

.hireform form input,
.hireform form textarea {
    padding: 0 0 0 1rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    color: #000000;
    border: none;
    background: 0 0;
    width: 100%;
}

.hireform form input {
    height: 50px;
    border-bottom: 1px solid #333;
}

.hireform form input {
    height: 50px;
    margin: 0 0 8px;
    border-bottom: 1px solid #333;
    font-size: 16px;
}

.hireform form textarea {
    font-size: 16px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    border-bottom: 1px solid #333;
    margin-top: 15px;
}

.hireform .attact-file .dz-message .dz-button {
    color: #333;
    margin: 10px 0 30px;
    height: 35px;
    padding: 0 10px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    background: 0 0;
    border: 1px dotted #333;
    border-radius: 0;
    width: inherit;
}

.hireform form button {
    border: none;
    display: inline-block;
    height: 50px;
    border-radius: 5px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    padding: 10px 20px;
    color: #fff;
    background: #216fb3;
    margin-top: 20px;
}

.hireform .attact-file .dz-message .dz-button {
    color: #1e1e1e;
    margin: 10px 0 30px;
    height: 35px;
    padding: 0 10px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    background: 0 0;
    border: 1px dotted #333;
    border-radius: 0;
    width: inherit;
}

.hireform form button:hover {
    background: #216fb3;
    color: #fff;
    cursor: pointer;
}

/* .banner {
    width: 100%;
    height: 140px;
    display: block;
    margin: 6rem auto 0;
    background: url(../images/home-certificate.png) center no-repeat #15132b;
} */
 
.second{
    background: #f6faf6;
    border-top: 1px solid #d9d9d9;
      padding-top: 70px;
    padding-bottom: 70px; 
    border-bottom: 1px solid #d9d9d9;
}
 
.star{
    color: #e6fe0a;
}
.second h1{
    color: #242729;
   
}
.laravel p{
    font-size: 16px; color: #242729; font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.custom-listing{
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.laravel h3 {
    font-weight: 700;
    font-family: 'Roboto', sans-serif; 
    font-size: 23px;
    margin-bottom: 18px;
}
.laravel{ 
    padding:10px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    height: 100%; 
}

.btnnn button {
    background: #216fb3;
    padding: 15px;
    font-size: 20px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    border: none;
    border-radius: 7px;
    color: #fff;
}
.btnnn2 button {
    background: #216fb3;
    padding: 15px;
    font-size: 20px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    border: none;
    border-radius: 7px;
    color: #fff;
}

.card {
    border: none;
}

.devv img {
    width: 100%;
    max-width: 180px;
}

.first_sec {
    width: 100%;
    max-width: 360px;
    text-align: center;
    margin: 0 auto;
}

.first_sec img {
    width: 100%;
    max-width: 60px;
}
.slide_section {
    font-size: 30px;
    font-weight: normal;
    text-transform: uppercase;
    color: #187ac3;
}
.accordion {
    display: flex;
    flex-direction: column;
    font-weight: 400;
    font-family: 'Roboto', sans-serif; 
    margin: 5px auto; 
}

.accordion h1 {
    text-align: center; 
    color: #242729;
}

.accordion-item {
    margin-top: 16px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    border: 1px solid #fcfcfc;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.accordion-item .accordion-item-title {
    position: relative;
    margin: 0;
    display: flex;
    width: 100%;
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    cursor: pointer;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding: 14px 20px;
    box-sizing: border-box;
    align-items: center;
    background: #ededed;
}

.accordion-item .accordion-item-desc {
    display: none;
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    color: #242729;
    border-top: 1px dashed #ddd;
    padding: 10px 20px 20px;
    box-sizing: border-box;
}

.accordion-item input[type="checkbox"] {
    position: absolute;
    height: 0;
    width: 0;
    opacity: 0;
}

.accordion-item input[type="checkbox"]:checked~.accordion-item-desc {
    display: block;
}

.accordion-item input[type="checkbox"]:checked~.accordion-item-title .icon:after {
    content: "-";
    font-size: 20px;
}

.accordion-item input[type="checkbox"]~.accordion-item-title .icon:after {
    content: "+";
    font-size: 20px;
}

.accordion-item:first-child {
    margin-top: 0;
}

.accordion-item .icon {
    margin-left: 14px;
}

.accordion-item2 {
    margin-top: 16px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    border: 1px solid #fcfcfc;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.accordion-item2 .accordion-item2-title {
    padding: 0 5px;
    position: relative;
    margin: 0;
    display: flex;
    width: 100%;
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    cursor: pointer;
    justify-content: space-between;
    flex-direction: row-reverse; 
    box-sizing: border-box;
    align-items: center; 
    padding-top: 10px;
}

.accordion-item2 .accordion-item2-desc {
    display: none;
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    color: #242729;
    border-top: 1px dashed #ddd;
    padding: 10px 20px 20px;
    box-sizing: border-box;
}

.accordion-item2 input[type="checkbox"] {
    position: absolute;
    height: 0;
    width: 0;
    opacity: 0;
}

.accordion-item2 input[type="checkbox"]:checked~.accordion-item2-desc {
    display: block;
}

.accordion-item2 input[type="checkbox"]:checked~.accordion-item2-title .icon:after {
    content: "-";
    font-size: 20px;
    color: #0a56a5;
}

.accordion-item2 input[type="checkbox"]~.accordion-item2-title .icon:after {
    content: "+";
    font-size: 20px;
    color: #0a56a5;
}

.accordion-item2:first-child {
    margin-top: 0;
}

.accordion-item2 .icon {
    margin-left: 14px;
}

.fromsec {
    background: rgb(55, 76, 124); 
    padding: 30px;
}

.fromsec .headingRow h2 {
    color: #fff;
    margin: 0 0 1rem;
}

.fromsec .numberRow ul,
.fromsec form {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.fromsec .autocomplete,
.fromsec .inpBox {
    flex: 0 0 47%;
    position: relative;
    margin: 0 0 1.5rem;
}

.fromsec form input {
    height: 60px;
    border: none;
    border-bottom: 2px solid #fff;
}

.fromsec form input {
    height: 60px;
    border: none;
    border-bottom: 2px solid #fff;
}

.fromsec form ::placeholder {
    color: #fff;
    opacity: 1;
    /* Firefox */
}

.fromsec form ::-ms-input-placeholder {
    /* Edge 12-18 */
    color: #fff;
}

.fromsec form input {
    width: 100%;
    padding: 1rem 0;
    color: #fff;
    background: 0 0;
}

.fromsec .textArea {
    flex: 0 0 100%;
    position: relative;
    margin: 0 0 2rem;
}

.textArea textarea {
    width: 100%;
    background: none;
    border: none !important;
    border-bottom: 2px solid rgb(255, 255, 255) !important;
    color: white;
}



.bottom {
    background: #2c4b7d;
    padding: 10px 20px;
    border-radius: 15px;
    box-shadow: 0px 13px 13px #204279;
    margin: 10px 20px;
}

.left-box {
    padding-top: 30px;
    padding-bottom: 30px;
}

.laravel i { 
    font-size: 50px;
    color: #216fb3;
}

textarea:focus,
input:focus {
    outline: none;
}
 
.devv {
    padding: 20px 20px;
    background: #fff;
    box-shadow: -6px 0px 28px 0px rgb(0 0 0 / 38%);
    border-radius: 10px;
    text-align: center;
    height: 100%;
}

.web {
    box-shadow: 0 0 4px #204279;
    padding: 20px 20px;
    border-radius: 10px;
    text-align: center;
  height: 100%;
}

.indus {
    background: #204279;
    color: white;
    padding-top: 70px;
    padding-bottom: 70px;
}

.indus2 a {
    text-decoration: none;
    display: block;
    color: white;
}
.rect-home-services-sec {
    padding: 60px 0;
    background: url(../images/banner2.png);
    background-position: center center !important;
    background-size: cover;
    background-repeat: no-repeat;
    background-blend-mode: overlay;
    background-color: #1b1d1e !important;
    width: 100%;
}
.fourth {
    background: #204279;
    color: white;
}
.php_box {
    background: #fff;
    padding: 58px 40px;
    border-radius: 10px; 
    box-shadow: 1px 0 25px #ccc;
}
.php_box .iconnn, .php_d_bx .iconnn {
    float: left;
    width: 10%;
}
.php_bb {
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 10px;
}
.php img{
    max-width: 90%;
}
.php_box2{
    background: #ffffff;
    padding: 20px 20px;
    border-radius: 10px; 
    box-shadow: -6px 0px 28px 0px rgb(0 0 0 / 10%);
    text-align: center;
}
.php_box3 {
    background: #fff;
    padding: 20px 20px;
    border-radius: 10px;
    text-align: center;
    border-top: 7px solid #204279;
    height: 100%;
}
.react-2 {
    border-top: 5px solid #204279;
}
.php_box2 i{
    font-size: 32px;
    color: #204279; 
}
.php_box p  {
    font-size: 16px;
    line-height: 24px;
    color: #242729;  
    float: left;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    width: 90%;
}

.feature-left .service-item {
    z-index: 1;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    position: relative;
    padding: 30px 20px;
    border-radius: 7px;
    margin-bottom: 30px;
    background-color: #eaebec;
}
.feature-right .service-item {
    z-index: 1;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    position: relative;
    padding: 30px 20px;
    border-radius: 7px;
    margin-bottom: 30px;
    background-color: #eaebec;
}
.serrr .work-process-list>ul:not(:last-child) {
    border-bottom: 2px dashed #bfbfbf;
    margin: 0 auto;
}
.serrr  .work-process-list>ul>li:not(:last-child) {
    border-right: 2px dashed #bfbfbf;
}
.serrr .work-process-list>ul>li {
    padding: 40px;
}
.work-process-item {
    display: flex;
}
.work-process-item__icon {
    width: 126px;
    flex-shrink: 0;
}
.work-process-item__icon .icon-box {
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center; 
    align-items: center;
    border-radius: 100%;
    background: #fff;
    box-shadow: 0 1px 5px 2px rgba(0,0,0,.1);
}
.work-process-item__icon .icon-box svg {
    display: block;
}
 svg {
    vertical-align: middle;
}
.work-process-item__content {
    width: 100%;
    padding-left: 40px;
    font-size: 18px;
    line-height: 1.6;
}
.work-process-item__content .h6 {
    padding-bottom: 20px;
    font-size: 22px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
}
.work-process-item__icon .icon-box svg path {
    fill: #204279;
}
ul li{
    list-style-type: none;
}
.form-wrap {
    padding: 20px;
}
.top-sec {
    padding: 30px 20px;
    border: 1px solid #ffb81d;
    border-radius: 20px;
    position: relative;
}
.top-sec h3{
    font-weight: 700;
}
.bottom-sec h3{
    font-weight: 700;
    font-size: 18px;
    padding-top: 10px;
}
.bottom-sec p{
    font-size: 14px;
}
.btn-center {
    margin-top: 27px;
    margin-bottom: 18px;
}
.form-wrap   .yellow-btn { 
    padding: 14px 50px;
     background: #216fb3;
    padding: 15px;
    font-size: 20px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    border: none;
    border-radius: 7px;
    color: #fff;
 text-decoration: none;
 text-transform: capitalize;
}
.use-form{
    text-decoration: none;
    font-size: 14px;
    padding: 20px;
    color: #1e1e1e;
    font-weight: 700;
}
.frm-list{
    display: flex; 
    justify-content: center;
    align-items: center;
    gap: 1rem;
    color: #fff;
}



/* pop up */ 
.form-section {
    flex-basis: 38%;
    background: #f8f8f8;
    padding: 20px 30px;
    border-radius: 20px;
    border: 1px solid #000;
}
.form-section form {
    padding: 0;
}
 
.form-section .form-text-cont {
    border: 0;
    padding: 0;
    flex-basis: 100%;
    margin: 20px 0 0;
}
.user-input {
    position: relative;
}
.form-section .form-text-cont .input-field {
    border: 0;
    border-bottom: 1px solid #d3cdcd;
    padding: 0;
    height: 40px;
    background: 0 0;
    width: 100%;
    font-size: 15px;
    line-height: 24px;
    outline: 0;
    color: #1d1d1d;
    opacity: 1;
}


.overlay-container { 
    display: none; 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%;  
    justify-content: center; 
    align-items: center; 
    opacity: 0; 
    transition: opacity 0.3s ease; 
    z-index: 1000;
} 

.popup-box { 
    background: #fff; 
    padding: 50px 50px; 
    border-radius: 12px; 
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);   
    opacity: 0; 
    transform: scale(0.8); 
    animation: fadeInUp 0.5s ease-out forwards; 
    border: 3px solid #216fb3;
} 
 
.submit{
    padding: 12px;
    background: #216fb3;
   padding: 15px;
   font-size: 16px;
   font-weight: 400;
   font-family: 'Roboto', sans-serif;
   border: none;
   border-radius: 7px;
   color: #fff;
text-decoration: none; 
margin: 20px 0;
}
.form-content h3{
    font-size:18px;
}
.form-content ul{
    padding: 0;
}
.form-container { 
    display: flex; 
    flex-direction: column; 
} 

.form-label { 
    margin-bottom: 10px; 
    font-size: 16px; 
    color: #444; 
    text-align: left; 
} 

.form-input { 
    padding: 10px; 
    margin-bottom: 20px; 
    border: 1px solid #ccc; 
    border-radius: 8px; 
    font-size: 16px; 
    width: 100%; 
    box-sizing: border-box; 
} 
.btn-close-popup{
    float: right;
    color: #216fb3;
    background:none;
    font-size: 25px;
    font-weight: 700;
    padding: 0 20px;
    border: none;
}
.clrtext {
    display: inline-block;
    color: #216fb3;
    padding: 0 8px; 
    position: relative;
}
.navbtnn{
    background-color: rgba(12, 113, 195, 0.24);
    padding: 10px 12px;
    border-radius: 7px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.navbtnn1{
    background-color: #216fb3;
    padding: 10px 12px;
    border-radius: 7px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    width: 120px;
    margin-left: 10px;
    text-align: center;
}
.navbtnn1:hover{
    background-color: #216fb3;
    padding: 10px 12px;
    border-radius: 7px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    width: 120px;
    margin-left: 10px;
    text-align: center;
}
.navbtnn2{
    background-color: rgba(224, 153, 0, 0.23);
    padding: 10px 12px;
    border-radius: 7px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.navbtnn4{
    background-color: rgba(250, 94, 93, 0.3);
    padding: 10px 12px;
    border-radius: 7px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.iconnn2 {
    margin-top: -3px !important;

}
.navbtnn3{
    background-color: #216fb3;
    padding: 10px 12px;
    border-radius: 7px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif; 
    margin-left: 10px; 
  width: 160px;
}
.navbtnn3:hover{
    background-color: #216fb3;
    padding: 10px 12px;
    border-radius: 7px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif; 
    margin-left: 10px;
  width: 160px;
}
 
/* Keyframes for fadeInUp animation */ 
@keyframes fadeInUp { 
    from { 
        opacity: 0; 
        transform: translateY(20px); 
    } 

    to { 
        opacity: 1; 
        transform: translateY(0); 
    } 
} 

/* Animation for popup */ 
.overlay-container.show { 
    display: flex; 
    opacity: 1; 
} 

.wrapper2_1{
    background: url(../images/bh2.jpg) no-repeat;
    background-size: cover;
    padding: 150px 150px;
}
.work-block-title .user {
    font-size: 4rem;
    font-family: "cera_probold";
    color: #d3d4d9;
    line-height: 3.5rem; 
}
.work-block-title {
    font-weight: 700; 
    margin-bottom: 20px;
}
.work-block-title h3.h5 {
    color: #222a41; 
    line-height: 1.728rem;
    font-weight: 700;
}
.work-proc-block:hover .user, .work-proc-block:hover h5 {
    color: #216fb3;
}
.card{
    background: #fff;
    padding: 10px 20px;
    border-radius: 15px;
    box-shadow: 0px 0px 13px #ccc;
    margin: 10px 20px;
}
 
.card h4{
    font-weight: 700;
    font-family: 'Roboto', sans-serif; 
    font-size: 23px; 
    padding: 10px;
}
.content{
    padding-top: 4rem;
    padding-bottom: 5rem;
    margin-top: 2rem;
}
 
 .php_box3{
    background: #ffffff;
    padding: 20px 20px;
    border-radius: 10px;
    box-shadow: -6px 0px 28px 0px rgb(0 0 0 / 10%); 
 }
 .btnnn{
    text-align: center;
 }
 .diff img{
    width: 50px;
    height: 50px;
    text-align: center; 
 }
 .diff h2{
    padding-top: 10px;
 }
 .cus-serve img{
    max-width: 70px;
}
.cus-serve{
    background: #fff;
    padding: 20px 20px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    text-align: center;
    height: 100%;
}
.cus-serve h4{
    font-size: 20px;
    padding-top: 12px;
    font-weight: 600;
}
.checked {
    color: orange;
    font-size: 12px;
  }
  .list4 {
    height: 140px;
}
.list{
    padding: 20px 20px;
    background: #fff;
    box-shadow: -2px 0px 10px 0px rgb(0 0 0 / 38%);
    margin-bottom: 12px;
    height: 100%;
}
.ang2 img{
    height: 820px;
}
.ang3 img{
    height: 440px;
}
.opp img {
    height: 700px;
}
.phpp img{
    height:700px;
}
.mac img {
    height: 1050px;
}
.magen2 img {
    height: 630px;
}
.nod img {
    height: 720px;
}
.sec3 img {
    height: 700px;
}
.integ {
    font-size: 3rem;
    color: #204279;
}
.rails img {
    height: 260px;
}
.webbb img {
    height: 700px;
}
.wrapper2 {
    background: url(../images/bg.png) no-repeat;
    background-size: cover;
    padding: 100px 100px;
}
.serrr {
    padding-top: 70px;
    padding-bottom: 70px;
}
.iconn i {
    font-size: 60px;
    color: #216fb3;
}
.iconn {
    padding: 20px 20px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    height: 100%;
}
.laravel-sec{
    padding: 0 20px;
}
/* Responsive */
@media (min-width: 576px) {

    .container,
    .container-sm {
        max-width: 540px;
    }
}
@media screen and (max-width: 576px) {
    .carousel-item .card-wrapper {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
  }
@media (min-width: 768px) {

    .container,
    .container-sm,
    .container-md {
        max-width: 720px;
    }
}

@media (min-width: 992px) {

    .container,
    .container-sm,
    .container-md,
    .container-lg {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {

    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl {
        max-width: 1190px;
    }
}

@media (max-width: 1600px) {
    .hireform .attact-file .dz-message .dz-button {
        margin: 10px 0 15px;
    }
}
/* @media (min-width: 850px) {
    .wrapper2 {
       display: none;
    }
} */

@media screen and (max-width: 767px) {
    .imh{
        position: absolute; 
        right: 84% !important; 
        background: white;
        padding: 7px;
        font-size: 38px;
        border: 2px solid #0a56a5; 
        border-radius: 10px;
    }
    .imh2{
        position: absolute; 
        right: 3% !important;
        background: white;
        padding: 7px;
        font-size: 38px;
        border: 2px solid #0a56a5; 
        border-radius: 10px;
    }
    .features-block2 { 
        border-left: none !important;
        border-bottom:2px solid #e7e7e7 !important;
    }
    .prob2 img{
        height: auto !important;
    }
    .features-block { 
    border-left:none !important; 
    }
    .tourbook img{
        height: auto !important;
    }
    .first {
        padding-bottom: 25px;
        padding-top: 25px;
    }
    .bottom {
        margin: 0;
    }
    .laravel-sec{
        padding: 0 10px;
    }
    .first_sec {
        width: 100%;
        max-width: 100%;
    }
    .wrapper2_1 {
        padding: 45px 40px;
        background-size: initial;
    }
    .wrapper2_1 h3 p {
        text-align: center;
    }
    .accordion {
        padding: 0 16px;
    }

    .accordion h1 {
        font-size: 22px;
    }
    .accordion {
        padding: 0 16px;
    }

    .accordion h1 {
        font-size: 30px;
    }
    .serr h1 {
        font-size: 30px;
        line-height: 32px;
        padding-bottom: 15px;
    }
  
    .bannertext h1{
        font-size: 30px;
        line-height: 32px;
    }
    .services_bar img{
        max-width: 120px;
    }
    .list2 {
        height: auto;
    }
    .serrr {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .serr{
        padding-top: 2rem;
    padding-bottom: 2rem;
    text-align: center;
    } 
    .sec-description .sec-desc-title h3 {
        line-height: 32px;
    }
    p{
        font-size: 14px;
    }
    h1,h2{
        font-size:26px;
        line-height: 32px;
    }
    .wrapper4 {
            background-position: left;
    }
    .indus { 
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .dev h1 {
        font-size: 26px;
        line-height: 30px;
    }
    .indus h1 {
        line-height: 30px;
    }
    .dev{
        margin: 0;
        padding: 0;
    }
    .magento ul{
        text-align: start;
    }
    .magento li{
      padding-bottom: 10px;
      padding-top: 10px;
    }
    .second{
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
    .sec2{
        display: flex;
        flex-direction: column-reverse;
    }
    .accordion-item .accordion-item-title {
        font-size: 15px;
        text-align: start;
    }
    .accordion-item .accordion-item-desc {
        font-size: 15px;
        text-align: start;
    } 
    .wrapper2 {
        padding: 60px 30px;
        text-align: center;
        background-position: left;
    }
    .serrr .work-process-list>ul>li {
        padding: 20px;
    }
    .serrr .work-process-list>ul>li:not(:last-child) {
        border-right: none;
    } 
    .serrr .work-process-list>ul:not(:last-child) {
        border-bottom:none; 
    }
    .work-process-item__content .h6 {
        padding-bottom: 0;
    }
    .work-process-item__content {
       padding-left: 0;
    }
    .fromsec form input {
        font-size: 12px;
      } 
      .fromsec form ::placeholder {
          font-size: 12px;
      }
      .form_mobile{
        display: none;
       }
       .overlay-container { 
        height: auto;
       }
       .popup-box {
        padding: 15px 15px;
        }
        .popup-box2 {
            padding: 20px 20px !important;
            width: 300px !important;
       }
       .user-input2 .submit2 {
        padding: 15px 40px !important;
       }
        .form-section {
            padding: 0px 12px;
          }
          .submit {
            padding: 13px;
            font-size: 14px;
            margin: 10px 0;
          }
          .fromsec {
            padding: 10px;
          }
          .btnnn button {
            font-size: 18px;
          }
          .ang2 img{
            height: auto;
        }
        .ang3 img{
            height: auto;
        }
        .opp img {
            height: auto;
        }
        .phpp img{
            height: auto;
        }
        .mac img {
            height: auto;
        }
        .magen2 img {
            height: auto;
        }
        .nod img {
            height: auto;
        }
        .sec3 img {
            height: auto;
        }
        .list4 {
            height: auto;
            margin-bottom: 20px;
        }
        .rails img {
            height: auto;
        }
        .webbb img {
            height: auto;
        }
        .acc {
            margin-bottom: 0;
        }
        .navbtnn3{
            max-width: 170px;
        }
        
       .navbar-nav {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); /* Responsive two items per row */
        gap: 0; 
        list-style: none;
        padding: 0;
        margin: 0;
      }
      
      .nav-item {
        text-align: center;
      }
     
      .nav-link {
        margin-top: 10px;
        text-decoration: none;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px;
        border: 1px solid #216fb3;/* Optional border for clarity */
        border-radius: 7px;
        transition: background-color 0.3s;
      }
      
      .nav-link:hover {
        background-color: #216fb3;
      }
      
      .nav-link i {
        margin-right: 8px;
      }
      
      .navbtnn3 {
        background-color: #216fb3; /* Example button background */
        color: #fff;
        border: none;
      }
      
      .navbtnn3:hover {
        background-color: #218838; /* Button hover effect */
      }
        .taxi-main {
            margin: 0 45px;
            display: grid;
            grid-template-columns: initial !important;
            gap:0rem !important;
        }
        .equal-spacing { 
            margin-top: 0px !important;
            margin-top: 30px !important;
          }
          .laravel2_1 h1 {
            font-size: 35px !important; 
        }
        .laravel2_1 p {
            font-size: 12px !important; 
        }
        .thank1 h1 {
            font-size: 3.5em !important;
            letter-spacing: 0px !important;
            margin-bottom: 20px !important;
        }
        .navbtn5 {
            margin-left: 0px !important;
        }
        .feature-right2 h4 {
            text-align: start !important;
        }
        .feature-right2 p {
            text-align: start !important;
        }
        .free{
            margin-top: 10px !important;
        }
        .pm-service__picture{
            margin: 0 !important;
            width: 100% !important;
            min-width: 100% !important;
            max-width: 100% !important;
           margin-bottom: 20px !important;
        }
        .pm-service__picture2{
            margin: 0 !important;
            width: 100% !important;
            min-width: 100% !important;
            max-width: 100% !important;
            margin-bottom: 20px !important;
            position: initial !important;
            background-color: #fff !important;
            
        }
        .pm-service__picture2 img{
            border-radius: 16px !important;
            background-color: #e0e4f2 !important;
            box-sizing: border-box !important;
            padding: 8px !important;
        }
        .pm-service {
            padding: 30px !important;
            display: flex !important;
    flex-direction: column !important;
        }
        .pm-service__picture-inside img{
            height: auto !important;
        }
        .admin-img img{
            width: 100% !important;
            max-width:100% !important;
            height: auto !important;
            padding-bottom: 20px;
        }
        
        .real_box img{
            max-width:100% !important;
        }
        .urban_ds{
            padding-top: 0 !important;
        }
        .prob{
            height: auto !important;
        }
        

}



/* Responsive */
 

/* Readysoftware page */
.free{
    margin-top: 3rem;
}
.user-input2 {
 text-align: center !important;
}
.popup-box2 { 
    width: 373px;
    margin: auto;
    background: #fff; 
    padding: 40px 40px; 
    border-radius: 12px; 
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);   
    opacity: 0; 
    transform: scale(0.8); 
    animation: fadeInUp 0.5s ease-out forwards; 
}
.submit2{
    padding: 15px 119px !important;
    background: #216fb3;
   padding: 15px;
   font-size: 16px;
   font-weight: 400;
   font-family: 'Roboto', sans-serif;
   border: none;
   border-radius: 7px;
   color: #fff;
text-decoration: none;  
text-align: center;
}
.form-section2 .form-text-cont .input-field {
    border: 0;
    border: 2px solid #d3cdcd;
   padding-left: 10px;
    height: 40px;
    background: 0 0;
    width: 100%;
    font-size: 15px;
    line-height: 24px;
    outline: 0;
    color: #1d1d1d;
    opacity: 1;
    margin-bottom: 20px;
}
.imggbox {
    text-align: center;
}
.imggbox img{
    height: 100px;
    width: auto;
    margin-bottom: 20px;
    border-radius: 60px;
    background: #e9f5ff;
    padding: 20px;
}
.viewbtn{ 
    font-size: 18px; 
    text-align: center;
    display: block; 
    text-decoration: none; 
    border-radius: 15px;
    color: #333;  
}
 
.overlay-container1.show { 
    display: flex; 
    opacity: 1; 
} 
.overlay-container1 { 
    position: fixed; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
  background: rgba(0, 0, 0, 0.5); 
  display: none; /* Initially hidden */
  justify-content: center; 
  align-items: center; 
  z-index: 1000; 
} 
.taxi-main {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)); 
    padding-top: 20px;  
    gap:2rem;
}
.taxi-contain {
    padding-right: 20px;
}
.taxi-wrap {
    position: relative;
    width: 100%;
    float: left;
    margin: 10px 0;
}
.number {
    color: #d5d4d4;
    position: absolute;
    font-size: 75px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    left: -45px;
    top: -41px;
}
.text {
    font-size: 20px;
    font-family: 'Roboto', sans-serif; 
    color: #000;
    padding-bottom: 10px;
    font-weight: 700;
    width: 100%;
    float: left;
}
.taxi-contain-two {
    padding-right: 20px;
}
.number-one {
    color: #d5d4d4;
    position: absolute;
    font-size: 75px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    left: -47px;
    top: -40px;
}
.number-two {
    color: #d5d4d4;
    position: absolute;
    font-size: 75px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    left: -46px;
    top: -36px;
}
.number-four {
    color: #d5d4d4;
    position: absolute;
    font-size: 75px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    left: -47px;
    top: -42px;
}
.number-five {
    color: #d5d4d4;
    position: absolute;
    font-size: 75px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    left: -46px;
    top: -36px;
}
.number-six {
    color: #d5d4d4;
    position: absolute;
    font-size: 75px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    left: -47px;
    top: -40px;
}
.Dashboard{
    background:url(../images/dasboard_bg.png) no-repeat; 
    background-size: cover;
    padding-top: 40px; 
}
.Dashboard_lottery{
    background:url(../images/lottery_bg.png) no-repeat; 
    background-size: cover;
    padding-top: 40px; 
}
/* .tab2{
    color: #0790e8;
    background-color: #fff;
    border-color: #0790e8 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    opacity: 1;
    font-size: 30px;
    font-weight: 700;
}
.tab2::before{
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    margin: 0 auto;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #0790e8;
    height: 0;
    width: 0;
    bottom: 0;
} */

.v_btn, .v_btn:visited {
    display: inline-block; 
    padding: 4px 30px;
    border-radius: 30px;
    overflow: hidden;
    position: relative;
    transition: all .5s ease;
    transform: translateZ(0);
}
.v_btn1, .v_btn1:visited {
   border:2px solid #216fb3; 
}
.v_btn:before{
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: #ff !important;
    background:  #216fb3;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.v_btn:hover:before{
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}
.software{
    border: 1px solid #d6d6d6;
    padding: 13px;
    margin: 0 10px;
    height: 100%;
    border-radius: 10px;
    text-align: center;
}
.software h3 {
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    font-size: 23px;
    margin-bottom: 18px;
}
.software p {
    font-size: 16px;
    color: #242729;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}
.software:hover{
    box-shadow: 1px 0 15px #ccc;
    border: 1px solid #666; 
}
.feature-right2 {
    width: 100%;
    display: block;
    padding: 0;
}
.feature-right2 h4 {
    font-size: 22px;
    margin-bottom: 30px;
    width: 100%;
    position: relative;
    font-weight: 700;
}
.section-desc {
    color: #2A3543;
    margin: 20px 0;
}
.feature-list {
    width: 100%;
    display: block;
    padding: 0;
    margin-bottom: 30px;
}
.feature-right2 h4::after {
    content: '';
    width: 130px;
    height: 3px;
    background-color: #3babd1;
    position: absolute;
    left: 0;
    bottom: -20px;
}
.feature-list ul {
    padding: 0;
    margin: 0;
}
.feature-list ul li {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}
.feature-list ul li img {
    width: 35px;
    height: auto;
    margin-right: 20px;
}
.gft_banner_plyicon1{
    margin-top: 10px;
    display: inline-block;
    text-decoration: none;
    padding: 4px 20px;
    font-size: 18px; 
    color: #fff;
    border: 2px solid rgb(255 110 14 / 91%);
    margin-right: 12px;
    border-radius: 20px;
    background-color:rgb(255 110 14 / 91%) ;
}
.gft_banner_plyicon{
    margin-top: 10px;
    display: inline-block;
    text-decoration: none;
    padding: 4px 20px;
    font-size: 18px; 
    color: #fff;
    border: 2px solid rgb(255 110 14 / 91%);
    margin-right: 12px;
    border-radius: 20px;
}
.gft_banner_plyicon1:hover{
    margin-top: 10px;
    display: inline-block;
    text-decoration: none;
    padding: 4px 20px;
    font-size: 18px; 
    color: #fff;
    border: 2px solid #216fb3;
    margin-right: 12px;
    border-radius: 20px;
    background-color:#216fb3 ;
}
.gft_banner_plyicon:hover{
    margin-top: 10px;
    display: inline-block;
    text-decoration: none;
    padding: 4px 20px;
    font-size: 18px; 
    color: #fff;
    border: 2px solid #216fb3;
    margin-right: 12px;
    border-radius: 20px;
}
.adm{
    margin-top: 10px;
    display: inline-block;
    text-decoration: none;
    padding: 4px 20px;
    font-size: 18px; 
    color: #fff;
    background:  #216fb3;
    margin-right: 12px;
    border-radius: 7px;
}
.popupbox3 { 
    width: 373px;
    margin: auto;
    background: #fff;  
    border-radius: 7px; 
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);   
    opacity: 0; 
    transform: scale(0.8); 
    animation: fadeInUp 0.5s ease-out forwards; 
}
.cell{
    background: #8cbef4; 
    padding: 0 20px;
    border-radius: 7px; 
}
.cell2{
    padding: 20px 30px;
}
.panel2{
    background: #f1f8ff;
    padding: 15px 10px;
    margin: 20px 0;
}


.rang_sec_in { 
    margin-top: 15px;
    background: #fff;
    border: 1px solid #216fb3;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 0 10px #ececec;
    position: relative;
}
.rang_sec_in::after {
    content: "";
    width: 60%;
    height: 15px;
    background: #216fb3;
    position: absolute;
    bottom: -15px;
    left: 0;
    border-radius: 0 0 20px 20px;
    right: 0;
    margin: 0 auto;
}
.navbtn5{
    background: linear-gradient(90deg, rgb(239, 154, 6), rgb(237 107 21)) !important;
    padding: 7px 12px;
    color: #fff !important;
    font-size: 15px; 
    font-weight: 400;
  font-family: 'Roboto', sans-serif; 
  margin-left: 7px;
  width: 120px;
}
.laravel2_1 {
    padding: 8px 0px;
    border-radius: 10px;
    border:1px solid #B9B9B9;
    height: 100%;
    text-align: center;
    box-shadow: -4px 29px 14px -22px rgba(0, 0, 0, 0.42);
    background: #fff;
}
.laravel2_1 h1{
    font-size: 44px;
    font-weight: 600;
    color: #216fb3;
}
.laravel2_1 p{
    font-size: 15px;  
    margin-bottom: 0;
}
.equal-spacing {
    padding-left: 15px;
    padding-right: 15px;
    margin-top: -43px;
  }

 

 

.fromsec2,
.fromsec2 form {
    display: flex;
    flex-wrap: wrap; 
    gap: 1rem;
}

.fromsec2, 
.fromsec2 .inpBox2 {
    flex: 1 0 47%;
    position: relative;
    margin: 0 0 1.5rem;
}

.fromsec2 form input {
    height: 60px;
    border: none; 
}

.fromsec2 form input {
    height: 60px;
    border: none; 
    background-color: #f3f3f3;
    border:1px solid #e0dfdf;
    border-radius: 7px;
}

.fromsec2 form ::placeholder { 
    opacity: 1;
    /* Firefox */
}

.fromsec2 form ::-ms-input-placeholder { 
}

.fromsec2 form input {
    width: 100%;
    padding: 1rem 14px;
}

.fromsec2 .textArea {
    flex: 0 0 100%;
    position: relative;
    margin: 0 0 2rem;
    border:1px solid #e0dfdf; 
    padding: 1rem 14px;
}
.btnnn_quote button {
    background: rgb(255 110 14 / 91%); 
    padding: 15px;
    font-size: 22px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    border: none;
    border-radius: 7px;
    color: #fff;
    width: 100%;
}
.btnnn_quote button:hover{ 
    background: #216fb3;
    padding: 15px;
    font-size: 22px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    border: none;
    border-radius: 7px;
    color: #fff;
    width: 100%;
}
.btnnn_quote {
    width: 100%;
}
.thank1{
    width:100%; 
    display: flex;
  flex-direction: column;
  }
  .thank-heading{
    padding :30px;
    text-align:center;
  }
  .thank1 h1{
    font-family: 'Kaushan Script', cursive;
  font-size:8em;
  letter-spacing:3px;
  color:#216fb3 ;
  margin:0;
  margin-bottom:90px;
}
 

.contentpagi {
    display: none;
    padding: 20px; 
    margin: 10px 0;
}
.contentpagi.active {
    display: block;
}
.pagination {
    display: flex;
    justify-content: center;
    margin: 20px 0;
}
.pagination button {
   background: #204279;
   border-radius: 50%;
   color: #fff;
   width: 50px;
   height: 50px;
   border : 1px solid #204279 !important;
   margin: 0 10px;
}
#page-info{
    padding-top: 10px;
}
#page-info2{
    padding-top: 10px;
}

.ecommerce-heading-underline {
    display: inline-block;
    width: 29%;
    height: 4px;
    background-image: linear-gradient(45deg, transparent, #204279, transparent);
    margin: 5px auto 20px;
}
.inner-ecommerce-services {
    padding-top: 20px;
}
.ecommerce-services-single {
    padding: 20px 15px;
    text-align: center;
    background-color: white;
    border-radius: 5px;
    box-shadow: 0px 0px 1px 0px;
    transition: 0.4s linear;
    cursor: pointer;
    height: 100%;
    position: relative;
}
.ecommerce-services-single::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    border-bottom: 3px solid #216fb3;
    width: 0;
    transition: 0.4s linear;
}
.ecommerce-services-single2 {
    padding: 20px 15px;
    text-align: center;
    background-color: white;
    border-radius: 5px;
    box-shadow: 0px 0px 1px 0px;
    transition: 0.4s linear;
    cursor: pointer;
    height: 100%;
    position: relative;
}
.ecommerce-services-single2::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    border-bottom: 3px solid #216fb3;
    width: 0;
    transition: 0.4s linear;
}
.ecommerce-services-single2::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    border-bottom: 3px solid #216fb3;
    width: 0;
    transition: 0.4s linear;
}
.ecommerce-services-single2>p {
    font-size: 14px;
    color: #5e5e5e;
    margin-top: 20px;
    line-height: 1.7; 
    text-align-last: center;
}
.ecommerce-services-single2 img {
    max-width: 200px;
}
.ecommerce-services-single>h4 {
    font-size: 40px;
    margin-bottom: 10px;
    color: #4e4e4e;
    transition: 0.4s linear;
}
.ecommerce-services-single>h5 {
    margin: 20px 0px 25px 0px;
}
.ecommerce-services-single>p {
    font-size: 16px;
    color: #5e5e5e;
    margin-top: 20px;
    line-height: 1.7;
    text-align: justify;
    text-align-last: center;
}
.ecommerce-services-single::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    border-bottom: 3px solid #216fb3;
    width: 0;
    transition: 0.4s linear;
}
.ecommerce-services-single:hover::before, .ecommerce-services-single:hover::after {
    width: 100%; /* Expand width to 100% on hover */
}
.ecommerce-services-single2:hover::before, .ecommerce-services-single2:hover::after {
    width: 100%; /* Expand width to 100% on hover */
}
.ecom_icon1:before { 
    color: #216fb3; 
}
.ecom_icon1::after { 
    color: #216fb3; 
}
.ecommerce-features-single {
    padding: 15px;
    box-shadow: 0px 0px 6px -3px;
    transition: 0.5s ease-in-out;
    cursor: pointer;
    position: relative;
    border-radius: 20px;
    margin-bottom: 20px;
}
.ecommerce-features-single-line1 {
    position: absolute;
    top: 0;
    left: 0;
    height: 20%;
    width: 20%;
    border-radius: 20px 0px 0px 0px;
    border-top: 2px solid;
    border-left: 2px solid;
    transition: 0.5s linear;
}
.ecommerce-features-single-line2 {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 20%;
    width: 20%;
    border-radius: 0px 0px 20px 0px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    transition: 0.5s linear;
}
.ecommerce-features-single:hover .ecommerce-features-single-line1, .ecommerce-features-single:hover .ecommerce-features-single-line2 {
    transition: 0.5s linear;
    height: 100%;
    width: 100%;
}
 
.pm-service {
    display: flex;
    gap: 2rem;
    position: relative; 
    padding: 64px 60px;
    border-radius: 12px;
    box-shadow: 0 0 5px 0 rgba(60, 65, 140, .08), 0 5px 15px 0 rgba(60, 65, 140, .1);
    background-color: #fff;
}
.pm-spervice__picture {
    position: relative;
    display: block; 
    padding: 8px; 
    border-radius: 16px;
    background-color: #e0e4f2;
    box-sizing: border-box;
}
.pm-service__picture-inside img{
    height: 350px;
}
.pm-service__text p{
    text-align: justify;
}
.emc-dlm-box2{
    border: 2px solid #216fb3;
    padding: 26px;
    height: 100%;
    border-radius: 10px;
}
.app-ftr-ty {
    background: #f7f7f7;
    height: calc(100% - 20px);
    box-shadow: -3px -6px 16px #9e9b9bb0;
    border-radius: 15px;
    text-align: center;
    padding: 10px 15px;
    margin-bottom: 12px; 
    text-align: center;
}
 .line-red {
    display: block;
    background: #204279;
    color: #204279;
    height: 2px;
    width: 150px;
    margin: 5px 0;
}
.admin-type {
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
}
.scl-fix-dt {
    height: 470px;
    overflow-y: auto;
    padding: 0 50px;
}
.admin-img img{
    max-width: 520px;
    height: 420px;
}
.app-ftr-typ {
    background: #fff;
    height: calc(100% - 20px);
    box-shadow: -3px -6px 16px #9e9b9bb0;
    border-radius: 15px;
    text-align: center;
    padding: 10px 15px;
    margin-bottom: 12px; 
    text-align: center;
    border: 1px solid #204279;
}
.tourbook img{
    height: 500px;
}
.number_real {
    color: #fff;
    position: absolute;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    left: -48px;
    background: #204279;
    padding: 10px;
    border-radius: 100%;
}

.real_box img{
    max-width:73%;
}
.urban{
    font-size: 20px;
    font-weight: 700;
}
.urban2{
    padding-bottom: 30px;
}
.urban_ds{
    padding-top: 50px;
}
.devs-blocks {
    display: block;
    background: #fff;
    box-shadow: 0 11px 20px rgb(123 149 162 / 15%);
    font-weight: 400;
    font-size: 14px;
    padding: 30px 30px 16px;
    border-radius: 40px 0;
    height: 100%;
    border: 1px solid #d4f0ff;
    -webkit-box-shadow: 0 3.4px 2.7px -30px rgb(0 0 0 / 6%), 0 8.2px 8.9px -30px rgb(0 0 0 / 7%), 0 25px 40px -30px rgb(0 0 0 / 20%);
    box-shadow: 0 3.4px 2.7px -30px rgb(0 0 0 / 6%), 0 8.2px 8.9px -30px rgb(0 0 0 / 7%), 0 25px 40px -30px rgb(0 0 0 / 20%);
}
 .srvTitle {
    font-size: 24px;
    line-height: 32px;
    position: relative;
    padding-left: 71px;
    padding-bottom: 30px;
}
.srvTitle img {
    margin-right: 12px;
    position: absolute;
    max-height: 43px;
    left: 0;
    right: 0;
}
.srvTitle span{
    font-size: 25px;
    font-weight: 700;
}
.urban3{
    padding-bottom: 15px;
}
.features-block:first-child {
    border-left: 1px solid transparent;
}

.features-block {
    padding: 35px;
    border-left: 2px solid #e7e7e7;
    border-bottom:2px solid #e7e7e7;
}
.features-block2 {
    padding: 35px;
    border-left: 2px solid #e7e7e7; 
}
.features-block2:first-child {
    border-left: 1px solid transparent;
}


.vc_column1-inner::before {
    content: " ";
    display: table;
}
.choose-us1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px; 
}
 
.choose-count {
    font-size: 50px;
    font-weight: 700;
    color: #f4f6f7; 
    display: block;
    -webkit-text-stroke-color: #0a56a5 !important;
    -webkit-text-stroke-width: 1px;
}
.ios-app-development-company .box-head { 
    font-size: 30px;
}
.box_sec {
    font-size: 26px;
    font-weight: 700;
    display: block; 
}
.prob img{
    height: 750px !important;
}
.prob2 img{
    height: 700px !important;
}
.right-content_sec p{
    margin: 0;
}
.choose-us-col { 
    height: 100%;
    padding: 20px 15px;
    background:-webkit-linear-gradient(90deg, rgb(209 154 5 / 63%) 0%, rgb(238 198 148) 41%, rgb(237 201 201) 100%);
    box-shadow: 0 0 10px gainsboro;
}
.section-title h1 {
    position: relative;
    margin-top: 10px;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}
.section-title h1::after {
    position: absolute;
    content: "";
    background-color: #1668d6;
    height: 4px;
    width: 100px;
    bottom: -1px;
    left: 0;
}
.portfolio-item{
    background:-webkit-linear-gradient(90deg, rgb(209 154 5 / 63%) 0%, rgb(238 198 148) 41%, rgb(237 201 201) 100%);
    padding:5px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    text-align: center;
    height: 100%;
}
.portfolio-item h5{
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #858585;
    text-align: center;
}
 .food_cell {
        background-image: linear-gradient(rgb(58 10 190 / 58%), rgb(0 0 0 / 65%)), url(../img/career-bg.png);
        background-size: cover;
        padding: 100px 0;
        text-align: center;
        background-repeat: no-repeat;
        background-position: center;
    }
.send_btn4 {
    font-size: 17px;
    transition: ease-in all 0.5s;
    background: -webkit-linear-gradient(90deg, rgb(209 154 5 / 63%) 0%, rgb(238 198 148) 41%, rgb(237 201 201) 100%);
    color: #fff;
    padding: 13px 0px;
    max-width: 280px;
    width: 100%;
    display: block; 
    font-weight: 500;
    text-transform: uppercase;
    border-radius: 25px;
    margin-top: 25px;
    text-decoration: none;
}
 
.laravel {
    padding: 20px 20px;
    border-radius: 10px;
    box-shadow: 1px 0 25px #ccc;
    height: 100%;
    border-top: 4px solid #216fb3;
}
.laravel h4{
    font-weight: 700;
    
}
.tech_stack{
    background: #80808012;
    border: 2px solid #9b95958a;
    padding: 5px;
    border-radius: 10px;
    height: 100%;
}
.tech_stack h3{
    font-size: 21px;
    margin-top: 8px;
    padding-top: 5px;
    text-align: center;
    border-top: 1px solid #216fb3;
}
.imh{
    position: absolute; 
    right: 51%; 
    background: white;
    padding: 7px;
    font-size: 38px;
    border: 2px solid #0a56a5; 
    border-radius: 10px;
}
.imh2{
    position: absolute; 
    right: 12%;
    background: white;
    padding: 7px;
    font-size: 38px;
    border: 2px solid #0a56a5; 
    border-radius: 10px;
}
.footer_info a{
    color: #ffffff;
    text-decoration: none;
}
.social_icons a{
  padding-right: 10px;
}