@charset "utf-8";

@media only screen and (min-width: 479px) {

    .mkyy1, * [aria-labelledby='mkyy1'] {

        display: none !important;

        max-height: none !important;

        overflow: visible !important;

        visibility: hidden;

        position: absolute;

        max-height: 0;

    }

}

.logodtg {

    margin-top: 20px

}

	.bannerbottomtext{position: absolute; margin-top: -90px; color: #CFCECE}

.bannerbottomtext1{width: 230px;}

.imgboxc1{position: absolute !important; float: left !important; width: 500px; margin-left: 15px; color: #ecd13f; margin-top: -69px;

  text-align: center;}

.klsp1{font-size: 23px !important}





.rightbrdf{border-right: dashed 1px #595959;}

.rightbrdg{border-left: dashed 1px #595959;}

.idocent{  margin-top: -20px; font-size: 12px; }

@media only screen and (max-width: 479px) {
	  .site-header .site-header-menu {
    padding: 5px 0;
    min-height: auto;
  }
	
	  .site-header .sticky-header .site-branding img {
    max-height: 49px;
  }
	

	.idocent{position: absolute;  margin-top: -20px; font-size: 12px; line-height: 18px}

	.hgjk2{font-size: 12px;}

	.hgjk3{margin-top: -50px}

	.rightbrdf{border-right: none;}

	.rightbrdg{border-left: none;}

	.opfoo{padding: 0 !important;}

    .mo-hi {

        display: none !important;

    }

	.klsp1{font-size: 12px !important}

	.imgboxc1{font-size: 14px;  position: absolute; float: left; width: 250px; margin-left: 15px; color: #fff450 ;   margin-top: -55px;

    line-height: 16px;}

    .logodtg {

        margin-top: -5px

    }

	.bannerbottomtext{position: absolute; margin-top: -43px; line-height: 20px; color: #CFCECE; font-size: 13px}

	.bannerbottomtext1{width: 100px;}

}



.headerti {

	color: #000;

	line-height: 20px;

	text-align: center

}



.headerti:hover {

	color: #c00000;

}



/* CSS Document */

.digitalSection {

    position: relative;

    z-index: 1;

}

.digitalWrapper {

    display: flex;

    justify-content: center;

    flex-direction: column;

    align-items: center;

}

.cards {

    background: #fff;

    padding: 2.0rem 1.8rem 2.3125rem;

    /* border-radius: 0.625rem;*/

    margin-right: 1.1875rem;

    /* min-height: 26.875rem; */

    bottom: 0;

    position: relative;

    transition: all ease .2s;

    z-index: inherit;

    position: relative;

    display: block;

    height: 500px;

}

.cards.margin0 {

    margin-right: 0;

}

.cards:after {

    content: '';

    height: 370px;

    width: 100%;

    background: #FFC14D;

    position: absolute;

    top: 0;

    left: 0;

    border-radius: 0.625rem;

    z-index: -1;

    transition: all ease .2s;

}

.cards:hover {

    background-color: #FEFFF0;

    bottom: 0.625rem;

}

.cards:hover

.cards:hover::after {

    background-color: #a10000;

    top: 0.625rem;

}

.cards h5 {

    font-size: 18px;

    line-height: 2.25rem;

    margin-bottom: 7px;

    font-weight: 700;

    letter-spacing: 0;

}

.cards p {

    color: #434343;

    font-size: 15px;

    line-height: 24px;

}

.cards svg {

    width: auto;

    height: 5rem;

    margin-bottom: 1.5rem;

}

.digitaCards {

    display: flex;

}

.digitaCards.w50 {

    /* width: 50%; */

    padding-top: 2.9375rem;

    gap: 0;

    margin-bottom: 0.625rem;

    /* justify-content: center; */

}

.digitaCards.w50 .cards {

    width: 50%;

    min-width: 22.75rem;

    max-width: 22.75rem;

    margin-bottom: 0.5625rem;

}

.digitalSolutionHead {

    display: flex;

    /* justify-content: space-between; */

    margin-top: 1.4375rem;

    /* margin-bottom: 1.4375rem; */

}

.headerContent {

    /* width: 50%; */

}

.headerContent {

    width: 47.9rem;

    /* width: 50%; */

    /* display: flex;

		flex-direction: column;

		justify-content: center; */

    padding-top: 5.875rem;

}

.headerContent h4 {

    font-size: 3.125rem;

    line-height: 4rem;

    font-weight: 700;

    width: 80%;

    margin-top: 1.625rem;

}

.cards svg .digitcircle-big {

    transform: scale(1) rotate(0deg) translate(-1.416px, 0.083px);

    transition: transform 0.35s;

    transform-origin: 38px 23px;

}

.cards:hover svg .digitcircle-big {

    transform: scale(1.06) rotate(60deg) translate(-1.416px, -9.917px);

    transition: transform 0.35s;

}

.cards:hover svg .digitcircle-big #Ellipse_499 {

    fill: #17cba6;

}

.cards svg .smallcircle {

    transition: transform 0.35s;

}

.cards:hover svg .smallcircle {

    transition: transform 0.3s;

    transform: translateY(31px);

}

.cards svg .cloudcircle {

    transition: transform 0.35s;

}

.cards svg .cloudcircle {

    transform: translate(45.82px, 1.464px) rotate(0deg) scale(1);

    transition: all 0.3s;

}

.cards:hover svg .cloudcircle {

    transform: translate(65.82px, -16.536px) rotate(40deg) scale(0.85);

    transition: all 0.3s;

}

.cards:hover svg .cloudcircle-small {

    fill: #17cba6;

}

.cards svg .cloudlines {

    transform: translate(0px, 1px);

    transition: all 0.3s;

}

.cards:hover svg .cloudlines {

    transform: translate(0px, 4px);

    transition: all 0.3s;

}

.cards svg .sasscircle circle {

    transition: all 0.3s;

}

.cards:hover svg .sasscircle circle {

    fill: #17cba6;

    transition: all 0.7s;

    ;

}

.cards svg #Group_101220 {

    transition: all 0.7s;

    ;

}

.cards span.explore-icon svg {

    max-width: 10px;

    height: auto;

    margin-bottom: 0px;

}

.cards a.explore-more-link {

    font-size: 1.125rem;

    color: #120862;

    font-weight: 600;

    margin-top: 8px;

    display: inline-block;

}

.cards span.explore-icon {

    margin-left: 5px;

}

.cards:hover svg #Path_107876 {

    fill: #fecd2a;

}

.cards svg .car {

    transform: translate(23.537px, 7.77px) scale(0.9);

    transition: all 0.3s;

}

.cards:hover svg .car {

    transform: translate(32.537px, 7.77px) scale(0.9);

    transition: all 0.7s;

    ;

}

.cards:hover svg #Path_107969 {

    fill: #fd6968;

    transition: all 0.3s;

}

.cards:hover svg #Path_107971 {

    fill: #17cba6;

    transition: all 0.3s;

}

.cards:hover svg #Path_108168 {

    fill: #17cba6;

    transition: all 0.3s;

}

.cards:hover svg #Union_39, .cards:hover svg #Union_40 {

    fill: #17cba6;

    transition: all 0.3s;

}

.cards:hover svg #Ellipse_482, .cards:hover svg #Ellipse_482-2 {

    fill: #fecd2a;

    transition: all 0.3s;

}

@media screen and (max-width: 840px) {

    .cards a.explore-more-link {

        font-size: inherit;

    }

    .digitalSection {

        padding-top: 30px;

        padding-bottom: 40px;

    }

    .digitalSolutionHead {

        flex-wrap: wrap;

    }

    .headerContent {

        width: 100%;

        padding-top: 0;

    }

    .digitaCards {

        flex-wrap: wrap;

    }

    .cards {

        width: 50%;

    }

}

@media screen and (max-width: 1024px) {

    .cta {

        font-size: 12px;

        padding: 7px 17px;

        border-radius: 45px;

        min-width: 114px;

    }

    .cards {

        width: 100%;

    }

    .digitaCards.w50 {

        width: 100%;

        flex-wrap: wrap;

        padding-top: 0;

    }

    .headerContent h4 {

        font-size: 16px;

        line-height: 23px;

        width: 100%;

        margin-bottom: 20px;

    }

    .digitaCards.w50 .cards {

        width: 100%;

        max-width: inherit;

        min-width: inherit;

        margin-right: 0;

        padding: 24px 20px;

        margin-bottom: 10px;

    }

    .digitaCards .cards {

        width: 100%;

        max-width: inherit;

        min-width: inherit;

        margin-right: 0;

        padding: 24px 20px;

        margin-bottom: 10px;

    }

    .digitaCards svg {

        width: 50px;

        height: 50px;

        margin-bottom: 20px;

    }

    .digitaCards h5 {

        font-size: 18px;

        line-height: 22px;

        margin-bottom: 20px;

    }

    .digitaCards p {

        font-size: 14px;

        line-height: 26px;

    }

}

@media screen and (min-width: 820px) and (max-device-width: 1024px) {

    .digitalSolutionHead {

        flex-wrap: wrap;

    }

    .digitaCards.w50 .cards {

        width: 48%;

        margin-right: 10px;

    }

    .digitaCards {

        flex-wrap: wrap;

    }

    .digitaCards .cards {

        width: 48%;

        margin-right: 10px;

    }

}

@media screen and (max-width: 768px) {

    .flex {

        display: flex;

        align-items: center;

    }

    .flex h5 {

        margin-left: 15px;

    }

}