
section.create_innovate_produce_services {
    padding: 60px 0;
    position: relative;
}
.res_cip_service {
    display: none;
}

.ui-container.lazy {
    margin-top: -30px;
}



	
@media screen and (min-width: 1025px){
section.create_innovate_produce_services:after {
    display: none;
}
.vvdn_engineering_bg{
	position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: url(../images/vvdn_engineering_bg1.png) no-repeat top left;
    z-index: 0;
    background-size: cover;
}

.vvdn_cloud_bg{
	position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: url(../images/vvdn_cloud_bg2.png) no-repeat top left;
    z-index: 0;
    background-size: cover;
}

.vvdn_manufacturing_bg{
	position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: url(../images/vvdn_manufacturing_bg3.png) no-repeat top left;
    z-index: 0;
    background-size: cover;
}

section.create_innovate_produce_services {
    padding: 60px 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
}

/** Section 2 **/
.section-container-2{
	height: 100vh;
	background: #fff;
	overflow: hidden;
}

.section-container-2 .panel-1 .img-1{
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.section-container-2 .panel-1 .title-1{
	bottom: 23%;
}

.section-container-2 .panel-1 .title-2{
    bottom: 5%;
    font-family: "Graphik Light","Arial",Sans-Serif;
    font-size: 1.25rem;
    line-height: 1.5vw;
}

.section-container-2 .panel-2 .title-1{
    font-size: 1.275rem;
    line-height: 1.275rem;
}

.section-container-2 .panel-2 .white-bg{
	position: absolute;
    top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	opacity: 0;
	transition: opacity 0.6s ease 0.2s;
}

.section-container-2 .panel-2 .white-bg.isactive{
	opacity: 0.8;
}

.section-container-2 .panel-2 .img-3{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.section-container-2 .panel-2 .cta-more {
    color: #004DFF;
    position: absolute;
	width: auto;
	padding: 10px;
	bottom: 10%;
	right: 43%;
	transform: translateY(50%);
	z-index: 10;
	opacity: 0;
}

.section-container-2 .panel-3 .cta-more-1 {
    color: #004DFF;
    position: absolute;
	width: auto;
	padding: 10px;
	bottom: 8.8em;
	z-index: 10;
	opacity: 0;
	transition: opacity 0.6s ease;
}

.section-container-2 .panel-3 .cta-more-2 {
    color: #004DFF;
    position: absolute;
	width: auto;
	padding: 10px;
	bottom: 6em;
	z-index: 10;
	opacity: 0;
	transition: opacity 0.6s ease;
}

.section-container-2 .panel-1 .cta-more {
    color: #004DFF;
    position: absolute;
	width: auto;
	bottom: -85%;
	left: 50%;
	transform: translateX(-50%);
	z-index: 10;
	opacity: 0;
    padding: 10px;
}

.section-container-2 .panel-1 .cta-more.isactive .cta-more-box {
    border: 1px solid #004DFF !important;
}

.section-container-2 .cta-more.isactive{
	opacity: 1;
}

.cta-more {
    cursor: pointer;
}

.section-container-2 .cta-more .cta-more-box {
	position: absolute;
    left: 20px;
    top: 20px;
    width: 5px;
    height: 5px;
	border-radius: 50%;
	transition: all 0.4s ease;
}

.section-container-2 .cta-more.isactive .cta-more-box {
    left: 0;
    top: 7px;
	width: 36px;
    height: 36px;
    border: 1px solid #004DFF;
	border-radius: 50px;
	transition-delay: 0.2s;
}

.section-container-2 .cta-more.isactive:hover .cta-more-box{
    height: 36px;
	border-radius: 25px 25px 25px 25px;
}

.section-container-2 .cta-more .cta-more-arrow {
	position: absolute;
	left: 0px;
    top: 3px;
	opacity: 0;
	transition: all 0.4s ease;
}

.section-container-2 .cta-more.isactive .cta-more-arrow {
    position: absolute;
    left: 20px;
    top: 3px;
	opacity: 1;
	transition-delay: 0.6s;
}

.section-container-2 .cta-more.isactive .cta-more:hover .cta-more-arrow {
	 left: 10px;
}

.section-container-2 .cta-more .img-arrow-right{
	width: 24px;
}

.section-container-2 .cta-more .cta-more-label {
	margin-left: 45px;
	opacity: 0;
	transition: opacity 0.7s ease 0.8s;
}

.section-container-2 .cta-more.isactive .cta-more-label{
	opacity: 1;
}

.section-container-2 .cta-scroll{
	color: #C3C3C3;
}

.section-container-2 .cta-scroll.isactive .cta-scroll-box{
	border: 2px solid #C3C3C3;
}

.section-container-2 .cta-scroll .cta-scroll-arrow{
	position: absolute;
    transform: rotate(0deg);
    left: 4px;
    top: 5px;
    transition-delay: 0.6s;
}

.section-container-2 .cta-scroll.position-1{
	bottom: -65%;
}

.IE .section-container-2 .panel-1 .img-1{
	background-image: url('/_acnmedia/Thought-Leadership-Assets/Images/mainpage/accenture-dancing-gurl-bg');
	background-position: center center;
	background-size: 60%;
	background-repeat: no-repeat;
	position: relative;
	width: 100%;
}

/** Section 1**/

.panel{
	margin: 0px;
	padding: 0px;
	width: 100vw;
	height: 100vh;
	position: absolute;
	overflow: hidden;
	background: transparent;
	border: none !important;
	box-shadow: none !important;
}

.section-container-1 .panel{
	transform: translate(0%, 0%) matrix(1, 0, 0, 1, 0, 0);
	transition: transform 0.2s ease;
	opacity: 0;
}

.section-container-1 .panel.isactive{
	opacity: 1;
}

.section-container-1 .panel.slide-up{
	transform: translate(0%, -100%) matrix(1, 0, 0, 1, 0, 0);
}

.panel-1{
	z-index: 4;
}

.panel-2{
	z-index: 3;
}


.panel-1.isactive{
	z-index: 5;
}

.panel-2.isactive{
	z-index: 5;
}

.cta-scroll {
	color: #ffffff;
	position: absolute;
	cursor: pointer;
	width: auto;
	padding: 10px;
	z-index: 10;
	opacity: 0;
	transition: opacity 0.6s ease;
}
.cta-scroll.position-2{
	bottom: 10%;
	right: 10%;
}

.cta-scroll.isactive, .item.active .cta-scroll{
	opacity: 1 !important;
}

.cta-scroll .cta-scroll-box {
	position: absolute;
    transform: translateX(-50%);
    top: 7px;
    left: 50%;
    top: 20px;
    width: 5px;
    height: 5px;
	border-radius: 50%;
	transition: all 0.4s ease;
}

.cta-scroll.isactive .cta-scroll-box, .item.active .cta-scroll .cta-scroll-box {
    left: 50%;
    transform: translateX(-50%);
    top: 7px;
	width: 36px;
    height: 36px;
    border: 1px solid #ffffff;
	border-radius: 50%;
	transition-delay: 0.2s;
}

.cta-scroll .cta-scroll-arrow {
	position: absolute;
	transform: rotate(90deg);
	left: 1px;
    top: -10px;
	opacity: 0;
	transition: all 0.4s ease;
}

.cta-scroll.isactive .cta-scroll-arrow, .item.active .cta-scroll .cta-scroll-arrow {
    position: absolute;
    transform: rotate(90deg);
    left: 1px;
    top: 5px;
    opacity: 1;
	transition-delay: 0.6s;
}

.cta-scroll.isactive .cta-scroll:hover .cta-scroll-arrow {
	 left: 10px;
}

.cta-scroll  .img-arrow-right{
	width: 23px;
}

.cta-scroll .cta-scroll-label {
	width: max-content;
	position: absolute;
	left: 50%;
    transform: translateX(-50%);
    top: -100%;
	opacity: 0;
	transition: opacity 0.7s ease 0.8s;
}

.cta-scroll.isactive .cta-scroll-label, .item.active .cta-scroll .cta-scroll-label{
	opacity: 1;
}

.cta-scroll .cta-scroll-arrow.goDown{
  -webkit-animation-duration: 3.5s;
  animation-duration: 3.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: goDown;
  animation-name: goDown;
}

@-webkit-keyframes goDown {
  0%, 100% {
     -webkit-top: 16px;
  }
  25% {
     -webkit-top: 27px;
}
  50% {
     -webkit-top: 16px;
}
  75% {
    -webkit-top: 27px;
}
}

@keyframes goDown {
  0%, 100% {
    top: 16px;
  }
  25% {
    top: 30px;
}
  50% {
    top: 16px;
}
  75% {
    top: 30px;
}
}
	
/** Section 9**/
.section-container-9a{
	height: 50vh;
	background: #fff;
	overflow: hidden;
}

/** Section 9**/
.section-container-9{
	height: 100vh;
	background: #fff;
	overflow: hidden;
}
.section-container-9 .panel-1{
	z-index: 1;
}
.section-container-9 .panel-2{
	z-index: 2;
}
.section-container-9 .panel-3{
	z-index: 3;
}

.section-container-9 .panel.isactive{
	z-index: 4;
}

.section-container-9 .panel-1 .img-2{
	position: absolute;
	width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -55%);
}

.section-container-9 .panel-2 .img-zoomout{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -55%);
}

.section-container-9 .panel-1 .vid-1{
	width: 100%;
    position: absolute;
    top: 50%;
    left: 47%;
    transform: translate(-50%, -50%);
}


.cta-progress-bar{
	color:#676767; width: 80%; position: relative;
	margin-top: 30px;
}
.progress-bar{
	background-color: #004DFF;
}
.progress-bar-label{
    position: relative;
    right: 17%;
    top: -13px;
    font-size: 1rem;
    color: #4a4a4adb;
}

.section-container-9 .panel-1 .cta-more, .section-container-9 .panel-3 .cta-more {
    color: #004DFF;
    position: absolute;
	width: auto;
	bottom: -85%;
	/*left: 50%;*/
	transform: translateX(-50%);
	z-index: 10;
	opacity: 0;
    padding: 10px;
}

.section-container-9 .panel-3 .cta-more.isactive .cta-more-box {
    border: 1px solid #FFF!important;
}

.section-container-9 .cta-more.isactive{
	opacity: 1;
}

.section-container-9 .cta-more .cta-more-box {
	position: absolute;
    left: 20px;
    top: 20px;
    width: 5px;
    height: 5px;
	border-radius: 50%;
	transition: all 0.4s ease;
}

.section-container-9 .cta-more.isactive .cta-more-box {
    left: 0;
    top: 3px;
	width: 36px;
    height: 36px;
    border: 1px solid #004DFF;
	border-radius: 50px;
	transition-delay: 0.2s;
}


.section-container-9 .cta-more .cta-more-arrow {
	position: absolute;
	left: 0px;
    top: 8px;
	opacity: 0;
	transition: all 0.4s ease;
}

.section-container-9 .cta-more.isactive .cta-more-arrow {
    position: absolute;
    left: 20px;
    top: 8px;
	opacity: 1;
	transition-delay: 0.6s;
}

.section-container-9 .cta-more.isactive .cta-more:hover .cta-more-arrow {
	 left: 10px;
}

.section-container-9 .cta-more .img-arrow-right{
	width: 24px;
}

.section-container-9 .cta-more .cta-more-label {
	margin-left: 45px;
	opacity: 0;
	transition: opacity 0.7s ease 0.8s;
}

.section-container-9 .cta-more.isactive .cta-more-label{
	opacity: 1;
}

.IE .section-container-9 .panel-2 .img-zoomout{
		background-image: url('/_acnmedia/Thought-Leadership-Assets/Images/mainpage/accenture-julie-bg');
		background-position: center center;
		background-size: 60%;
		background-repeat: no-repeat;
		position: relative;
	}
	
}

@media screen and (max-width: 1024px){
	.hidden-lg {
		display: none !important;
	}
	.scrollmagic-pin-spacer {
		display: none !important;
	}
	.res_cip_service {
		display: flex;
	}
	.section-container.section-container-2{
		height: auto;
		overflow: hidden;
	}

	.section-container-2 .panel{
		position: relative;
		height: auto;
	}

	.section-container-2 .panel-1 .img-1{
		background-image: url('/_acnmedia/Thought-Leadership-Assets/Images/mainpage/accenture-dancing-gurl-bg');
		background-position: 300px 100px;
		background-size: 100%;
		background-repeat: no-repeat;
		position: relative;
		width: 120%;
		top: 0%;
		left:-10%;
		transform: none;
	}

	.section-container-2 .panel-1 .height-inherit{
		position: absolute;
		bottom: 10%;
		width: 100%;
	}

	.section-container-2 .panel-2 .img-3{
		width: 150%;
		position: relative;
		top: 0%;
		left: -15%;
		transform: none;
	}

	.section-container-2 .panel-2 .text-container{
		position: absolute;
		top: 0;
		left: 0;
	}
	

}

@media screen and (min-width: 1599px) {
	/* .panel {
		height: 93vh;
	} */
}

/*For Desktop up*/

@media screen and (min-width: 1025px) {
	.mobile-ipad {
		display: none;
	}
	.section-container-3 {
		height: auto;
		max-height: none;
	}
	.section-container-3 .panel-1 {
		height: auto;
		position: relative;
	}
}

@media screen and (max-width: 1024px) {
	div#block-section-3b {
		display: none;
	}
}
@media screen and (max-width: 1040px) {
	#block-section-3b .section-container-2 .panel-2 .animate_title {
		transform: translateY(50%);
	}
}


	
