@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

*{

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}

:root{

    --theme-primarycolor: rgb(179, 27, 43);

    --theme-lightcolor: #f7f7f7;

    --theme-blackcolor: #0A0A0A;

    --theme-whitecolor: #ffffff;

    --theme-paracolor: #414A5D;
.erp-contents .theme-btn
    --theme-mainhead: "Be Vietnam Pro", sans-serif;

    --theme-mainpara: "Be Vietnam Pro", sans-serif;

    --theme-regular:300;

    --theme-medium: 400;

    --theme-bold: 500;

    --theme-smallradius: 4px;

    --theme-mediumradius: 8px;

    --theme-transition: all 0.5s ease-in-out;;

    --theme-bordercolor: #e2e2e2;

    --theme-shadow: 0 2px 4px rgb(0 0 0 / 10%),0 2px 4px rgb(0 0 0 / 10%);

    --theme-gradient: linear-gradient(to right top, #910816, #9f111e, #ad1826, #bb1f2e, #c92637);

}

img{

    max-width: 100%;

    object-fit: cover;

}

body{

    font-family: var(--theme-mainpara);

    font-size: 18px;

    overflow-x: hidden;

}

h1,h2,h3,h4,h5,h6{

    font-family: var(--theme-mainhead);

    font-weight: var(--theme-regular);

    color: var(--theme-primarycolor);

    margin-bottom: 0;

}

h4 {

    color: var(--theme-primarycolor);

    font-weight: var(--theme-bold);

    font-size: 20px;

}

p{

    font-family: var(--theme-mainpara);

    margin-bottom: 0;

    color: var(--theme-paracolor);

    font-size: 16px;

    font-weight: 350;

}

ul li,

ol li{

    list-style: none;

}

ul, ol{

    padding: 0;

    margin: 0;

}

a{

    text-decoration: none;

}

a:hover{

    text-decoration: none;

}

.ptb60{

    padding-top: 60px;

    padding-bottom: 60px;

}

.pt60{

    padding-top: 60px;

}

.pb60{

    padding-bottom: 60px;

}

.prl60{

    padding-right: 60px;

    padding-left: 60px;

}

.ptb30{

    padding-top: 30px;

    padding-bottom: 30px;

}

.pt30{

    padding-top: 30px;

}

.pb30{

    padding-bottom: 30px;

}

.prl30{

    padding-right: 30px;

    padding-left: 30px;

}

.pr30{

    padding-right: 30px;

}

.pl30{

    padding-left: 30px;

}

.mtb20{

    margin-top: 20px;

    margin-bottom: 20px;

}

.mt20{

    margin-top: 20px;

}

.mb20{

    margin-bottom: 20px;

}

.mrl20{

    margin-right: 20px;

    margin-left: 20px;

}

.mr20{

    margin-right: 20px;

}

.ml20{

    margin-left: 20px;

}

.relative{

    position: relative;

}

.absolute{

    position: absolute;

}

.textcenter{

    text-align: center;

}

.textleft{

    text-align: left;

}

.textright{

    text-align: right;

}

.capitalize{

    text-transform: capitalize;

}

.textblack{

    color: var(--theme-blackcolor);

}

.hero-slider

.text60{

    font-size: 56px;

}

.text60{

    font-size: 60px;

}

.primarytext{

    color: var(--theme-primarycolor);

}

.container-fluid {

    max-width: 1920px;

}

.heading-title{

    font-size: 32px;

    color: var(--theme-blackcolor);

    font-weight: var(--theme-bold);

    text-transform: capitalize;

    margin-bottom: 20px;

    position: relative;

}

.heading-title::after {

    content: "";

    position: absolute;

    bottom: -6px;

    left: 0;

    width: 15%;

    height: 3px;

    background: var(--theme-primarycolor);

    z-index: 1;

}

/*.heading-title::before {

    content: "";

    position: absolute;

    bottom: -31px;

    left: -21px;

    background: url(../img/subtitlelogo.png);

    width: 25px;

    height: 28px;

    background-repeat: no-repeat;

    background-size: contain;

} */

.heading-sub-title{

    color: var(--theme-paracolor);

    font-size: 16px;

    font-weight: 350;

    padding-top: 20px;

}

.rowcenter{

    display: flex;

    align-items: center;

    justify-content: center;

}

.write-btn{

    color: var(--theme-primarycolor);

    font-family: var(--theme-mainhead);

    font-size: 16px;

    transition: var(--theme-transition);

    position: relative;

}

.write-btn:hover,

.write-btn:hover::after{

    color: var(--theme-blackcolor);

}

.write-btn::after{

    content: "\f061";

    position: absolute;

    top:0;

    right: -20px;

    font-size: 14px;

    color: var(--theme-primarycolor);

    font-weight: 900;

    font-family: "Font Awesome 6 Free";

    transform: rotate(-45deg);

    transition: var(--theme-transition);

}

.write-btn:hover::after{

    transform: rotate(0deg);

}



.theme-btn {

    background: transparent;

    color: var(--theme-primarycolor);

    text-align: left;

    padding: 10px 15px;

    border-radius: 60px;

    font-size: 16px;

    font-family: var(--theme-mainhead);

    display: inline-block;

    width: 175px;

    transition: var(--theme-transition);

    position: relative;

    border: 1px solid var(--theme-primarycolor);

}

.theme-btn:hover{

    color: var(--theme-whitecolor);

    background-image: linear-gradient(to right top, #c92637, #bb1f2e, #ad1826, #9f111e, #910816);

}

.theme-btn::after {

    content: "\f061";

    position: absolute;

    right: 10px;

    font-size: 14px;

    color: var(--theme-primarycolor);

    font-weight: 900;

    font-family: "Font Awesome 6 Free";

    transform: rotate(-45deg);

    transition: translateY(-50%), var(--theme-transition);
    line-height: 25px;

}

.theme-btn:hover::after{

    color: var(--theme-whitecolor);

    transform: rotate(0deg);

}

.bglight{

    background: var(--theme-lightcolor);

}

.bglight1{

    background: #f9eded;

}

@keyframes totopmove{

    49% {

        transform: translateY(-100%);

    }

    50% {

        opacity: 0;

        transform: translateY(100%);

    }

    51% {

        opacity: 1;

    }

}

@keyframes wave {

	0% {

		background-position: 0 0;

	}

	100% {

		background-position: 300px 0;

	}

}









.academy .heading-sub-title {

    padding-top: 10px;

}

.academy-s .enterprise-card h5 {

    color: #282828;

    font-weight: 600;

    font-size: 18px;

    margin-bottom: 20px;

}

.academy-s .enterprise-card p {

    min-height: 120px;

}

.academy-s .enterprise-card {

    min-height: 525px;

}

.slider .slick-prev {

  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18L9 12L15 6"/></svg>');

  left: -50px;

}

.slider .slick-prev:before

{

    display: none;

}

.slider .slick-next:before

{

    display: none;

}

/* Next Arrow */

.slider .slick-next {

  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18L15 12L9 6"/></svg>');

  right: -50px;

}

.academy-s .heading-sub-title {

    font-weight: 300;

    font-size: 20px;

}

.slider .card:hover {

    transform: translateY(-10px);

    background: var(--theme-gradient);

}

  .slider  .slick-prev {

    left: -25px;

    z-index: 9;

}

 .slider .slick-prev:before, .slick-next:before {

    color: #4d4d4d;

      font-size: 26px;





}

.career-btn span {

    color: #a5a5a5;

    font-size: 14px;

}

.career-btn {

    display: flex;

    align-items: center;

    gap: 30px;

}

/* .career-loc a {

    color: #515151;

} */

.slider .card .card-title {

       color: #fff;

    font-weight: 500;

    font-size: 18px;

}

.slider .card .card-body p.card-text {

    color: #fff;

}

 .svg-a {

     margin: auto;

    padding: 6px;

    width: 80px;

    height: 80px;

    line-height: 60px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: rgb(179, 27, 43);

    border-radius: 50px;

    border: 1px solid transparent;

}

  .svg-a img {

    max-width: 48px;

}

.slider .card:hover .svg-a{

    border: 1px solid var(--theme-whitecolor);

}

.slider .card .card-body

 {

   padding: 0;

 }

   .slider .card {

       text-align: center;

           transition: 0.5s;

    padding: 30px;

    margin-right: 20px;

    background: #464444;

    border: none;

      min-height: 335px;

    border-radius: 10px;

}

   .slider .slick-next {

    right: 0px;

    z-index: 9;

}

.slider1 .card {

       text-align: center;

      transition: 0.5s;

    padding: 30px;

    margin-right: 20px;

    background: #464444;

    border: none;

    min-height: 210px;

     border-radius: 10px;

 }

.slider1 .card .card-title {

    color: #fff;

    font-weight: 500;

    font-size: 18px;

}

.slider1 .card-body {

    padding: 0;

}

.slider1 .slick-prev {

  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18L9 12L15 6"/></svg>');

  left: -20px;

}

.slider1 .slick-prev:before

{

    display: none;

}

.slider1 .slick-next:before

{

    display: none;

}

/* Next Arrow */

.slider1 .slick-next {

  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18L15 12L9 6"/></svg>');

  right: 0px;

}

.slider1 .card:hover {

    transform: translateY(-10px);

}

 .academy-cta .row {

    background: linear-gradient(45deg, #b31b2bf7, #68000bde);

    border-radius: 20px;

    padding: 60px 0;

    position: relative;

    z-index: 2;

}

 .academy-cta h3 {

    color: #fff;

    text-align: center;

    font-weight: 500;

    font-size: 24px;

    margin-bottom: 30px;

}

                  .academy-cta a.theme-btn {

    border-color: #fff;

    color: #fff;

}

 .academy-cta a.theme-btn::after {

    color: #fff;

}

   .academy-cta .row::before {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 100%;

    height: 100%;

    background: url(../img/shapepro.png);

    background-size: contain;

    background-repeat: no-repeat;

    z-index: -1;

    left: 0;

    background-position: right;

    opacity: 0.4;

}

.academy h3 {

    font-weight: 400;

    font-size: 22px;

}

.academy-cta a.theme-btn:hover {

    border-color: #8b212c;

}

    .erp-services-card ul li {

    color: var(--theme-paracolor);

    font-size: 16px;

    font-weight: 300;

    padding-bottom: 10px;

            list-style: disc;

}

        .erp-services-card ul {

    padding-left: 20px;

    padding-top: 20px;

}

.vyntra-navbar #navbarNavDropdown{

    width: 100%;

    display: flex;

    align-items: center;

    justify-content: end;

}

.vyntra-navbar .navbar-nav .nav-link {

    padding-right: 0;

    padding-left: 0;

    color: var(--theme-paracolor);

    font-weight: 350;

    font-size: 16px;

    position: relative;

}

.vyntra-navbar .navbar-nav .nav-link::before{

    content: "";

    position: absolute;

    bottom: 12px;

    left: 0;

    width: 0;

    height: 2px;

    background: var(--theme-primarycolor);

    transition: var(--theme-transition);

}

.vyntra-navbar .navbar-nav .nav-link:hover::before{

    width: 100%;

}

.vyntra-navbar ul.dropdown-menu.show,

.vyntra-navbar ul.dropdown-menu{

    border-top: 2px solid #ab1524;

    border-top-left-radius: 0px;

    border-top-right-radius: 0px;

    position: absolute;

    background: var(--theme-whitecolor) ;

    padding: 10px 0;

    border: none;

    box-shadow: var(--theme-shadow);

    color: var(--theme-primarycolor) !important;

}

.vyntra-navbar a.dropdown-item {

        color: #282828;

    display: block;

    padding: 7px 20px;

    font-family: var(--theme-mainpara);

    font-size: 15px;

    font-weight: 300;

}

ul.dropdown-menu.sub-drop {

    position: relative !important;

       left: 0 !important;

    border-top: 1px solid gainsboro !important;

    box-shadow: none !important;

    border-radius: 0;

}

ul.dropdown-menu.sub-drop li {

    border-bottom: 0;

    padding-top: 0!important;

    padding-bottom: 0!important;

}

.dropend .dropdown-toggle::after

{

    display: none;

}

.dropdown-item:focus, .dropdown-item:hover {

    background-color: transparent !important;

}

.dropdown-toggle::after {

    display: inline-block;

    margin-left: 0;

    vertical-align: unset;

    content: "";

    border-top: none;

    border-right: 0;

    border-bottom: 0;

    border-left: 0;

}

.navbar-nav{

    gap: 40px;

}

.vyntra-navbar {

    padding: 10px 60px !important;

    border-bottom: 1px solid rgb(0 0 0 / 4%);

}

.header-logo{

    color: var(--theme-primarycolor);

    font-weight: 600;

    font-style: oblique;

}

.serach-form input {

    padding: 14px 20px;

    border-top-right-radius: 0px;

    border-bottom-right-radius: 0;

    border-color: #d9d9d9;

}

.serach-form button:hover {

    background: #ae1927;

    border-color: #ae1927;

    color: #fff;

}

.serach-form button {

       padding: 0 25px;

    background: #ae1927;

    border-color: #ae1927;

    border-top-left-radius: 0px;

    border-bottom-left-radius: 0;

    font-size: 18px;

}

nav.vyntra-navbar.navbar.navbar-expand-lg {

    position: sticky;

    top: 0px;

    background: #fff;

    z-index: 99;

}

.serach-form .form-control:focus {

    box-shadow: none;

    border-color: #e1cbcb;

}

.serach-form button

Specificity: (0,1,1)

 {

    padding: 0px 32px;

    border: 1px solid gainsboro;

    border-top-left-radius: 0px;

    border-bottom-left-radius: 0px;

    background: #c02231;

    border-color: #c02231;

}



.vyntra-navbar #main_nav {

    display: flex ;

    align-items: center;

    justify-content: end;

    width: 100%;

}

header.sticky{

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    background: var(--theme-whitecolor);

    border-bottom: 1px solid rgba(0,0,0,.1);

    z-index: 999;

}

.top-navbar{

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 15px 0;

}

.navbar-logo img{

    max-width: 70px;

}

.navbar-ul ul{

    display: flex;

    align-items: center;

    gap: 40px;

}

.navbar-ul ul li a{

    color: var(--theme-blackcolor);

    font-family: var(--theme-mainpara);

    text-transform: capitalize;

    font-weight: 300;

    font-size: 16px;

    position: relative;

    transition: var(--theme-transition);

}

.navbar-ul ul li a:hover{

    color: var(--theme-primarycolor);

}

.navbar-ul ul li a.active::after{

    content: "";

    position: absolute;

    bottom: -5px;

    left: 0;

    width: 50px;

    height: 1px;

    background: var(--theme-primarycolor);

}

.navbar-menu{

    display: none;

}







.hero-section{

    z-index: 5;

}

.hero-section::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: url('../img/shape2.png');

    background-size: contain;

    background-repeat: no-repeat;

    background-position: bottom;

    opacity: 0.2;



    z-index: -1;

}

.hero-heading h1{

    line-height: 1.5;

    color: var(--theme-blackcolor);

}

.hero-heading h1 span{

    color: var(--theme-primarycolor);

}

.hero-content{

    position: relative;

    z-index: 5;

    display: flex;

    align-items: center;

    justify-content: center;

    height: calc(100vh - 80px);

}

.hero-content p{

    font-size: 25px;

}

.hero-content a.theme-btn:hover::after {

    transform: rotate(0deg);

}

.hero-content a.theme-btn {

    margin-top: 46px;

    display: inline-block;

    border: 2px solid var(--theme-primarycolor);

}

.theme-btn::after {

    transition: all 0.5s ease-in-out;

}



 .back-g h4 {

    --tw-border-spacing-x: 0;

    --tw-border-spacing-y: 0;

    --tw-translate-x: 0;

    --tw-translate-y: 0;

    --tw-rotate: 0;

    --tw-skew-x: 0;

    --tw-skew-y: 0;

    --tw-scale-x: 1.1;

    --tw-scale-y: 1.1;

}

.back-g h4 {

       position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

    font-size: 35px;

    color: white;

    z-index: 1;

    transition: 0.5s;

    font-weight: 700;

    padding: 0 20px;

}

.service-card:hover .back-g::before {

    background: #30303000;

}

    .home-service p {

    min-height: auto;

    margin-bottom: 15px;

    font-weight: 400;

}

.service-card{

    padding-bottom: 20px;

    position: relative;

    transition: 0.5s;

    height: 100%;

    border-radius: 8px;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

    background-color: var(--theme-whitecolor);

/*    box-shadow: var(--theme-shadow);*/

    overflow: hidden;

   box-shadow: 0px 6px 8px 2px #dcdcdc45;



}

.home-service ul li {

    font-weight: 300;

    font-size: 15px;

    margin-bottom: 10px;

    padding-left: 28px;

    position: relative;

}

        .home-service .service-content ul {

    min-height: 165px;

}



.home-service ul li i {

    margin-left: -20px;

    color: #b31b2b;

    vertical-align: middle;

    position: absolute;

    left: 24px;

    top: 5px;

}

/*

        .service-content p {

    min-height: 190px;

}

*/

.about-image img {

/*   height:350px;*/

    /* border-top-left-radius: 0 !important; */

    /* border-bottom-left-radius: 0 !important; */

    border-radius: var(--theme-mediumradius);

}





        .service-card img {

            width: 100%;

            height: 200px;

    transition: var(--theme-transition);

            object-fit: cover;

}



.hero-bg-grid {

    background-image: linear-gradient(to right, rgb(235 235 235) 1px, transparent 1px), linear-gradient(to bottom, rgb(242 242 242) 1px, transparent 1px);

    background-size: 80px 60px;

    background-repeat: repeat;

    background-position: 50px 50px;

    position: absolute;

    top: 0;

    left: 50%;

    transform: translateX(-50%);

    height: 80%;

    width: 90%;

    z-index: 2;

}

.hero-bg-shadow {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: auto;

    background: radial-gradient(49.41% 49.41% at 48.91% 52.41%, #fff0 0% 30%, #ffffffeb 86.53%, #fff);

    border-radius: 0;

    z-index: -1;

    box-shadow: 0 0 0 150px #fff;

    transform: translate(0%, 0);

    transition: var(--theme-transition);

}

.hero-slider .slick-dots{

    bottom: 0 !important;

}

.hero-slider .slick-dots li.slick-active button:before{

    color: var(--theme-primarycolor);

    opacity: 1 !important;

}









.service-card{

    position: relative;

    transition: var(--theme-transition);

    height: 100%;

/*    padding: 40px;*/

    border-radius: 8px;

    background: var(--theme-whitecolor);

/*    box-shadow: var(--theme-shadow);*/

}

.our-services::after{

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: url('../img/offering-bg.png');

    background-size: cover;

    background-repeat: no-repeat;

    opacity: 0.4;

    z-index: -1;

}

.service-layers {

    position: absolute;

    top: -10px;

    left: 20px;

    right: 20px;

    bottom: 5px;

    background: #fff;

    border-radius: var(--theme-mediumradius);

    opacity: 0.2;

    z-index: -2;

}

.service-layers::after {

    content: '';

    position: absolute;

    top: -10px;

    left: 10px;

    right: 10px;

    bottom: 5px;

    background: #fff;

    border-radius: var(--theme-mediumradius);

    opacity: .2;

    z-index: -2;

}

/* .service-card:hover{

    transform: translateY(-3px);

} */

.service-image{

    overflow: hidden;

    border-radius: var(--theme-smallradius);

    width: 60px;

    height: 60px;

    border-radius: 50%;

    background: #f3e0e0;

    text-align: center;

    line-height: 60px;

    border: 1px solid var(--theme-primarycolor);

}

.service-image svg {

    fill: var(--theme-primarycolor);

}

.service-card:hover .service-image svg{

    animation:  totopmove 0.3s forwards;

}

.service-content h4{

    color: var(--theme-primarycolor);

    font-weight: var(--theme-bold);

}

.service-slider .slick-prev,

.service-slider .slick-next{

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    background: var(--theme-whitecolor);

    width: 40px;

    height: 40px;

    text-align: center;

    line-height: 40px;

    border-radius: 50%;

    padding: 10px;

    z-index: 2;

    color: var(--theme-primarycolor);

    box-shadow: var(--theme-shadow);

    font-size: 14px;

}

.service-slider .slick-prev{

    left: -30px;

}

.service-slider .slick-next{

    right: -30px;

}

.service-slider .slick-prev img{

    filter: invert(1);

}

.service-slider .slick-next.slick-disabled,

.service-slider .slick-prev.slick-disabled{

    visibility: hidden;

    opacity: 0;

}





.about-image{

    height: 500px;

    height: 100%;

    overflow: hidden;

    /* border-radius: var(--theme-mediumradius); */

}

.about-image img{

    filter: grayscale(100%);

    transition: var(--theme-transition);

/*    height: 100%;*/

}

.about-image:hover img{

    filter: grayscale(0%);

}

.our-vision{

    background: transparent;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

}

.vision-card {

    height: auto;

    display: flex;

    align-items: flex-start;

    justify-content: center;

    flex-direction: column;

    transition: var(--theme-transition);

    padding: 20px 0px;

    overflow: hidden;

    position: relative;

    z-index: 5;

}

.vision-top{

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 20px;

}

.vision-card .vision-head h4{

    transition: var(--theme-transition);

    color: var(--theme-primarycolor);

    font-size: 26px;

}

.vision-img img{

    max-width: 40px;

    transition: var(--theme-transition);

}

.vision-card:hover .vision-img img{

    animation: totopmove 0.3s forwards;

}

.vision-card1{

/*    border-bottom: 1px solid rgba(0,0,0,.1);*/

    position: relative;

}

/*

.vision-card.vision-card1::after {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: url(../img/vision1.png);

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

    opacity: 0;

    visibility: hidden;

    transition: var(--theme-transition);

    filter: grayscale(1) invert(1);

    z-index: -1;

}

*/

.vision-card2{

    position: relative;

    top: 0px;

}

.vision-para .mt20 {

    margin-top: 10px;

}

/*

.vision-card.vision-card2::after {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: url(../img/mission1.png);

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

    opacity: 0;

    visibility: hidden;

    transition: var(--theme-transition);

    filter: grayscale(1) invert(1);

    z-index: -1;

}

.vision-card.vision-card1:hover::after,

*/

.vision-para p {

    font-size: 20px;

}

.vision-card.vision-card2:hover::after{

    opacity: 0.1;

    visibility: visible;

}





footer{

    background: var(--theme-blackcolor);

    padding: 60px 0 0 0;

}

.logo-img{

    width: 60px;

}

.footer-info{

    display: flex;

    gap: 20px;

    margin-bottom: 20px;

}

.logo {

    color: var(--theme-whitecolor);

    font-weight: 600;

    font-style: oblique;

}

.footer-content {

    padding: 0 0 15px 0;

}

.footer-content .footer-head h4{

    color: var(--theme-whitecolor);

    margin-bottom: 20px;

    position: relative;

}

.footer-icon i{

    color: var(--theme-primarycolor);

}

.footer-para h6{

    color: var(--theme-whitecolor);

    font-weight: var(--theme-medium);

}

.footer-para a,

.footer-para p,

.footer-quick-links ul li a{

    color: rgba(255,255,255,0.5);

    font-size: 16px;

    display: block;

    padding: 7px 0;

    transition: var(--theme-transition);

}

.footer-quick-links ul li a:hover{

    color: var(--theme-whitecolor);

    letter-spacing: 1px;

}

.footer-social-links ul{

    display: flex;

    gap: 20px;

}

.footer-social-links ul li a i{

    width: 40px;

    height: 40px;

    background: #FFF7F7;

    min-width: 40px;

    text-align: center;

    line-height: 40px;

    border-radius: 50%;

    color: var(--theme-primarycolor);

}

.copyright{

    color: var(--theme-whitecolor);

    text-align: center;

    font-size: 14px;

    border-top: 1px solid rgba(255,255,255,0.1);

    padding: 10px 0;

    margin: 10px 0 0 0;

}





.vyntra-points {

    min-height: 145px;

}

.vyntra-card{

    padding: 20px;

    border-radius: var(--theme-mediumradius);

    height: auto;

    position: relative;

    z-index: 5;

    overflow: hidden;

    transition: transform .5s ease-in-out;

    background: #fdf5f6;

    display: flex;

    align-items: center;

    flex-direction: column;

}

.flip-box-front .vyntra-card {

    justify-content: center;

    flex-direction: column;

}

.middle-card{

    background: rgb(255 241 242);

}

.vyntra-card:hover{

    transform: translateY(-3px);

}

.vyntra-card::after {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 100%;

    height: 100%;

    background: url('../img/shapepro.png');

    background-size: contain;

    background-repeat: no-repeat;

    z-index: -1;

    opacity: 0.6;

}

.vyntra-top{

    display: flex;

    align-items: center;

    flex-direction: column;

    gap: 20px;

}

.vyntra-icon{

    width: 60px;

    height: 60px;

    min-width: 60px;

    background: var(--theme-whitecolor);

    border-radius: 50%;

    text-align: center;

    line-height: 60px;

    border: 1px solid var(--theme-primarycolor);

}

.vyntra-icon svg{

    fill: var(--theme-primarycolor);

    padding: 4px;

}

.vyntra-span span{

    background: var(--theme-whitecolor);

    color: var(--theme-primarycolor);

    padding: 4px 20px;

    border-radius: 60px;

    font-size: 12px;

}

.vyntra-points p {

    position: relative;

    padding: 5px 0 5px 0;

    display: block;

    font-size: 16px;

    text-align: center;

}

/* .vyntra-points p::after{

    content: "\f058";

    position: absolute;

    top: 10px;

    left: 0;

    font-family: "Font Awesome 6 Free";

    font-weight: 400;

    color: var(--theme-primarycolor);

    font-size: 1em;

} */

 .vyntracard3{

     background: #464444;

/*    background-image: linear-gradient(to right top, #555555, #646464, #616161, #565656, #716d6d);*/

    padding: 20px 20px 20px 20px;

         min-height: 470px;

 }

.flip-box .vyntra-btn {

    margin-left: -12px;

}

.flip-box-back .vyntra-card h4 {

    height: 40px;

}

.footer-social-links ul li a i:hover {

    background: rgb(179, 27, 43);

    color: #fff;

}

.vyntracard4 {

/*    background: #464444;*/

   background-image: linear-gradient(to right top, #910816, #9f111e, #ad1826, #bb1f2e, #c92637);

    padding: 40px 20px 20px 20px;

    min-height: 470px;

}

 .vyntra-head {

    min-height: 48px;

}

  .vyntra-head h4 {

    font-size: 22px;

}

.vyntra-span span {

    font-size: 14px;

    white-space: nowrap;

}

 .vyntra-points p {

    font-size: 18px;

}

 .vyntracard2 .vyntra-points p{

    color: var(--theme-whitecolor);

 }



 .vyntracard2 .vyntra-head h4{

    color: var(--theme-whitecolor);

 }

 .vyntracard2 .write-btn{

    color: var(--theme-whitecolor);

 }

 .vyntracard2 .write-btn::after{

    color: var(--theme-whitecolor);

 }





.blog-card{

    overflow: hidden;

    border: 1px solid rgba(0,0,0,.1);

    background: var(--theme-whitecolor);

    border-radius: var(--theme-mediumradius);

    transition: var(--theme-transition);

    transition: transform .5s ease-in-out;

}

.blog-card:hover{

    transform: translateY(-3px);

    box-shadow: var(--theme-shadow);

}

.blog-image{

    overflow: hidden;

    border-radius: var(--theme-smallradius) var(--theme-smallradius) 0 0;

}

.blog-card:hover .blog-image img{

    filter: grayscale(0%);

}

.blog-content{

    padding: 20px;

}

.blog-content p{

    margin: 10px 0;

}

.blog-image img{

    filter: grayscale(100%);

    transition: var(--theme-transition);

}



.offcanvas{

    background: var(--theme-primarycolor);

}

.offcanvas-body ul li {

    border-bottom: 1px dashed rgba(255, 255, 255, 0.1);

    margin: 6px 0;

    padding: 6px 0;

}

.offcanvas-body ul li:last-child{

    border-bottom: none;

}

.offcanvas-body ul li a {

    color: var(--theme-whitecolor);

    padding: 8px 0;

    display: block;

    font-size: 16px;

    font-weight: 300;

}

.btn-close {

    opacity: 1;

    position: absolute;

    right: 30px;

    top: 20px;

}





.our-values{

    background: url(../img/valuebg.png) #fffafa80;

    background-size: contain;

    background-repeat: no-repeat;

    background-position: initial;

    position: relative;

    z-index: 5;

}

.our-values::after {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, 0.3);

    z-index: -1;

}

.value-card{

    display: flex;

    align-items: start;

    gap: 25px;

    transition: var(--theme-transition);

}

.value-card:hover .value-icon img{

    animation:  totopmove 0.3s forwards;

}

.value-card .value-icon {

    width: 60px;

    height: 60px;

    min-width: 60px;

    line-height: 60px;

    text-align: center;

    border-radius: 50%;

    background: var(--theme-whitecolor);

    display: block;

    border: 1px solid var(--theme-primarycolor);

}

.value-card .value-icon img{

    max-width: 40px;

}

.value-content h5 {

    font-weight: var(--theme-bold);

    margin-bottom: 10px;

}





.our-team-card{

    display: flex;

    justify-content: center;

    flex-direction: column;

    padding: 40px;

    background: var(--theme-gradient);

    box-shadow: var(--theme-shadow);

    border-radius: var(--theme-mediumradius);

    position: relative;

    z-index: 5;

    height: 100%;

}

.our-team-card::after{

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 400px;

    height: 100%;

    background: url(../img/shapepro.png);

    background-size: contain;

    background-repeat: no-repeat;

    z-index: -1;

    left: auto;

    background-position: top, right;

    opacity: 0.4;

}

.team-card-option{

    background: #464644;

}

.team-card-option:hover{

    background: var(--theme-gradient);

}

.team-card-option .team-img img{

    filter: grayscale(1);

}

.team-card-option:hover .team-img img{

    filter: grayscale(0);

}

.team-details-option {

    height: 150px;

    overflow: hidden;

    overflow-y: scroll;

}



.team-details p{

    color: var(--theme-whitecolor);

}

.team-details .theme-btn{
width: auto;
    color: var(--theme-whitecolor);

    border: 1px solid var(--theme-whitecolor);
        padding: 10px 50px;
    padding-left: 14px;

}


.team-details .theme-btn::after{

    color: var(--theme-whitecolor);

}

.top-team{

    display: flex;

    align-items: center;

    gap: 35px;
    position:relative;

}

.team-content h4{

    margin-bottom: 5px;

    color: var(--theme-whitecolor);

    font-size: 24px;

}

.team-content span{

    color: rgba(255,255,255,0.9);

}

.team-img {

    /*width: 70px;*/

    /*height: 70px;*/

    /*display: flex ;*/

    /*background: #fff;*/

    /*border-radius: 50%;*/

    /*overflow: hidden;*/

    /*align-items: center;*/

    /*justify-content: center;*/
    position:relative;

}

.team-img img {
    max-width: 80px;
    background: #fff;
    display: flex
;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    height: 80px;
}

.team-alllogo {

    display: flex;

    align-items: center;

    gap: 30px;

    border-top: 1px dashed rgba(0, 0, 0, 0.1);

    margin: 10px 0 0 0;

    padding: 10px 0 0 0;

}

.team-alllogo .team-logo img{

    max-width: 60px;

}





.breadcrumb-section {

    position: relative;

    padding: 30px 0;

    background: var(--theme-lightcolor);

    z-index: 5;

}

.breadcrumb-section::after {

    content: "";

    position: absolute;

    bottom: 0;

    right: 0;

    width: 100%;

    height: 100%;

    background: url(../img/breadcrumbbg1.png);

    background-repeat: repeat;

    background-size: contain;

    background-position: center;

    z-index: -1;

}

.breadcrumb-head h1 {

    text-align: left;

    font-size: 30px;

    color: var(--theme-primarycolor);

    font-weight: var(--theme-bold);

}

.breadcrumb-ul ul {

    display: flex;

    gap: 10px;

}

.breadcrumb-ul ul li .active {

    color: #262626;

}

.scroll-b {

    max-height: 500px;

    overflow-y: auto;

}

.breadcrumb-ul ul li a{

    font-size: 16px;

    color: var(--theme-primarycolor);

}

.breadcrumb-ul ul li a i{

    font-size: 12px;

}





.contact-details-card{

    background-image: var(--theme-whitecolor);

    height: 100%;

    padding: 25px 20px;

    border-radius: var(--theme-mediumradius);

        box-shadow: 0 0 10px #dcdcdcc4;;

    position: relative;

    z-index: 5;

    transition: var(--theme-transition);

}

.contact-details-card:hover{

    background-image: var(--theme-gradient);

}

.contact-details-card:hover::after{

    filter: grayscale(.5) invert(2);

}

.contact-details-card:hover .contact-details-icon i{

    background: var(--theme-whitecolor);

    color: var(--theme-primarycolor);

}

.contact-details-card:hover .contact-details-para h5,

.contact-details-card:hover .contact-details-para p{

    color: var(--theme-whitecolor);

}

.contact-details-card::after {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 150px;

    height: 100px;

    background: url(../img/contact-details.png);

    background-size: contain;

    background-repeat: no-repeat;

    background-position: right;

    opacity: 0.2;

    z-index: -1;

}

.contact-details-box{

    display: flex;

    align-items: center;

    flex-direction: column;

    gap: 30px;

}

.contact-details-icon i{

    color: var(--theme-whitecolor);

    width: 50px;

    height: 50px;

    background: var(--theme-primarycolor);

    font-size: 25px;

    text-align: center;

    line-height: 50px;

    border-radius: 50%;

}

.contact-details-para h5{

    color: var(--theme-primarycolor);

    font-weight: var(--theme-bold);

    margin-bottom: 8px;

    text-align: center;

}

.contact-details-para p{

    text-align: center;

}





.contact-form-section{

    margin-top: 30px;

}

.contact-form-design{

    background: var(--theme-whitecolor);

    padding: 40px;

    box-shadow: var(--theme-shadow);

    height: 100%;

    border-radius: var(--theme-mediumradius) 0 0 var(--theme-mediumradius);

}

.contact-form-design h3{

    color: var(--theme-primarycolor);

    font-weight: var(--theme-bold);

    font-size: 30px;

}

.contact-form-design .form-control{

    border: 1px solid rgb(241 241 241);

}

.contact-form-design .form-control:focus {

    color: #212529;

    background-color: transparent;

    border-color: var(--theme-primarycolor);

    outline: 0;

    box-shadow: none !important;

}

.contact-form-design .form-floating>.form-control:focus~label,

.contact-form-design .form-floating>.form-control:not(:placeholder-shown)~label,

.contact-form-design .form-floating>.form-select~label {

    opacity: .90;

    transform: scale(.85) translateY(-.5rem) translateX(.15rem);

    color: var(--theme-primarycolor);

}

.contact-google-map iframe {

    border-radius: 0 var(--theme-mediumradius) var(--theme-mediumradius) 0;

}

.contact-form-design .form-floating textarea{

    height: 100px;

}





.career-image {

    height: 100%;

}

.career-image img{

    border-radius: var(--theme-smallradius);

    height: 100%;

}

.career-form{

    background: var(--theme-gradient);

    box-shadow: var(--theme-shadow);

    padding: 40px 20px;

    height: 100%;

    border-radius: var(--theme-smallradius);

}

.career-input{

    background: transparent;

    border: none;

    border-bottom: 1px solid var(--theme-whitecolor);

    border-radius: 0 !important;

    color: var(--theme-whitecolor);

}

.career-input:focus,

.career-input:hover {

    background: transparent;

    box-shadow: none;

    border-color: var(--theme-whitecolor);

    color: var(--theme-whitecolor);

}

.career-submit{

    border: 1px solid var(--theme-whitecolor);

    color: var(--theme-whitecolor);

}

.career-submit::after{

    color: var(--theme-whitecolor);





}

.career-submit:hover::after{

    color: var(--theme-whitecolor);

        transform: rotate(0deg);

}

.career-form .form-floating>label{

    color: var(--theme-whitecolor);

}

.career-form .invisible{

    visibility: visible !important;

    opacity: 0;

}





label.custom-resume {

    display: block;

    width: 100%;

    padding: .375rem .75rem;

    font-size: 1rem;

    font-weight: 400;

    line-height: 1.5;

    color: #212529;

    background: transparent;

    border: none;

    border-bottom: 1px solid var(--theme-whitecolor);

    border-radius: 0 !important;

    background-clip: padding-box;

    -webkit-appearance: none;

    -moz-appearance: none;

    appearance: none;

    border-radius: .25rem;

    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;

}

.form-floating>.form-control:not(:placeholder-shown)~label.custom-resume{

    opacity: 1;

    transform: scale(1) translateY(0) translateX(0);

}



.enterprise-icon {

    position: relative;

    overflow: hidden;

}

.enterprise-para {

    padding: 20px 20px;

}

.enterprise-card {

    min-height: 650px;

    background: var(--theme-whitecolor);

    box-shadow: var(--theme-shadow);

    padding:0px;

/*    height: 100%;*/

    border-radius: var(--theme-mediumradius);

    transition: var(--theme-transition);

    position: relative;

    overflow: hidden;

}

.enterprise-para p {

    min-height: 290px;

}





.enterprise-head h4 {

    color: #fff;

    font-size: 30px;

}

.enterprise-icon:hover .enterprise-head {

    background: rgb(0 0 0 / 48%);

}

.enterprise-card:hover .enterprise-head {

    background: linear-gradient(45deg, #b31b2bf7, #68000bde);

}

.enterprise-head

{

    transition: 0.5s;

    position: absolute;

        top: 0;

            left: 0;

            width: 100%;

            height: 100%;

            background: #505050c9;

            color: #fff;

            display: flex;

            align-items: center;

            justify-content: center;

            text-align: center;

            padding: 20px;

}



.enterprise-icon img {

    transition: 0.5s;

}

.enterprise-icon:hover img {

    transform: scale(1.1);

}

.enterprise-card:hover img {

    transform: scale(1.1);

}

.enterprise-card::after{

    content: "";

    position: absolute;

    top: 0;

    left: 50%;

    width: 0;

    height: 100%;

    opacity: 0;

    visibility: hidden;

    background: var(--theme-gradient);

    z-index: -1;

}

.enterprise-card:hover::after{

    top: 0;

    left: 0;

    opacity: 1;

    width: 100%;

    visibility: visible;

}

/*

.enterprise-card:hover{

    background: var(--theme-gradient);

}

*/

/*

.enterprise-card:hover .enterprise-head h4,

.enterprise-card:hover .enterprise-para p{

    color: var(--theme-whitecolor);

}

*/

/*

.enterprise-card:hover .enterprise-icon img{

    animation: totopmove 0.3s forwards;

}

*/

/*

.enterprise-icon {

    width: 65px;

    height: 65px;

    background: var(--theme-gradient);

    border-radius: 50%;

    text-align: center;

    line-height: 65px;

    box-shadow: var(--theme-shadow);

}

*/

.enterprise-icon img {

    filter: grayscale(1);

/*    max-width: 45px;*/

}

.enterprise-card:hover img {

    filter: brightness(1);

}

/*

.enterprise-card:hover .enterprise-btn .write-btn{

    color: var(--theme-whitecolor);

}

.enterprise-card:hover .enterprise-btn .write-btn::after{

    color: var(--theme-whitecolor);

}

*/



.erp-contents{

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

}

.erp-contents .theme-btn{

    width: auto;
    padding: 10px 40px;
    padding-left: 14px;

}



.erp-suite{

    background: #fdfdfd;

}

.erp-card {

        background: #464444;

    padding: 30px 15px;

    border-radius: var(--theme-mediumradius);

    position: relative;

    overflow: hidden;

    border: 1px solid rgba(0,0,0,0.1);

    height: 100%;

    z-index: 5;

    transition: var(--theme-transition);

}

.academy-cta a.theme-btn {

       padding: 10px 40px;
    width: auto;
    padding-left: 14px;

}
.academy-cta .row .col-md-9 {
    display: flex;
    flex-direction: column;
}
.erp-card::before {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 56%;

    height: 100%;

    background: url(../img/shapepro.png);

    background-size: contain;

    background-repeat: no-repeat;

    z-index: -1;

    opacity: 0.6;

}

/*

.erp-card:hover{

    background: var(--theme-gradient);

    border: 1px solid rgba(255, 255, 255, 0.5);

}

*/

.erp-card:hover .erp-head h6,

.erp-card:hover .erp-content p{

    color: var(--theme-whitecolor);

}

/*

.erp-card:hover .erp-icon{

    filter: invert(1);

}

*/

.career-btn a.theme-btn:hover::after {

    transform: rotate(0deg);

}

.erp-card .erp-content p {

    color: #fff;

}

.erp-card h6 {

    color: #fff;

}

.erp-card

{

   transition: transform 0.4s ease, box-shadow 0.4s ease;

}

.erp-icon {

    text-align: center;

        width: 80px;

    height: 80px;

    margin: 20px auto;

    background: #b31b2b;

    border-radius: 50px;

    line-height: 60px;

    padding: 6px;

    display: flex;

    align-items: center;

    justify-content: center;



}

.erp-card:hover {

    transform: translateY(-10px);

}

.erp-icon img {

    max-width: 48px;

}

/*

.erp-card:hover .erp-icon {

    background: #ffffff;

}

*/

.erp-card:hover .erp-icon .svg1 {

    fill: transparent;

    stroke: #b31b2b;

}

.erp-card:hover .erp-icon svg {

    fill: #b31b2b;

}

.erp-icon {

   margin-bottom: 12px;

    text-align: center;

/*

    position: absolute;

    bottom: 10px;

    right: 10px;

    width: 70px;

    height: 70px;

*/

/*

    z-index: -1;

    opacity: 0.1;

*/

}

.erp-head h6 {

    text-align: center;

    font-weight: var(--theme-bold);

    margin-bottom: 20px;

}

.erp-content p {

    text-align: center;

}



.erp-services-card {

    background: var(--theme-lightcolor);

    border-radius: var(--theme-mediumradius);

    overflow: hidden;

    position: relative;

}

.erp-services1::after {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 300px;

    height: 200px;

    background: url(../img/contact-details.png);

    background-repeat: no-repeat;

    background-size: contain;

    background-position: right;

    filter: invert(1);

    animation: righttoleft 4s linear infinite;

    opacity: 0.2;

}

.erp-services2::after {

    content: "";

    position: absolute;

    bottom: 0;

    left: 0;

    width: 300px;

    height: 200px;

    background: url(../img/service-bg1.png);

    background-repeat: no-repeat;

    background-size: contain;

    background-position: left;

    filter: invert(1);

    animation: topbottom 4s linear infinite;

    opacity: 0.2;

}

@keyframes righttoleft {

    50% {

        transform: translateY(-40px);

    }

}

@keyframes topbottom {

    50% {

        transform: translateY(40px);

    }

}

.erp-service-content {

    padding: 20px 40px;

}

.erp-services2 .erp-service-image {

    padding-left: 50px;

    height: 100%;

}

.erp-service-image img{

    height: 100%;

    filter: grayscale(1);

}

.flip-box-back ul li:last-child {

    padding-bottom: 0;

}

.gcc-img img {

    width: 100%;

    border-radius: 10px;

        filter: grayscale(1);

}

.dropdown-menu.sub-drop

{

 top:1rem !IMPORTANT;

}

.vyntra-top {

    height: 8vh;

}

.dropdown-menu {

        left: 0;

      margin-top: -0.9rem !IMPORTANT;

/*        min-width: 38rem;*/

    border: none;

    border-top: 2px solid gainsboro;

    padding: 0px;

    box-shadow: 1px 5px 9px #dcdcdc87

}

.dropdown-menu li a:hover {

    color: #b31b2b;

}

.dropdown-menu h3 a {

    color: #b31b2b;

}

.dropdown-menu h3 {

    font-size: 18px;

    margin-bottom: 12px;

}

.dropdown-menu li a {

    color: #282828;

    font-size: 15px;

}

.dropdown-menu li {

    padding-bottom: 8px;

    transition: 0.5s;

    border-bottom: 1px solid #ffebeb;

    padding-top: 8px;

        padding-left: 12px;

    padding-right: 12px;

    line-height: 24px;

}

.dropdown-menu li:last-child {

    border-bottom: none;

}

a.main-n {

    line-height: 24px;

}

.erp-services-card

{

        transition: 0.5s;

}

.erp-services-card:hover img {

    filter: brightness(1);

}

.erp-service-image img{

    height: 100%;

}

.erp-services2{

    background: #fff3f3;

}

.erp-service-list li p{

    position: relative;

    padding-left: 30px;

}

.erp-service-list li p::after{

    content: "\f00c";

    position: absolute;

    top: 5px;

    left: 0;

    color: var(--theme-primarycolor);

    font-size: 12px;

    font-weight: 700;

    font-family: "Font Awesome 6 Free";

}





.blog-detail-content-box h2{

    font-weight: var(--theme-bold);

    text-transform: capitalize;

    font-size: 40px;

}

.blog-detail-content-box h4{

    font-weight: var(--theme-bold);

    text-transform: capitalize;

}

.blog-detail-image img{

    border-radius: 8px 8px 0 0;

    width: 100%;

    height: 400px;

}

.blog-detail-content {

    background: var(--theme-whitecolor);

    box-shadow: var(--theme-shadow);

    border-radius: 0 0 8px 8px;

    padding: 40px;

}

.gcc-box .card-body:hover .gcc-content.content-c {

    margin-bottom: 25px;

}



.gcc-box .card-body:hover .arrow-c {

    transform: translate(-20px, 24%);

    opacity: 1;

}

    .arrow-c {

    position: absolute;

    transform: translate(9px, -85%);

    right: 0;

    opacity: 0;

    top: 0;

        transition: 0.5s;

}

    .arrow-c img {

    max-width: 56px;

}

    .gcc-box

    {

     background: transparent;

    }

    .gcc-box .card-body .gcc-content h6 {

    color: #fff;

    font-size: 18px;

    font-weight: 500;

}

      .gcc-box .card-body {

    padding: 0;

}

 .gcc-box .card-body:hover .gcc-content {

    transform: translate(0px, -134%);

}

.gcc-box .card-body:hover .gcc-img img {

        filter: brightness(1);

}

/* .vyntra-partner img{

    filter: brightness(0) !important;

}

.vyntra-partner:hover img{

    filter: brightness(0) !important;

} */

.vyntra-partner .vyntra-partner-body:hover .gcc-content {

    transform: translate(0px, -195%) !important;

}

.gcc-box .card-body .gcc-content {

    position: absolute;

    bottom: 0;

    padding: 20px;

    width: 100%;

    transition: 0.5s;

}



.gcc-box .card-body .gcc-content h5 {

    color: #fff;

    font-weight: 500;

    font-size: 22px;

}

.inner-heading .heading-title {

    font-size: 32px;

}

    .gcc-box .card-body .gcc-content p {

    color: #e1e1e1;

}

.inner-heading .heading-title1 {

    font-size: 32px;

    color: var(--theme-blackcolor);

}

    .gcc-box .card-body .gcc-para p

    {

        color: #fff;

    }

    .gcc-para {

    position: absolute;

    bottom: 0;

    padding: 20px;

    transform: translateX(-90px);

    transition: 0.5s;

    opacity: 0;

}

    .gcc-box .card-body:hover .gcc-para {

    transform:translateX(0px);

    opacity: 1;

    transition: 0.5s;

}

.gcc-page1

{

    background:#fff;

}

.gcc-page1 .card {

    min-height: 186px !important;

}

span.header-logo b {

    font-weight: 300;

    font-style: normal;

    font-size: 8px;

    top: -6px;

    position: relative;

    color: #282828;

}

.footer-logo span.logo .tt {

    font-weight: 300;

    font-style: normal;

    font-size: 8px;

    top: -6px;

    position: relative;

    color: #ffffff;

    left: 2px;

}

.career-item {

    width: 100%;

    border: 1px solid rgba(0, 0, 0, 0.1);

    background: var(--theme-lightcolor);

    border-radius: var(--theme-mediumradius);

}

.career-job-logo{

    display: flex;

    align-items: center;

    justify-content: center;

    height: 100%;

}

.career-job-logo img {

    max-width: 120px;

    width: auto;

}

.career-job-detail {

    padding: 20px;

/*    border-left: 1px solid rgba(0, 0, 0, 0.1);*/

}

.career-jobhead h6 {

    font-weight: var(--theme-bold);

}

.career-job-published span{

    font-size: 16px;

    color: var(--theme-paracolor);

    margin-top: 10px;

    display: inline-block;

}

.career-location {

    display: flex ;

    align-items: center;

    justify-content: flex-start;

    width: 100%;

    border-top: 1px solid rgba(0, 0, 0, 0.1);

    margin-top: 10px;

    padding-top: 10px;

    gap:50px;

}

.academy-cta a.theme-btn:hover {

    background: #fff;

    color: #282828;

}

.academy-cta a.theme-btn:hover::after {

    color: #282828;

}

.gcc-page.min .card {

    min-height: 270px;

}

.gcc-page.max .card {

    min-height: 290px;

}

.career a.theme-btn {

    padding: 6px 10px;

    font-size: 13px;

    width: 140px;

}

.career-loc {

    display: flex;

    align-items: center;

    gap: 30px;

}

.career-loc span {

    font-size: 15px;

    color: #ababab;

}

.erp-contents h4 {

    font-size: 30px;

}

.erp-contents p {

    font-size: 20px;

}

.blog-date {

  font-size: 14px;

  color: #888;

  margin-bottom: 8px;

}

.blog-date i {

    padding-right: 5px;

    color: #b31b2b;

}

.vyntra .modal-body {

    padding: 30px;

}

.vyntra button.btn-close {

    z-index: 99;

}

.vyntra .modal-body h2 {

    color: #282828;

    font-weight: 500;

    font-size: 25px;

    margin-bottom: 10px;

}

.vyntra .modal-body p {

    margin-bottom: 20px;

}

.vyntra .modal-body h3 {

    color: #282828;

    font-size: 20px;

    font-weight: 500;

    margin-bottom: 10px;

}

.vyntra .modal-body li {

    font-size: 15px;

    color: var(--theme-paracolor);

    font-weight: 300;

}

.vyntra .modal-body li strong {

    color: #282828;

}

 .lottie-icon {

    width: 80px;

    height: 80px;

    background: #b31b2b;

    border-radius: 50px;

    padding: 6px;

    display: flex;

    align-items: center;

    margin-bottom: 20px;

    justify-content: center;

}

.lottie-icon img {

    max-width: 48px;

}

   header .container-fluid {

    width: 90%;

}

 .timeline-step

{

    flex: 1 1 45%; max-width: 50%;

}



       .timeline-step.step1 .line-h {

    line-height: 35px;

}

.timeline-step.step1 {

    max-width: 100%;

}

    .step1 {

    width: 100% !important;

   min-height: 578px;

    padding-top: 30px !important;

}

       .timeline-step p {

    color: #fff;

}

       .timeline-step {

    position: relative;

    padding-left: 2rem;

        margin-bottom: 0;





}

  .timeline {

      position: relative;

      display: flex;

      justify-content: space-around;

      margin-top: 5rem;

      overflow-x: auto;

      padding-bottom: 4rem;

    }

    .timeline::before {

      content: '';

      position: absolute;

      top: 50%;

      left: 5%;

      right: 5%;

      height: 4px;

      background-color: #f6f6f6f0;

      z-index: 1;

      transform: scaleX(0);

      transform-origin: left;

      transition: transform 1s ease-in-out;

    }

       .timeline-step::before {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 56%;

    height: 100%;

    background: url(../img/shapepro.png);

    background-size: contain;

    background-repeat: no-repeat;

    z-index: -1;

    opacity: 0.6;

}

    .timeline.in-view::before {

      transform: scaleX(1);

    }

       .timeline-step h5 {

    font-size: 18px;

    color: #ffffff;

    font-weight: 500;

    margin-bottom: 10px;

}

        h4.sub-enter {

   flex-direction: column;

}

 .sub-enter .ss-e {

    font-size: 20px;

    padding-top: 6px;

}



    .timeline-step {

      position: relative;

    z-index: 2;

          background: #464444;

    border-radius: 10px;

      padding: 1rem 1.5rem;

      transition: transform 0.4s ease, box-shadow 0.4s ease;

    }

    .timeline-step:hover {

      transform: translateY(-10px);

/*      box-shadow: 0 20px 30px rgba(0, 0, 0, 0.15);*/

    }

    .gcc-process .tab1 .active::after {

    content: '';

    position: absolute;

    border-right: 4px solid #b61a2c;

    left: auto;

    right: 0px;

    bottom: 0;

    top: 15px;

    height: 75px;

}



    @media (max-width: 768px) {

      .timeline {

        flex-direction: column;

        padding: 2rem 1rem;

      }

      .timeline::before {

        top: initial;

        bottom: 0;

        left: 0;

        right: 0;

        transform-origin: left;

      }

      .timeline-step {

        margin-bottom: 2.5rem;

      }

    }

      .impact-section {

      padding: 60px 0;

    }

    .impact-section .card {

      border: none;

      border-radius: 12px;

      box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);

      transition: transform 0.3s ease, box-shadow 0.3s ease;

    position: relative;

    }

    .impact-section .card:hover {

      box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);

    }

    .impact-section .impact-section .icon {

      font-size: 2rem;

      color: #0d6efd;

      margin-right: 10px;

    }

      .impact-section .card::before {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 200px;

    height: 125px;

    background: url(../img/contact-details.png);

    background-repeat: no-repeat;

    background-size: contain;

    background-position: right;

    filter: invert(1);

    opacity: 0.1;

}

    .impact-section .section-title {

      font-size: 2rem;

      font-weight: bold;

    }

       .impact-section h5 {

    color: #282828;

    font-weight: 600;

}

       .impact-section ul li strong {

    font-weight: 500;

}

   .impact-section ul li {

    margin-bottom: 14px;

    font-size: 16px;

    color: var(--theme-paracolor);

    font-weight: 300;

}

ul.dropdown-menu li ul.dropdown-menu

 {

    position: relative !important;

    top: 19px;

    height: auto !important;

}

.accordion-title:before {

    float: right !important;

    font-family: FontAwesome;

    content:"\f068";

    padding-right: 5px;

}

.accordion-title.collapsed:before {

    float: right !important;

    content:"\f067";

}



@media (min-width: 576px) {

    .modal-dialog {

        max-width: 800px !important;

    }

}



.about .heading-title::after {

    content: "";

    position: absolute;

    bottom: -6px;

    left: 0;

    width: 7%;

    height: 3px;

    background: var(--theme-primarycolor);

    z-index: 1;

}

.academy

{



 position: relative;

}

.academy::before {

    background-image: url(../img/wave-back1.png);

    content: '';

    position: absolute;

    inset: 0;

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center;

    opacity: 0.6;

}



.service-content {

    padding: 10px 20px;

}

        .service-btn {

      padding: 0px 20px;

    position: relative;

    z-index: 9;

}

 .back-g img {

    filter: grayscale(1);

}

        .service-card:hover img {

    filter: brightness(1);

}



.back-g {

    position: relative;

    overflow: hidden;

    transition: 0.5s;



}



        .back-g::before {

    content: '';

    position: absolute;

    inset: 0;

    background: #505050c9;

    z-index: 1;

        transition: 0.5s;

}

        .back-g img

        {

            transition: 0.5s;

                filter: grayscale(1);

        }

        .service-card:hover img {

    filter: brightness(1);

}

 .service-card:hover h4 {

    transform: scale(1.06);

    text-shadow: 0 0 4px #515050;

}

.service-card .service-content h5 {

    color: #282828;

    font-weight: 600;

    font-size: 18px;

    margin-bottom: 20px;

}

.inner-card .service-content {

    padding-bottom: 45px;

}

.inner-card .service-btn {

    position: absolute;

    bottom: 20px;

}

.service-card.inner-card {

    justify-content: flex-start;

}



.academy-suite .card:hover {

    /* box-shadow: 0 2px 20px 8px rgba(0, 0, 0, .08); */

    border-top: 4px solid #b31b2b;

    z-index: 2;

        background: #5a5a5a;

}

.academy-suite .card::before {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 45%;

    height: 72%;

    background: url(../img/shapepro.png);

    background-size: contain;

    background-repeat: no-repeat;

    z-index: 1;

    opacity: 1;

}

.academy-suite .card:hover h5

{

 color: #fff;

}

.academy-suite .card:hover p

{

 color: #fff;

}

.gg-verse .card {

    border-radius: 0 !important;

}

.academy-suite .card {

    transition: 0.5s;

    text-align: center;

    padding: 20px;

    min-height: 310px;

    border-radius: 8px;

    border-color: #ededed;

    text-decoration: none;

    position: relative;

    background: #ffffff;

}

.academy-suite .card .card-body {

    padding-bottom: 0;

}

.gcc-page1 .card {

    border-radius: 0;

}

.academy-suite .card h5 {

    color: #282828;

    font-weight: 600;

}

.card.card-img {

    background-image: repeating-linear-gradient(45deg, #f2f3f4, #f2f3f4 1px, #fff 0, #fff 50%);

    background-size: 8px 8px;

}

.card.card-img:hover {

    transform: none;

    box-shadow: none;

    border-top: none;

    z-index: 9;

    background: none;

}

.academy-suite .shadow

{

    margin-top: 30px;

/*    box-shadow: 0 2px 20px 8px rgba(0,0,0,.08);*/

}

.inner-card h4 {

    font-size: 30px;

}

.enterprise::before{

 display: none;

}

/*

.timeline--horizontal .timeline__item .timeline__content:before

{

        border-top: 12px solid #b91e2d !important;

}

*/



.timeline--horizontal .timeline__item .timeline__content:after {

    border-top: 10px solid #af1927;

}

.timeline__item.end.timeline__item--bottom

{

 position: relative;

}

.timeline--horizontal .timeline__item:last-child:after {

    background: #ae1927;

    border-color: #ac1825;

}

.about-page .card {

    background: #5a5a5a;

}

.gcc-page .card {

    background: #5a5a5a;

    min-height: 190px;

}

.impact-section .card::before

{

 display: none;

}

.impact-section .card:hover ul li {

    color: #fff;

}

.timeline__item.end.timeline__item--bottom::before {

    content: '';

    position: absolute;

    background-image: url('../img/flag1.png');

    width: 60px;

    height: 60px;

    left: 42px;

    right: 0px;

    bottom: auto;

    top: -60px;

    background-size: contain;

    background-position: center;

    margin: auto;

}

   .service-enterprise h6 {

    margin-bottom: 6px;

    font-size: 18px;

}

  .service-enterprise h6 {

    margin-bottom: 7px;

    font-size: 16px;

    color: #282828;

    font-weight: 600;

}

        .service-enterprise p {

   font-weight: 300;

    font-size: 15px;

}

.service-enterprise .service-content {

    padding-bottom: 0;

}

.row.new-sec .col-md-6 .back-g img {

    height: 482px;

}

.row.new-sec .col-md-6.right {

    background: #fff;

    padding: 0;

    box-shadow: 0 0 10px #ededed;

    border-top-right-radius: 8px;

    border-bottom-right-radius: 8px;

}

.row.new-sec .col-md-6.right .service-content {

    padding: 40px;

    display: flex;

    flex-direction: column;

    justify-content: center;

}

.service-enterprise .head {

    font-size: 16px;

    font-weight: 400;

}

.row.new-sec  .head {

    font-size: 16px;

    font-weight: 400;

}

.row.new-sec .col-md-6 .back-g {

    border-top-left-radius: 8px;

    border-bottom-left-radius: 8px;

}

.row.new-sec:hover .back-g::before {

    background: #30303000;

}

.row.new-sec:hover img {

    filter: brightness(1);

}

.row.new-sec:hover h4 {

    transform: scale(1.06);

    text-shadow: 0 0 4px #515050;

}

  .row.new-sec h6 {

    margin-bottom: 7px;

    font-size: 16px;

    color: #282828;

    font-weight: 600;

}

  .row.new-sec p {

   font-weight: 300;

    font-size: 15px;

}

    .vyntra-partner {

        height: 100%;

        position: relative;

        overflow: hidden;

        border-radius: 8px;

        transition:  all 0.5s ease-in-out;

    }

    .vyntra-partner-body {

        border-radius: 8px;

        position: relative;

    }

/*

    .vyntra-partner-body::before {

    content: '';

    position: absolute;

    inset: 0;

    background: #0000008c;

    z-index: 1;

}

*/

    .vyntra-partner-img, .vyntra-partner-img img {

    border-radius: 8px;

    position: relative;

}

 .vyntra-partner-img::before {

    content: '';

    position: absolute;

    inset: 0;

    background: #00000066;

    z-index: 1;

}

.vyntra-partner:hover .vyntra-partner-img img {

    filter: brightness(1);

}



.vyntra-partner-img img {

    width: 100%;

    filter: grayscale(1);

}

.vertical-tabs .tab-content h3 {

    font-size: 22px;

    color: #282828;

    font-weight: 600;

    margin-bottom: 14px;

}

    .vertical-tabs {

      display: flex;

      gap: 2rem;

      background: white;

      padding: 0rem;

      border-radius: 12px;

   }

p.vyntra-para {

    transform: translateX(-114%);

}

    .vyntra-partner-body:hover p.vyntra-para {

    transform: translateX(0px);

    opacity: 1;

    transition: 0.5s;

}

    .vyntra-content {

        position: absolute;

        z-index: 5;

        bottom: -30%;

        left: 0;

        padding: 20px;

        transition: all 0.5s ease-in-out;

    }

.sub-gcc1

{

        bottom: -23%;

}

.sub-gcc1 h5

{

        margin-bottom: 12px;

}

    .vyntra-partner:hover .vyntra-partner-img img{

        filter: grayscale(0);

    }

    .vyntra-partner:hover .vyntra-content{

        bottom: 0;

    }

    .vyntra-partner:hover .vyntra-para{

        height: auto;

    }

    .vyntra-title {

        color: #fff;

        font-weight: 500;

        font-size: 22px;

            margin-bottom: 20px;

/*        height: 70px;*/

    }

.sub-gcc

{

        color: #fff;

    font-size: 18px;

    font-weight: 500;

    margin-top: 10px;

    margin-bottom: 20px;

}

    .vyntra-para {

        color: var(--theme-whitecolor);

        height: 100px;

    }



    /* Left nav steps container */

    .vertical-tabs .nav-pills {

      flex-direction: column;

      gap: 20px;

      width: 35%;

      max-height: 450px;

      overflow-y: auto;

      padding-right: 12px;

    padding-left: 0px;

      border-right: 1px solid #dee2e6;

    }



    /* Hide default scroll for Chrome, Safari, Edge */

    .vertical-tabs .nav-pills::-webkit-scrollbar {

      width: 6px;

    }

    .vertical-tabs .nav-pills::-webkit-scrollbar-thumb {

      background-color: #a9c5ff;

      border-radius: 10px;

    }



    /* Firefox scrollbar styling */

    .vertical-tabs .nav-pills {

      scrollbar-width: thin;

      scrollbar-color: #a9c5ff transparent;

    }



 .vertical-tabs .nav-link {

    text-align: left;

    display: flex;

    align-items: center;

    gap: 1rem;

    padding: 1.25rem 1.25rem;

    border-radius: 10px;

    background: #f7f7f7;

    color: #1c2331;

    font-weight: 600;

    font-size: 1rem;

    border: 2px solid transparent;

    /* box-shadow: 0 2px 6px rgb(0 0 0 / 0.05); */

    transition: background-color 0.3s, box-shadow 0.3s, border-color 0.3s;

    cursor: pointer;

    user-select: none;

}

   .vertical-tabs .nav-link:hover:not(.active) {

    background-color: #fff8f9;

    /* box-shadow: 0 4px 12px rgb(0 0 0 / 0.1); */

    color: #b71c2b;

}



.vertical-tabs .nav-link.active {

    background: linear-gradient(45deg, #c62334, #a81523);

    color: white;

    font-weight: 700;

/*    border-color: #ad1726;*/

    /* box-shadow: 0 6px 20px rgb(13 110 253 / 0.4); */

}

.vertical-tabs .nav-link.active {

    background: linear-gradient(45deg, #c62334, #a81523);

}

    /* Step circle */

 .vertical-tabs .step-circle {

    width: 40px;

    height: 40px;

    border-radius: 50%;

    background-color: #bd1f2f;

    color: #ffffff;

    font-weight: 900;

    font-size: 1.2rem;

    display: flex

;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    transition: background-color 0.3s, color 0.3s;

    /* box-shadow: 0 2px 6px rgb(0 0 0 / 0.1); */

}

    .vertical-tabs .nav-link.active .step-circle {

      background-color: white;

      color: #ae1826;

    }



    /* Tab content container */

   .vertical-tabs  .tab-content {

        width: 70%;

      flex-grow: 1;

      padding: 1.5rem 2rem;

      background: #f7f7f7;

      border-radius: 10px;

/*      box-shadow: 0 8px 25px rgb(0 0 0 / 0.1);*/

      font-size: 1rem;

      line-height: 1.6;

      color: #495057;

      min-height: 420px;

    }



    .vertical-tabs .tab-content p {

      font-weight: 500;

      font-size: 1.1rem;

      color: #212529;

      margin-bottom: 1rem;

    }



    .vertical-tabs .tab-content ul {

      list-style: inside disc;

      padding-left: 1rem;

    }



.vertical-tabs .tab-content ul li {

    margin-bottom: 0.6rem;

    color: var(--theme-paracolor);

    font-weight: 300;

    position: relative;

    margin-left: 10px;

}

.vertical-tabs .tab-content ul li i {

    font-size: 13px;

    position: absolute;

    left: -24px;

    top: 7px;

}

    /* Responsive adjustments */

    @media (max-width: 767.98px) {

      .vertical-tabs {

        flex-direction: column;

        padding: 1rem;

      }

      .vertical-tabs .nav-pills {

        flex-direction: row;

        width: 100%;

        max-height: none;

        overflow-x: auto;

        padding-right: 0;

        border-right: none;

        border-bottom: 1px solid #dee2e6;

        margin-bottom: 1rem;

        gap: 12px;

      }

      .vertical-tabs .nav-pills .nav-link {

        flex: 1 0 auto;

        justify-content: center;

        font-size: 0.9rem;

        padding: 0.6rem 0.75rem;

        border-radius: 10px;

        box-shadow: none;

      }

      .vertical-tabs .tab-content {

          width: 100%;

        min-height: auto;

        padding: 1rem 1.25rem;

      }

      .vertical-tabs .step-circle {

        width: 30px;

        height: 30px;

        font-size: 1rem;

      }

    }

.dropdown-menu div#accordion {

    width: 680px;

    padding: 8px;

    padding-bottom: 0px;

}

      .how-work .step-box:hover {

    background: #484848;

}

  .how-work .icon-circle img {

    max-width: 52px;

}

.how-work {

    position: relative;

}

.how-work .step-line {

        position: absolute;

    top: 206px;

    left: 10%;

    right: 0;

    height: 2px;

    border-top: 2px dotted #333;

    z-index: 0;

    width: 70%;

/*

    text-align: center;

    margin: auto;

*/

    }

.how-work .icon-circle.orange {

    background: #fff;

    border-color: #bcb9b9;

}

.how-work .step-item {

      text-align: center;

      position: relative;

      z-index: 1;

    }



.how-work .icon-circle {

     width: 90px;

    height: 90px;

      border-radius: 50%;

      margin: 0 auto 15px;

      display: flex;

      align-items: center;

      justify-content: center;

      background: white;

      border: 8px solid;

    }

.how-work .icon-circle.blue {

    background: #fff;

    border-color: #bcb9b9;

}

 .how-work .icon-circle.purple {

    background: #fff;

    border-color: #bcb9b9;

}

 .how-work .icon-circle.magenta {

    background: #c12232;

    border-color: #bcb9b9;

}

.how-work .magenta i.icon.bi.bi-patch-check {

    color: #fff;

}

/*

       .ripple {

    position: relative;

    text-decoration: none;

    color: #fff;



    background-color: 0 0 10px rgb(144 7 19 / 44%);

    margin: 0 auto;

    border-radius: 50%;

    -webkit-animation: ripple 1s linear infinite;

    animation: ripple 1s linear infinite;

}



@-webkit-keyframes ripple {

  0% {

    -webkit-box-shadow: 0 0 10px rgb(144 7 19 / 5%), 0 0 10px rgb(144 7 19 / 5%), 0 0 10px rgb(144 7 19 / 5%), 0 0 10px rgb(144 7 19 / 5%);

            box-shadow: 0 0 10px rgb(144 7 19 / 5%), 0 0 10px rgb(144 7 19 / 5%), 0 0 10px rgb(144 7 19 / 5%), 0 0 10px rgb(144 7 19 / 5%);

  }

  100% {

    -webkit-box-shadow: 0 0 0 10px rgb(144 7 19 / 20%), 0 0 0 30px rgb(144 7 19 / 20%), 0 0 0 60px rgb(144 7 19 / 20%), 0 0 0 90px rgb(144 7 19 / 20%);

            box-shadow: 0 0 0 10px rgb(144 7 19 / 20%), 0 0 0 30px rgb(144 7 19 / 20%), 0 0 0 60px rgb(144 7 19 / 20%), 0 0 0 90px rgb(144 7 19 / 20%);

  }

}

@keyframes ripple {

  0% {

    -webkit-box-shadow: 0 0 0 0 rgb(144 7 19 / 20%), 0 0 0 10px rgb(144 7 19 / 20%), 0 0 0 30px rgb(144 7 19 / 20%), 0 0 0 60px rgb(144 7 19 / 20%);

            box-shadow: 0 0 0 0 rgb(144 7 19 / 20%), 0 0 0 10px rgb(144 7 19 / 20%), 0 0 0 30px rgb(144 7 19 / 20%), 0 0 0 60px rgb(144 7 19 / 20%);

  }

  100% {

    -webkit-box-shadow: 0 0 10px rgb(144 7 19 / 20%), 0 0 10px rgb(144 7 19 / 20%), 0 0 10px rgb(144 7 19 / 20%), 0 0 10px rgb(144 7 19 / 20%);

            box-shadow: 0 0 0 10px rgb(144 7 19 / 20%), 0 0 0 30px rgb(144 7 19 / 20%), 0 0 0 60px rgb(144 7 19 / 20%), 0 0 0 90px rgb(144 7 19 / 20%);

  }

}



*/

.how-work .step-box.magenta {

    border: 7px solid #900713;

    box-shadow: 4px 6px 8px #c3c0c0;

    background: #900713;

/*

    min-height: 120px;

    margin-top: 52px;

*/

    align-items: center;

    justify-content: center;

    display: flex;

}

.how-work .step-box.magenta::before {

    height: 57px;

    top: -65px;

    border-left: 2px dotted #c02131;

}

.how-work .step-box.magenta::after {

    top: -46px;

    width: 15px;

    height: 15px;

}

.how-work .step-number.orange::before {

    content: '';

    position: absolute;

    top: -20px;

    border: 2px dotted #333;

    width: 80px;

    height: 80px;

    left: -19px;

    right: 0;

    text-align: center;

    border-radius: 50px;

    z-index: -1;

}

.how-work .step-number.blue::before {

    content: '';

    position: absolute;

    top: -20px;

    border: 2px dotted #333;

    width: 80px;

    height: 80px;

    left: -19px;

    right: 0;

    text-align: center;

    border-radius: 50px;

    z-index: -1;

}

.how-work .step-number.purple::before {

    content: '';

    position: absolute;

    top: -20px;

    border: 2px dotted #333;

    width: 80px;

    height: 80px;

    left: -19px;

    right: 0;

    text-align: center;

    border-radius: 50px;

    z-index: -1;

}

.how-work .step-number.magenta.text-dark {

    display: none;

}

.how-work .step-box {

    padding: 20px;

    border-radius: 10px;

    color: white;

    font-weight: 600;

    margin-top: 60px;

    min-height: 140px;

        padding-top: 30px;

    position: relative;

    transition: 0.3s;

        font-size: 16px;

    font-weight: 500;

}

.step-box.magenta.ripple {

    padding-top: 18px;

}

.how-work .step-box::Before {

    content: '';

    position: absolute;

    top: -60px;

    border-left: 2px dotted #333;

    right: 0;

    height: 60px;

    text-align: center;

    display: block;

    margin: 0 auto;

    left: 50%;

    bottom: 0;

}

.how-work .step-box::after {

        content: '';

    position: absolute;

    top: auto;

    border: 2px solid #bc1f2f;

    left: 0;

    right: 0;

    bottom: 165px;

    height: 12px;

    width: 12px;

    border-radius: 30px;

    background: #bc1f2f;

    text-align: center;

    margin: auto;

}

.vyntra-oem a.theme-btn {
    padding: 10px 40px;
    width: auto;
    padding-left: 14px;

}

.how-work .step-number:hover {

    background: #ad1826;

    color: #fff !important;

}

.how-work .step-number {

    margin-top: 10px;

    background: white;

        width: 50px;

    height: 50px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-left: auto;

    margin-right: auto;

    font-weight: bold;

    position: relative;

    bottom: 32px;

    border: 4px solid white;

    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.1);

    left: 0;

    right: 0;

    text-align: center;

    color: #282828 ! IMPORTANT;

    transition: 0.3s;

}

.step-item:hover .step-number {

    background: #b11a28;

    color: #fff !important;

}

/* Specific colors */

    .orange { background: linear-gradient(to right top, #910816, #9f111e, #ad1826, #bb1f2e, #c92637); border-color: #ffffff; color: #fff !important;}

    .blue { background: linear-gradient(to right top, #910816, #9f111e, #ad1826, #bb1f2e, #c92637); border-color: #ffffff; color: #fff !important;}

    .purple { background: linear-gradient(to right top, #910816, #9f111e, #ad1826, #bb1f2e, #c92637); border-color: #ffffff;color: #fff !important; }

    .magenta { background: linear-gradient(to right top, #910816, #9f111e, #ad1826, #bb1f2e, #c92637); border-color: #ffffff; color: #fff !important;}

.icon {

    font-size: 40px;

    color: #ba1e2d;

}





.contact-form-design input {

    text-transform: capitalize ! IMPORTANT;

}

h2.step-content {

    position: absolute;

    top: 30%;

    left: 0;

    right: 12%;

    z-index: 0;

    font-size: 15px;

    font-weight: bold;

    transform: translateY(12%);

}