body {
	overflow-x: hidden;
}

section.approach-section {
	position: relative;
	padding:0;
	z-index: 15;
	width: 100%;
	overflow: hidden;
}

section.approach-expertise {
	position: relative;
	z-index: 10;
}

.svg-div {
	position: absolute;
	width: 612.417px;
	left: 50%;
	margin-left: -306px;
}

.approach-modal .modal-dialog{
	margin-top: 5%;
}

.approach-modal .modal-body {
	height: 540px;
	overflow-y: scroll;
}

.approach-modal .modal-body img {
	width: 80%;
	margin: 15px auto;
	display: block;

}



/*SECTION 1*/

section.section-1 {
	background-image: url(../images/approach-banner-bg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	padding: 180px 0 120px;
}

.svg-1 {
	bottom: 0px;
	height: 274.412px;
	width: 612.417px;
}

.svg-1 svg {
	position: relative;
	bottom:-1px;
}

.svg-1 .square-1 {
	stroke-dasharray: 1481;
  stroke-dashoffset: 1481;
}

.svg-1.animated .square-1 {
	animation: dash 1.5s linear;
	-webkit-animation: dash 1.5s linear;	 
  	stroke-dashoffset: 0;
}

.layer-1-content {
	margin: 0 auto;
}

.layer-1-content h1 {
	width: 570px;
	margin: auto;
	text-align: center;
	line-height: 54px;
}

.layer-1-content p {
	width: 485px;
	text-align: left;
	margin: 55px auto 0;
	color: #fff;
	// opacity: 0;
	// -webkit-transform: translateY(45px);
	// -moz-transform: translateY(45px);
	// -o-transform: translateY(45px);
	// transform: translateY(45px);
	// -webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	// -moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	// -o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	// transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	// transition-delay: .08s;
}

// .layer-1-content p.animated {
// 	-webkit-transform: translateY(0px);
// 	-moz-transform: translateY(0px);
// 	-o-transform: translateY(0px);
// 	transform: translateY(0px);
// 	opacity: 1;
// }

/*SECTION 2*/

.section-2 {
	height: 840px;
}

.animated.section-2 {
	height: 780px;
}

.section-2 .container {
	position: relative;
	height: 100%;
}

.svg-2-path-1 {
	top: 0px;
	height: 160px;
}

.svg-2-circle {
	top: 135px;
}

.svg-2-path-2 {
	bottom: 0;
	height: 90px;
}

.svg-div.svg-2-path-3 {
	position: absolute;
	top: 407px;
	width: 103px;
	left: 222px;
	margin-left: 0px;
}

.svg-div.svg-2-path-4 {
	position: absolute;
	top: 407px;
	left: 856px;
	width: 93px;
	margin-left: 0px;
}

.svg-2-path-1 .line-1 {
	stroke-dasharray: 160;
	stroke-dashoffset: 160;
}

.animated .svg-2-path-1 .line-1 {
	animation: dash-1 0.25s linear;
  	stroke-dashoffset: 0;

}

.svg-2-circle .outer-circle-1, .svg-2-circle .outer-circle-2{
	stroke-dasharray: 875;
	stroke-dashoffset: 875;
	transition-delay: 0.25s;
}

.animated .svg-2-circle .outer-circle-1 {
	animation: dash-2 0.9s linear;
	stroke-dashoffset: 0;
	animation-delay: 0.25s;
}

.animated .svg-2-circle .outer-circle-2 {
	animation: dash-3 0.9s linear;
	stroke-dashoffset: 0;
	animation-delay: 0.25s;
}

.svg-2-circle .inner-circle-1, .svg-2-circle .inner-circle-2 {
	stroke-dasharray: 837;
	stroke-dashoffset: 837;
	transition-delay: 0.25s;
}

.animated .svg-2-circle .inner-circle-1 {
	stroke-dashoffset: 0;
	animation: dash-4 0.85s linear;
	animation-delay: 0.25s;
}

.animated .svg-2-circle .inner-circle-2 {
	stroke-dashoffset: 0;
	animation: dash-5 0.85s linear;
	animation-delay: 0.25s;
}

.svg-2-circle .circle-water {
	opacity: 0;
}

.animated .svg-2-circle .circle-water {
	opacity: 1;
	transition: opacity 0.5s ease;
	transition-delay: 1s;
}

.svg-2-path-3 .line-1 {
	stroke-dasharray: 103;
	stroke-dashoffset: 103;
	transition-delay: 1.7s;
}

.animated .svg-2-path-3 .line-1 {
	stroke-dashoffset: 0;
	animation: dash-6 0.15s linear;
	animation-delay: 1.7s;
}

.svg-2-path-4 .line-1 {
	stroke-dasharray: 93;
	stroke-dashoffset: 93;
	transition-delay: 1.7s;
}

.animated .svg-2-path-4 .line-1 {
	stroke-dashoffset: 0;
	animation: dash-7 0.15s linear;
	animation-delay: 1.7s;
}

.svg-2-path-2 .line-1 {
	stroke-dasharray: 90;
	stroke-dashoffset: 90;
	transition-delay: 2.35s;
}

.animated .svg-2-path-2 .line-1 {
	stroke-dashoffset: 0;
	animation: dash-8 0.2s linear;
	animation-delay: 2.15s;
}

.layer-2-content {
	padding: 70px 0 95px;
	position: relative;
}

.layer-2-content h2 {
	text-align: center;
    position: relative;
    z-index: 100;
    width: 20%;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    padding: 5px 0;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	transition-delay: 0.25s;
}

.animated .layer-2-content h2 {
	opacity: 1;
}

.layer-2-content h3 {
	text-align: center;
}

.layer-2-content .circle-txt, .layer-2-content .your-personality, .layer-2-content .their-personality {
	opacity: 0;
	-webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 1.4s;
}

.layer-2-content .your-personality, .layer-2-content .their-personality {
	transition-delay: 1.85s;
}

.animated .layer-2-content .circle-txt,
 .animated .layer-2-content .your-personality,
 .animated .layer-2-content .their-personality {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}


.circle-txt h3{
	margin-top: 150px;
    width: 240px;
    margin-left: auto;
    margin-right: auto;
}

.circle-txt p {
	width: 450px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 7px;
}


.your-personality, .their-personality {
	position: absolute;
	width: 280px;
	top:307px;
}

.their-personality {
	right: 0;
}

.your-personality img, .their-personality img {
	display: block;
	margin:0 auto 20px;
}

.your-personality p, .their-personality p {
	font-size: 14px;
}


/* section 3 */

section.section-3 {
	height: 890px;
}

.svg-3-path-1 {
	height: 80px;
	top:0;
}

.svg-3-circle {
	top: 120px;
	margin-left: -311px;
}

.svg-3-path-2 {
	height: 73px;
	bottom: 0;
}

.svg-3-path-1 .line-1 {
	stroke-dasharray: 80;
	stroke-dashoffset: 80;
}

.animated .svg-3-path-1 .line-1 {
	animation: dash-9 0.15s linear;
  	stroke-dashoffset: 0;

}

.svg-3-circle .line-1 {
	stroke-dasharray: 55;
	stroke-dashoffset: 55;
	transition-delay: 0.4s;
}

.animated .svg-3-circle .line-1 {
	animation: dash-10 0.1s linear;
  	stroke-dashoffset: 0;
  	animation-delay: 0.4s;
}

.svg-3-circle .left-path {
	stroke-dasharray: 690;
	stroke-dashoffset: 690;
	transition-delay: 0.55s;
}

.animated .svg-3-circle .left-path {
	animation: dash-11 0.8s linear;
	stroke-dashoffset: 0;
	animation-delay: 0.5s;
}
.svg-3-circle .right-path {
	stroke-dasharray: 617.67;
	stroke-dashoffset: 617.67;
	transition-delay: 0.55s;
}

.animated .svg-3-circle .right-path {
	animation: dash-12 0.8s linear;
	stroke-dashoffset: 0;
	animation-delay: 0.5s;
}

.svg-3-circle .circle-opacity {
	opacity: 0;
	-webkit-transition: opacity 0.7s ease-in-out;
	-moz-transition: opacity 0.7s ease-in-out;
	-o-transition: opacity 0.7s ease-in-out;
	transition: opacity 0.7s ease-in-out;
	transition-delay: 1.3s;
}

.animated .svg-3-circle .circle-opacity {
	opacity: 1;
}

.svg-3-circle .circle-path {
	stroke-dasharray: 86;
	stroke-dashoffset: 86;
	transition-delay: 2.6s;
}

.animated .svg-3-circle .circle-path {
	stroke-dashoffset: 0;
	animation: dash-13 0.1s linear;
	animation-delay: 2.6s;
}

.svg-3-path-2 .line-1 {
	stroke-dasharray: 73;
	stroke-dashoffset: 73;
	transition-delay: 2s;
}

.animated .svg-3-path-2 .line-1 {
	stroke-dashoffset: 0;
	animation: dash-14 0.1s linear;
	animation-delay: 2s;
}

.layer-3-content {
	padding: 80px 0;
}

.layer-3-content h2 {
	color: #fff;
    background: #161B22;
    text-align: center;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 100;
    padding: 5px 0;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	transition-delay: 0.13s;
}

.animated .layer-3-content h2 {
	opacity: 1;
}

.layer-3-content .circle-txt, .layer-3-content .tool-txt {
	opacity: 0;
	-webkit-transform: translateY(45px);
	-moz-transform: translateY(45px);
	-o-transform: translateY(45px);
	transform: translateY(45px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 2s;
}


.layer-3-content .tool-txt {
	transition-delay: 2.8s;
}


.animated .layer-3-content .circle-txt, .animated .layer-3-content .tool-txt {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.layer-3-content .circle-txt h3 {
	margin-top: 125px;
	width: 215px;
	text-align: center;
	color: #fff;
}

.layer-3-content .circle-txt p {
	width: 352px;
	color: #fff;
	margin-bottom: 20px;
}

.layer-3-content .circle-txt a {
	text-align: center;
    width: 220px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    color: #fff;
    text-decoration: underline;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
}

.layer-3-content .circle-txt a:hover {
	text-decoration: none;
	color: #aaa;
}

.tool-txt {
	border-left: 5px solid #fff;
    padding-left: 10px;
    position: absolute;
}

.layer-3-content .tool-txt {
	width: 280px;
    bottom: 170px;
}

.layer-3-content .tool-txt h3 {
	color: #fff;
	margin: 0;
	line-height: 28px;
}


/* SECTION 4 */

section.section-4{
	height: 988px;
}

.svg-4-path-1 {
	height: 80px;
}

.svg-4-brain {
	height: 735.086px;
    margin-left: -310px;
	top: 265px;
}

.svg-4-path-1 .line-1 {
	stroke-dasharray: 80;
	stroke-dashoffset: 80;
}

.animated .svg-4-path-1 .line-1 {
	animation: dash-9 0.15s linear;
  	stroke-dashoffset: 0;

}

.svg-4-brain svg {
	opacity: 0;
	-webkit-transition: opacity 0.5s ease-in-out;
	-moz-transition: opacity 0.5s ease-in-out;
	-o-transition: opacity 0.5s ease-in-out;
	transition: opacity 0.5s ease-in-out;
	transition-delay: 0.6s;
}

.animated .svg-4-brain svg {
	opacity: 1;
}

.svg-4-brain .red-brain,
.svg-4-brain .yellow-brain,
.svg-4-brain .gree-brain,
.svg-4-brain .blue-brain {
	stroke: #afafaf;
	-webkit-transition: stroke 0.3s ease-in-out;
	-moz-transition: stroke 0.3s ease-in-out;
	-o-transition: stroke 0.3s ease-in-out;
	transition: stroke 0.3s ease-in-out;
}

.svg-4-brain .red-brain {
	transition-delay: 1.3s;
}

.animated .svg-4-brain .red-brain {
	stroke: #ed1c24;
}

.svg-4-brain .yellow-brain {
	transition-delay: 1.8s;
}

.animated .svg-4-brain .yellow-brain {
	stroke: #f1c10d;
}

.svg-4-brain .blue-brain {
	transition-delay: 2.3s;
}

.animated .svg-4-brain .blue-brain {
	stroke: #00adee;
}

.svg-4-brain .green-brain {
	transition-delay: 2.8s;
}

.animated .svg-4-brain .green-brain {
	stroke: #49af47;
}

.svg-4-brain .red-fill,
.svg-4-brain .yellow-fill,
.svg-4-brain .green-fill,
.svg-4-brain .blue-fill {
	fill: #afafaf;
	-webkit-transition: fill 0.3s ease-in-out;
	-moz-transition: fill 0.3s ease-in-out;
	-o-transition: fill 0.3s ease-in-out;
	transition: fill 0.3s ease-in-out;
}

.svg-4-brain .red-fill {
	transition-delay: 1.3s;
}

.animated .svg-4-brain .red-fill {
	fill: #ed1c24;
}

.svg-4-brain .yellow-fill {
	transition-delay: 1.8s;
}

.animated .svg-4-brain .yellow-fill{
	fill: #f1c10d;
}

.svg-4-brain .blue-fill {
	transition-delay: 2.3s;
}

.animated .svg-4-brain .blue-fill{
	fill: #00adee;
}

.svg-4-brain .green-fill {
	transition-delay: 2.8s;
}

.animated .svg-4-brain .green-fill{
	fill: #49af47;
}

.layer-4-content {
	padding: 85px 0;
	position: relative;
}

.layer-4-content h2 {
	width: 400px;
    background: #fff;
    position: relative;
    z-index: 100;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 5px 0;
    opacity: 0;
    -webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 0.15s;
}

.animated .layer-4-content h2 {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.layer-4-content p {
	width: 460px;
    margin-left: 380px;
    opacity: 0;
    -webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 0.15s;
}

.animated .layer-4-content p {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.color-txt {
	width: 260px;
	display: block;
	position: absolute;
}

.color-txt p {
	margin-left: 0;
	width: 100%;
}

.red-txt {
	top: 400px;
	left: 0;
	opacity: 0;
	-webkit-transform: translatX(100px);
	-moz-transform: translatX(100px);
	-o-transform: translatX(100px);
	transform: translateX(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 1.3s;
}

.animated .red-txt, .animated .yellow-txt, .animated .blue-txt, .animated .green-txt {
	opacity: 1;
	-webkit-transform: translatX(0px);
	-moz-transform: translatX(0px);
	-o-transform: translatX(0px);
	transform: translateX(0px);
}

.red-txt h3 {
	color: #ed1c24;
}

.yellow-txt {
	top: 400px;
	right: 0;
	opacity: 0;
	-webkit-transform: translatX(-100px);
	-moz-transform: translatX(-100px);
	-o-transform: translatX(-100px);
	transform: translateX(-100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 1.8s;
}

.yellow-txt h3 {
	color: #f2c20e;
}

.green-txt {
	top: 650px;
	left: 0;
	opacity: 0;
	-webkit-transform: translatX(100px);
	-moz-transform: translatX(100px);
	-o-transform: translatX(100px);
	transform: translateX(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 2.8s;
}

.green-txt h3 {
	color: #49af47;
}

.blue-txt {
	top: 650px;
	right: 0;
	opacity: 0;
	-webkit-transform: translatX(-100px);
	-moz-transform: translatX(-100px);
	-o-transform: translatX(-100px);
	transform: translateX(-100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 2.3s;
}

.blue-txt h3 {
	color: #00adee;
}


/* SECTION 5*/

.section-5 {
	height: 1080px;
}

.svg-5-path-1 {
	height: 380px;
}

.svg-5-square {
	position: absolute;
    top: 302px;
    width: 1378px;
    height: 779.142px;
    left: 50%;
    margin-left: -682px;
}

.svg-5-path-2 {
	height: 292.49px;
	bottom: 0px;
	position: absolute;
}

.svg-5-path-1 .line-1 {
	stroke-dasharray: 380;
	stroke-dashoffset: 380;
}

.animated .svg-5-path-1 .line-1 {
	animation: dash-20 0.5s linear;
  	stroke-dashoffset: 0;

}

.svg-5-square .polyline-1 {
	stroke-dasharray: 2243;
	stroke-dashoffset: 2243;
	transition-delay: -0.1s;
}

.animated .svg-5-square .polyline-1 {
	animation: dash-21 2.4s linear;
  	stroke-dashoffset: 0;
  	animation-delay: -0.1s;
}

.svg-5-square .polyline-2 {
	stroke-dasharray: 2251;
	stroke-dashoffset: 2251;
	transition-delay: 0.6s;
}

.animated .svg-5-square .polyline-2 {
	animation: dash-22 2.4s linear;
  	stroke-dashoffset: 0;
  	animation-delay: 0.6s;
}

.svg-5-path-2 .line-1 {
	stroke-dasharray: 292.49;
	stroke-dashoffset: 292.49;
	transition-delay: 2.3s;
}

.animated .svg-5-path-2 .line-1 {
	animation: dash-23 0.3s linear;
  	stroke-dashoffset: 0;
  	animation-delay: 2.3s;
}

.layer-5-content {
	padding: 80px 0;
	position: relative;
}

.layer-5-content h2 {
	width: 300px;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    background: #161B22;
    position: relative;
    z-index: 100;
    padding: 10px 0;
    opacity: 0;
    -webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 0.3s;
}

.layer-5-content h3 {
	width: 200px;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    background: #161B22;
    position: relative;
    z-index: 100;
    opacity: 0;
    -webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 0.3s;
}


.layer-5-content p {
	width: 455px;
    margin: 0 auto;
    text-align: left;
    color: #fff;
    background: #161B22;
    position: relative;
    z-index: 100;
    padding: 5px 0 10px;
    opacity: 0;
    -webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 0.3s;
}

.animated .layer-5-content h2,
.animated .layer-5-content h3,
.animated .layer-5-content p {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.style-list {
	margin-top: 110px;
}

.style-list ul {
	margin: 0 30px 40px;
}

.style-list ul li {
	width: 16%;
	text-align: center;
	color: #fff;
}

.style-list ul li img {
	display: block;
	margin: 0 auto 10px;
	-webkit-transform: translateY(75px);
	-moz-transform: translateY(75px);
	-o-transform: translateY(75px);
	transform: translateY(75px);
	-webkit-transition: -webkit-transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
	-moz-transition: -moz-transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
	-o-transition: -o-transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
	transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
	opacity: 0;
}

.style-list ul li span {
	opacity: 0;
	-webkit-transform: translateY(75px);
	-moz-transform: translateY(75px);
	-o-transform: translateY(75px);
	transform: translateY(75px);
	-webkit-transition: -webkit-transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
	-moz-transition: -moz-transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
	-o-transition: -o-transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
	transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
}

.animated .style-list ul li img, .animated .style-list ul li span {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.style-list ul li.list-1 img {
	transition-delay: 2.4s;
}

.style-list ul li.list-1 span {
	transition-delay: 2.5s;
}

.style-list ul li.list-2 img {
	transition-delay: 2.5s;
}

.style-list ul li.list-2 span {
	transition-delay: 2.6s;
}

.style-list ul li.list-3 img {
	transition-delay: 2.6s;
}

.style-list ul li.list-3 span {
	transition-delay: 2.7s;
}
.style-list ul li.list-4 img {
	transition-delay: 2.7s;
}

.style-list ul li.list-4 span {
	transition-delay: 2.8s;
}
.style-list ul li.list-5 img {
	transition-delay: 2.8s;
}

.style-list ul li.list-5 span {
	transition-delay: 2.9s;
}

.style-list ul li.list-6 img {
	transition-delay: 2.9s;
}

.style-list ul li.list-6 span {
	transition-delay: 3.0s;
}

.style-list ul li.list-7 img {
	transition-delay: 3s;
}

.style-list ul li.list-7 span {
	transition-delay: 3.1s;
}

.style-list ul li.list-8 img {
	transition-delay: 3.1s;
}

.style-list ul li.list-8 span {
	transition-delay: 3.2s;
}

.style-list ul li.list-9 img {
	transition-delay: 3.2s;
}

.style-list ul li.list-9 span {
	transition-delay: 3.3s;
}
.style-list ul li.list-10 img {
	transition-delay: 3.3s;
}

.style-list ul li.list-10 span {
	transition-delay: 3.4s;
}

.style-list ul li.list-11 img {
	transition-delay: 3.4s;
}

.style-list ul li.list-11 span {
	transition-delay: 3.5s;
}
.style-list ul li.list-12 img {
	transition-delay: 3.5s;
}

.style-list ul li.list-12 span {
	transition-delay: 3.6s;
}

.layer-5-content .tool-txt {
	width: 350px;
	bottom: -82px;
	transition-delay: 6.3s;
    opacity: 0;
	-webkit-transform: translateY(40px);
	-moz-transform: translateY(40px);
	-o-transform: translateY(40px);
	transform: translateY(40px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 4.5s;
}

.layer-5-content .tool-txt h3 {
	text-align: left;
	width: auto;
	opacity: 0;
	-webkit-transform: translateY(40px);
	-moz-transform: translateY(40px);
	-o-transform: translateY(40px);
	transform: translateY(40px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 4.5s;
	line-height: 28px;
}


.layer-5-content .style-txt {
	position: absolute;
    bottom: -126px;
    right: 40px;
    width: 420px;
    opacity: 0;
	-webkit-transform: translateY(40px);
	-moz-transform: translateY(40px);
	-o-transform: translateY(40px);
	transform: translateY(40px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 4s;
}


.layer-5-content .style-txt p {
	width: 420px;
	opacity: 0;
	-webkit-transform: translateY(40px);
	-moz-transform: translateY(40px);
	-o-transform: translateY(40px);
	transform: translateY(40px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 4s;
}

.layer-5-content .style-txt p a {
	color: #fff;
	text-decoration: underline;
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.layer-5-content .style-txt p a:hover {
	color: #aaa;
	text-decoration: none;
}

.animated .layer-5-content .style-txt,
.animated .layer-5-content .style-txt p,
.animated .layer-5-content .tool-txt,
.animated .layer-5-content .tool-txt h3
 {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}
/* Section 6 */

.section-6 {
	height: 1030px;
}

.svg-6-path-1 {
	height: 160px;
}

.svg-6-circle {
	top: 117px;
}

.svg-6-path-2 {
	bottom: 0;
	height: 90px;
}

.svg-6-path-1 .line-1 {
	stroke-dasharray: 160;
	stroke-dashoffset: 160;
}

.animated .svg-6-path-1 .line-1 {
	animation: dash-1 0.25s linear;
  	stroke-dashoffset: 0;

}

.svg-6-circle .outer-circle-1, .svg-6-circle .outer-circle-2{
	stroke-dasharray: 875;
	stroke-dashoffset: 875;
	transition-delay: 0.25s;
}

.animated .svg-6-circle .outer-circle-1 {
	animation: dash-2 0.9s linear;
	stroke-dashoffset: 0;
	animation-delay: 0.25s;
}

.animated .svg-6-circle .outer-circle-2 {
	animation: dash-3 0.9s linear;
	stroke-dashoffset: 0;
	animation-delay: 0.25s;
}

.svg-6-circle .inner-circle-1, .svg-6-circle .inner-circle-2 {
	stroke-dasharray: 837;
	stroke-dashoffset: 837;
	transition-delay: 0.25s;
}

.animated .svg-6-circle .inner-circle-1 {
	stroke-dashoffset: 0;
	animation: dash-4 0.85s linear;
	animation-delay: 0.25s;
}

.animated .svg-6-circle .inner-circle-2 {
	stroke-dashoffset: 0;
	animation: dash-5 0.85s linear;
	animation-delay: 0.25s;
}

.svg-6-circle .circle-water {
	opacity: 0;
	transition: opacity 0.5s ease;
	transition-delay: 1.1s;
}

.animated .svg-6-circle .circle-water {
	opacity: 1;
}

.svg-6-path-2 .line-1 {
	stroke-dasharray: 90;
	stroke-dashoffset: 90;
	transition-delay: 3s;
}

.animated .svg-6-path-2 .line-1 {
	stroke-dashoffset: 0;
	animation: dash-8 0.2s linear;
	animation-delay: 3s;
}

.layer-6-content {
	padding: 70px 0;
	position: relative;
}

.layer-6-content h2 {
	text-align: center;
    position: relative;
    z-index: 100;
    width:180px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    padding: 5px 0;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	transition-delay: 0.2s;
}

.animated .layer-6-content h2 {
	opacity: 1;
}

.layer-6-content .circle-txt {
	position: relative;
	margin-top: 240px;
	opacity: 0;
	-webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 1.5s;
}

.animated .layer-6-content .circle-txt {
	webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.layer-6-content .circle-txt h3 {
	margin-top: 0;
	color: #fff;
	width: 170px;
}

.layer-6-content .circle-txt p {
	width: 300px;
	color: #fff;
}

.layer-6-content .char-txt {
	position: absolute;
}

.layer-6-content .char-txt img {
	margin-bottom: 12px;
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.layer-6-content .char-txt h3 {
	text-align: center;
}

.layer-6-content .char-txt{
	opacity: 0;
	-webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-o-transform: translateY(100px);
	transform: translateY(100px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.animated .layer-6-content .char-txt {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}


.layer-6-content .char-1 {
	left: 0;
	top: 230px;
	transition-delay: 1.9s;
}

.layer-6-content .char-1 h3{
	width: 140px;
}

.layer-6-content .char-2 {
	top: 230px;
	right: 0;
	transition-delay: 1.9s;
}

.layer-6-content .char-2 h3 {
	width: 165px;
}

.layer-6-content .char-3 {
	left: 60px;
	transition-delay: 2.3s;
}

.layer-6-content .char-3 h3 {
	width: 200px;
}

.layer-6-content .char-4 {
	right: 45px;
	transition-delay: 2.3s;
}

.layer-6-content .char-4 h3 {
	width: 240px;
}

.layer-6-content .char-5 {
	top: 730px;
	left: 50%;
	margin-left: -120px;
	transition-delay: 2.7s;
}

.layer-6-content .char-5 h3 {
	width: 240px;
}

/*SECTION 7*/

.section-bg {
	background-image: url(../images/approach-bg-1.jpg);
	background-size: cover;
	background-position: 50% 100%;
}

.section-7 {
	height: 933px;
}

.svg-7-path-1 {
	height: 300px;
}

.svg-7-square {
	top: 250px;
	margin-left: -332px;
}

.svg-7-square svg {
	width: 695px;
	height: auto;
}

.svg-7-path-2 {
	height: 80px;
	bottom: 0;
}

.svg-7-path-1 .line-1 {
	stroke-dasharray: 300;
	stroke-dashoffset: 300;
}

.animated .svg-7-path-1 .line-1 {
	animation: dash-15 0.5s linear;
  	stroke-dashoffset: 0;
}

.svg-7-square .polygon-1 {
	stroke-dasharray: 1092;
	stroke-dashoffset: 1092;
}

.animated .svg-7-square .polygon-1 {
	animation: dash-16 1.5s linear;
  	stroke-dashoffset: 0;
}

.svg-7-square .polygon-2 {
	stroke-dasharray: 1092;
	stroke-dashoffset: 1092;
	transition-delay: 0.5s;
}

.animated .svg-7-square .polygon-2 {
	animation: dash-17 1.5s linear;
  	stroke-dashoffset: 0;
  	animation-delay: 0.5s;
}

.svg-7-path-2 .line-1 {
	stroke-dasharray: 80;
	stroke-dashoffset: 80;
	transition-delay: 1.5s;
}

.animated .svg-7-path-2 .line-1 {
	animation: dash-9 0.15s linear;
  	stroke-dashoffset: 0;
  	animation-delay: 1.5s;
}


.layer-7-content {
	padding: 70px 0 0;
	position: relative;
}

.layer-7-content h2 {
	background: #353A40;
    width: 270px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 0px;
    padding-top: 5px;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	transition-delay: 0.25s;
}

.animated .layer-7-content h2 {
	opacity: 1;
}


.layer-7-content p {
	background: #353A40;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: 450px;
    color: #fff;
    margin-top: 0;
    padding: 12px 0;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	transition-delay: 0.25s;
}

.animated .layer-7-content p {
	opacity: 1;
}

.layer-7-content .circle-txt {
	margin-top: 145px;
	opacity: 0;
	-webkit-transform: translateY(45px);
	-moz-transform: translateY(45px);
	-o-transform: translateY(45px);
	transform: translateY(45px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 1.7s;
}

.animated .layer-7-content .circle-txt {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.layer-7-content .circle-txt h3 {
	margin-top: 0;
	color: #fff;
	width: 135px;
	text-align: center;
	margin-bottom: 0;
}

.layer-7-content .circle-txt p {
	background: none;
	width: 280px;
	font-size: 16px;
	left: 15px;
}

.layer-7-content .square-txt {
	position: absolute;
	top: 361px;
    width: 380px;
    height: 430px;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100%;
    opacity: 0;
	-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.5s ease-in-out;
	-moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.5s ease-in-out;
	-o-transition: -o-transform 0.2s ease-in-out, opacity 0.5s ease-in-out;
	transition: transform 0.2s ease-in-out, opacity 0.5s ease-in-out;
	transition-delay: 2.2s;
}

.animated .layer-7-content .square-txt{
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-o-transform: translateX(0px);
	transform: translateX(0px);
	opacity: 1;
	background-size: 98%;
}

.layer-7-content .square-txt img {
    display: block;
   	margin-top: 40px;
    margin-bottom: 10px;
}

.layer-7-content .square-txt h3 {
	color: #fff;
    text-align: center;
    margin-bottom: 0;
}

.layer-7-content .square-txt p {
	font-size: 14px;
	background: none;
	width: 230px;
	padding: 5px 0;
}

.layer-7-content .react-txt {
	left: -25px;
	background-image: url(../images/left-rect.png);
	-webkit-transform: translateX(100px);
	-moz-transform: translateX(100px);
	-o-transform: translateX(100px);
	transform: translateX(100px);
}

.layer-7-content .react-txt img {
	margin-left: 193px;
}

.layer-7-content .react-txt h3{
	margin-left: 50px;
}

.layer-7-content .react-txt p {
	margin-left: 105px;
}

.layer-7-content .respond-txt {
	right: -33px;
	background-image: url(../images/right-rect.png);
	-webkit-transform: translateX(-100px);
	-moz-transform: translateX(-100px);
	-o-transform: translateX(-100px);
	transform: translateX(-100px);
}

.layer-7-content .respond-txt img {
	margin-left: 143px;
}

.layer-7-content .respond-txt h3{
	margin-right: 35px;
}

.layer-7-content .respond-txt p {
	margin-left: 67px;
}


 .safari .section-7 {
    height: 890px;
    } 
  .safari .svg-7-square{
    top: 253px;
    margin-left: -333px;
  }

  .safari .layer-7-content .square-txt {
    top: 337px;
  }

  .safari .layer-7-content .react-txt {
    left: -1px;
  }

  .safari .layer-7-content .respond-txt {
    right: -11px;
  }
/*SECTION 8*/

.section-8 {
	height: 880px;
}

.svg-8-path-1 {
	height: 163px;
}

.svg-8-circle {
	top: 165px;
}

.svg-8-path-2 {
	height: 80px;
	bottom: 0;
}

.svg-8-path-1 .line-1 {
	stroke-dasharray: 160;
	stroke-dashoffset: 160;
}

.animated .svg-8-path-1 .line-1 {
	animation: dash-1 0.25s linear;
  	stroke-dashoffset: 0;

}

.layer-8-content {
	padding-top: 70px;
	position: relative;
}

.layer-8-content h2{
	text-align: center;
    position: relative;
    z-index: 100;
    width: 260px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    padding: 5px 0;
	-webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	transition-delay: 0.25s;
	opacity: 0;
}


.animated .layer-8-content h2 {
	opacity: 1;
}

.layer-8-content .circle-txt {
	margin-top: 170px;
}

.layer-8-content .circle-txt img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.layer-8-content .circle-txt h3 {
	width: 220px;
	text-align: center;
	margin-top: 15px;
}

.layer-8-content .circle-txt p {
	width: 420px;
}

.svg-8-circle .pause {
	position: absolute;
    top: 4px;
    left: 50%;
    margin-left: -23px;
    background: #fff;
}

.svg-8-circle .play {
	position: absolute;
    left: 50%;
    margin-left: -23px;
    background: #fff;
    bottom: 7px;
}

/*SECTION 9*/

.section-9 {
	height: 727px;
}

.svg-9-path-1 {
	height: 80px;
}

.svg-9-circle {
	top: 42px;
    margin-left: -307px;
}

.svg-9-path-1 .line-1 {
	stroke-dasharray: 80;
	stroke-dashoffset: 80;
}

.animated .svg-9-path-1 .line-1 {
	animation: dash-9 0.15s linear;
  	stroke-dashoffset: 0;
}

.svg-9-circle .polyline-1, .svg-9-circle .polyline-2 {
	stroke-dasharray: 1467;
	stroke-dashoffset: 1467;
	transition-delay: 0.15s;
}

 .svg-9-circle .polyline-2 {
 	transition-delay: -0.35s;
 }

.animated .svg-9-circle .polyline-1{
	animation: dash-18 1.5s linear;
  	stroke-dashoffset: 0;
  	animation-delay: 0.15s;
}

.animated .svg-9-circle .polyline-2 {
	animation: dash-19 1.5s linear;
  	stroke-dashoffset: 0;
  	animation-delay: -0.35s;
}

.svg-9-circle .outer-circle-1,
.svg-9-circle .outer-circle-2,
.svg-9-circle .inner-circle-1,
.svg-9-circle .inner-circle-2,
 .svg-9-circle .polyline-3 {
	opacity: 0;
	-webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	transition-delay: 1.2s;
}

.svg-9-circle .inner-circle-1, .svg-9-circle .inner-circle-2 {

	transition-delay: 1.35s;
}

.svg-9-circle .polyline-3 {
	transition-delay: 2s;
}

.animated .svg-9-circle .outer-circle-1,
.animated .svg-9-circle .outer-circle-2,
.animated .svg-9-circle .inner-circle-1,
.animated .svg-9-circle .inner-circle-2,
.animated .svg-9-circle .polyline-3  {
	opacity: 1;
}

.layer-9-content .circle-txt {
	margin-top: 250px;
	opacity: 0;
	-webkit-transform: translateY(45px);
	-moz-transform: translateY(45px);
	-o-transform: translateY(45px);
	transform: translateY(45px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition-delay: 1.7s;
}

.animated .layer-9-content .circle-txt {
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

.layer-9-content .circle-txt h2 {
	width: 200px;
    text-align: center;
    color: #fff;
    margin-left: auto;
    margin-right: auto;
}

.layer-9-content .circle-txt p {
	color: #fff;
	width: 288px;
}

/* Section 10 */

section.section-10 {
	position: relative;
	background: #fff;
	opacity: 1;
	-webkit-transition:opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
	z-index: 10;
}

.section-10 section {
	position: fixed;
	top: 50%;
	left: 0;
	right: 0;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	opacity: 0;
}

.section-10 section.active {
	opacity: 1;
}

.section-10 .section-10-personal {
	z-index: 1;
}

.section-10 .section-10-professional {
	z-index: 2;
}

.section-10 .section-10-organizational {
	z-index: 3;
}

.bg-div {
	display: block;
  position: absolute;
  right: 0px;
  width: 50%;
  height: 100%;
  background-color: #f9f9f9;
}

.layer-10-content, .layer-10-image {
	margin: 40px;
	min-height: 500px;
}


.layer-10-content ul {
	padding-left: 15px;
	list-style-image: url(../images/list.png);
}

.layer-10-content ul li{
 	vertical-align: middle;
 	padding-left: 5px;
 	padding-bottom: 7px;
 }

 .layer-10-image {
 	margin: 0 0 60px;
 	position: relative;
 	height: 100%;
 }

.person-1 {
	width: 219px;
    height: 252px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -108.5px;
    margin-top: -126px;
    background: url(../images/square-big.png);
}

.person-1 img {
	display: block;
	margin: 42px auto;
}

.person {
	width: 125px;
	height: 145px;
	background-image: url(../images/square-small.png);
	position: absolute;
	opacity: 0;
	-webkit-transform: translateY(45px);
	-moz-transform: translateY(45px);
	-o-transform: translateY(45px);
	transform: translateY(45px);
	-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.person img {
	display: block;
	margin: 32px auto;
}

.person-2 {
	top: 13px;
	left: 155px;
	transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;
}

.person-3 {
	top: 39.5px;
	left: 322px;
	transition-delay: 0.4s;
	-webkit-transition-delay: 0.4s;
}

.person-4 {
	top: 151px;
	left: 41.5px;
	transition-delay: 1.2s;
	-webkit-transition-delay: 1.2s;
}

.person-5 {
	left: 389px;
	top: 205px;
	transition-delay: 0.6s;
	-webkit-transition-delay: 0.6s;
}

.person-6 {
	top: 316px;
	left: 108px;
	transition-delay: 1s;
	-webkit-transition-delay: 1s;
}

.person-7 {
	top: 342.5px;
	left: 277px;
	transition-delay: 0.8s;
	-webkit-transition-delay: 0.8s;
}


section.active .person {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
}

/*Approach Expertise*/

.approach-expertise.expertise .expertise-items a div {
	background-color: #fff;
}

.expertise.approach-expertise h2 {
	color: #fff;
}

.expertise.approach-expertise .row {
	margin-bottom: 15px;
}

.expertise .expertise-items a div p {
	width: 100%;
}

.expertise.approach-expertise p{
	font-size: 16px;
    color: #fff;
    margin-top: 10px;
    text-align: left;
    width: 540px;
    margin-left: auto;
    margin-right: auto;
}

.expertise.approach-expertise a {
	color: #fff;
	text-decoration: underline;
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
}

.expertise .expertise-items a div p {
	margin-top: 0;
}

.expertise.approach-expertise p a:hover {
	color: #aaa;
	text-decoration: none;
}

.footer {
	position: relative;
	z-index: 15;
}

.approach-expertise a .more, .approach-expertise a .less {
	text-align: left;
}

.approach-content a .more , .approach-expertise a .more {
	display: none;
}

.approach-content a .less, .approach-expertise a .less {
	display: block;
}

.approach-content a.collapsed .more, .approach-expertise a.collapsed .more{
	display: block;
}

.approach-content a.collapsed .less, .approach-expertise a.collapsed .less{
	display: none;
}

.approach-content a i, .approach-expertise a i {
	margin-left: 6px;
}

.approach-expertise a .less {
	margin-top: 15px;
}

.animated .approach-scroll {
	display: none;
}

.approach-scroll {
	margin: 20px 0;
}

.approach-scroll .s-down a {
	cursor: pointer;
}

.approach-scroll .s-down a span {
	font-size: 14px;
	display: block;
	color: #333;
    text-decoration: none;
}

.approach-scroll .s-down a i {
    font-size: 40px;
    line-height: 0.7;
    -webkit-animation:shake-ani .7s ease-in-out infinite;
    -moz-animation:shake-ani .7s ease-in-out infinite;
	-o-animation:shake-ani .7s ease-in-out infinite;
    animation:shake-ani .7s ease-in-out infinite;
    -webkit-animation-play-state: initial;
    -moz-animation-play-state: initial;
	-o-animation-play-state: initial;
    animation-play-state: initial;
    color: #333;
    display: inline-block;
}
@supports (-ms-accelerator:true) {
	.arrow polygon {
	  	display: none;
	}
}

@media all and (min-width: 992px) and (max-width: 1200px) {
	.svg-div.svg-2-path-3 {
		left: 181px;
	    width: 45px;
	    overflow: hidden;
	}

	.svg-div.svg-2-path-4 {
	    left: 755px;
	    width: 36px;
	    overflow: hidden;
	}

	.your-personality, .their-personality {
		width: 200px;
	}

	.layer-4-content p {
		margin-left: 280px;
	}

	.color-txt {
		width: 170px;
	}

	.color-txt p {
		margin-left: 0;
	}

	.layer-5-content .style-txt {
		width: 380px;
		bottom: -155px;
	}

	.layer-5-content .style-txt p {
		width: 380px;
	}

	.layer-6-content .char-3 {
		left: 35px;
	}

	.layer-6-content .char-4 {
		right: -3px;
	}

	.layer-7-content .react-txt {
		left: -103px;
	}

	.layer-7-content .respond-txt {
		right: -113px;
	}

	


	.person-2 {
		top:13px;
		left: 104px;
	}

	.person-3 {
		top: 39px;
    	left: 272px;
	}

	.person-4 {
		top: 151px;
    	left: -9px;
	}

	.person-5 {
		left: 339px;
    	top: 205px;
	}

	.person-6 {
		top: 317px;
    	left: 58px
	}

	.person-7 {
		top: 343px;
		left: 226px;
	}

	.section-7 {
		height: 905px;
	}

	.svg-7-square {
	    top: 253px;
	    margin-left: -314.3px;
	}

	.svg-7-square svg {
		width: 660px;
		height: auto;
	}

	.layer-7-content .square-txt {
		top: 347px;
	}

	.layer-7-content .react-txt {
		left: -107px;
	}

	.layer-7-content .respond-txt {
		right: -116px;
	}

	.safari .svg-7-square{
	    margin-left: -316px;
	  }

	  .safari .layer-7-content .react-txt {
	    left: -101px;
	  }

	  .safari .layer-7-content .respond-txt {
	    right: -110px;
	  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.svg-1 .square-1,
	.svg-2-path-1 .line-1,
	.svg-2-circle .outer-circle-1,
	.svg-2-circle .outer-circle-2,
	.svg-2-circle .inner-circle-1,
	.svg-2-circle .inner-circle-2,
	.svg-2-path-2 .line-1,
	.svg-2-path-3 .line-1,
	.svg-2-path-4 .line-1,
	.svg-3-path-1 .line-1,
	.svg-3-path-2 .line-1,
	.svg-3-circle .line-1,
	.svg-3-circle .left-path,
	.svg-3-circle .right-path,
	.svg-3-circle .circle-path,
	.svg-4-path-1 .line-1,
	.svg-5-path-1 .line-1,
	.svg-5-square .polyline-1,
	.svg-5-square .polyline-2,
	.svg-5-path-2 .line-1,
	.svg-6-path-1 .line-1,
	.svg-6-circle .outer-circle-1,
	.svg-6-circle .outer-circle-2,
	.svg-6-circle .inner-circle-1,
	.svg-6-circle .inner-circle-2,
	.svg-7-path-1 .line-1,
	.svg-7-square .polygon-1,
	.svg-7-square .polygon-2,
	.svg-7-path-2 .line-1,
	.svg-6-path-2 .line-1,
	.svg-8-path-1 .line-1,
	.svg-9-path-1 .line-1,
	.svg-9-circle .polyline-1,
	.svg-9-circle .polyline-2{
	  stroke-dashoffset: 0;
	  transition-delay: 0;
	  -webkit-transition-delay: 0;
	}

	.svg-1.animated .square-1,	
	.animated .svg-2-path-1 .line-1,
	.animated .svg-2-circle .outer-circle-1,
	.animated .svg-2-circle .outer-circle-2,
	.animated .svg-2-circle .inner-circle-1,
	.animated .svg-2-circle .inner-circle-2,
	.animated .svg-2-path-2 .line-1,
	.animated .svg-2-path-3 .line-1,
	.animated .svg-2-path-4 .line-1,
	.animated .svg-3-path-1 .line-1,
	.animated .svg-3-path-2 .line-1,
	.animated .svg-3-circle .line-1,
	.animated .svg-3-circle .left-path,
	.animated .svg-3-circle .right-path,
	.animated .svg-3-circle .circle-path,
	.animated .svg-4-path-1 .line-1,
	.animated .svg-5-path-1 .line-1,
	.animated .svg-5-square .polyline-1,
	.animated .svg-5-square .polyline-2,
	.animated .svg-5-path-2 .line-1,
	.animated .svg-6-path-1 .line-1,
	.animated .svg-6-circle .outer-circle-1,
	.animated .svg-6-circle .outer-circle-2,
	.animated .svg-6-circle .inner-circle-1,
	.animated .svg-6-circle .inner-circle-2,
	.animated .svg-6-path-2 .line-1,
	.animated .svg-7-path-1 .line-1,
	.animated .svg-7-square .polygon-1,
	.animated .svg-7-square .polygon-2,
	.animated .svg-7-path-2 .line-1,
	.animated .svg-8-path-1 .line-1,
	.animated .svg-9-path-1 .line-1,
	.animated .svg-9-circle .polyline-1,
	.animated .svg-9-circle .polyline-2 {
		 animation: none;
	}

	.svg-2-circle .circle-water,
	.svg-3-circle .circle-opacity,
	.svg-4-brain svg,
	.svg-6-circle .circle-water,
	.svg-9-circle .outer-circle-1,
	.svg-9-circle .outer-circle-2,
	.svg-9-circle .inner-circle-1,
	.svg-9-circle .inner-circle-2,
	.svg-9-circle .polyline-3 {
		opacity: 1;
	}

	.layer-1-content p,
	.layer-2-content h2, 
	.layer-2-content .circle-txt, 
	.layer-2-content .your-personality, 
	.layer-2-content .their-personality,
	.layer-3-content h2,
	.layer-3-content .circle-txt,
	.layer-3-content .tool-txt,
	.layer-4-content h2,
	.layer-4-content p,
	.layer-5-content h2,
	.layer-5-content h3,
	.layer-5-content p,
	.layer-6-content h2,
	.layer-6-content .circle-txt,
	.layer-9-content .circle-txt,
	.layer-8-content h2,
	.layer-7-content h2,
	.layer-7-content p,
	.layer-7-content .circle-txt {		
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);		
	}
	.svg-1 .square-1 {
		z-index: 10;
	}

	.layer-1-content{
		z-index: 1;
	}

	.red-txt {
		transition-delay: 0.1s;
	}

	.yellow-txt {
		transition-delay: 0.25s;
	}

	.blue-txt {
		transition-delay: 0.4s;
	}

	.green-txt {
		transition-delay: 0.55s;
	}

	.style-list ul li.list-1 img {
		transition-delay: 0.1s;
	}

	.style-list ul li.list-2 img {
		transition-delay: 0.2s;
	}

	.style-list ul li.list-3 img {
		transition-delay: 0.3s;
	}

	.style-list ul li.list-4 img {
		transition-delay: 0.4s;
	}

	.style-list ul li.list-5 img {
		transition-delay: 0.5s;
	}

	.style-list ul li.list-6 img {
		transition-delay: 0.6s;
	}

	.style-list ul li.list-7 img {
		transition-delay: 0.7s;
	}

	.style-list ul li.list-8 img {
		transition-delay: 0.8s;
	}

	.style-list ul li.list-9 img {
		transition-delay: 0.9s;
	}

	.style-list ul li.list-10 img {
		transition-delay: 1s;
	}

	.style-list ul li.list-11 img {
		transition-delay: 1.1s;
	}

	.style-list ul li.list-12 img {
		transition-delay: 1.2s;
	}

	.style-list ul li.list-1 span {
		transition-delay: 0.15s;
	}

	.style-list ul li.list-2 span {
		transition-delay: 0.25s;
	}

	.style-list ul li.list-3 span {
		transition-delay: 0.35s;
	}

	.style-list ul li.list-4 span {
		transition-delay: 0.45s;
	}

	.style-list ul li.list-5 span {
		transition-delay: 0.55s;
	}

	.style-list ul li.list-6 span {
		transition-delay: 0.65s;
	}

	.style-list ul li.list-7 span {
		transition-delay: 0.75s;
	}

	.style-list ul li.list-8 span {
		transition-delay: 0.85s;
	}

	.style-list ul li.list-9 span {
		transition-delay: 0.95s;
	}

	.style-list ul li.list-10 span {
		transition-delay: 1.05s;
	}

	.style-list ul li.list-11 span {
		transition-delay: 1.15s;
	}

	.style-list ul li.list-12 span {
		transition-delay: 1.25s;
	}

	.layer-5-content .style-txt, .layer-5-content .style-txt p {
		transition-delay: 1.5s;
	}	
	
	.layer-5-content .tool-txt, .layer-5-content .tool-txt h3 {
		transition-delay: 1.8s;
	}

	.layer-6-content .char-1, .layer-6-content .char-2 {
		transition-delay: 0.15s;
	}

	.layer-6-content .char-3, .layer-6-content .char-4 {
		transition-delay: 0.3s;
	}

	.layer-6-content .char-5 {
		transition-delay: 0.45s;
	}

	.svg-7-square svg {
		width: 100%;
	}

	.section-7.section-bg {
		background-position: 50% 70%; 
	}

	.svg-7-square svg {
		width: 695px;
		height: 684px;
	}

	.layer-7-content .square-txt {
		transition-delay: 0.25s;
	}

	.svg-8-circle .arrow {
		display: none;
	}

}


@media all and (-ms-high-contrast: none) and (min-width: 992px) and (max-width: 1200px),
all and (-ms-high-contrast: active) and (min-width: 992px) and (max-width: 1200px){
	.svg-7-square {
		top: 253px;
		margin-left: -332.3px;
	}
	
	.svg-7-square svg {
		height: 647px;
	}

}

/*mobile portrait*/
@media only screen and (max-width: 768px) and (min-width: 320px), 
screen and (device-width : 960px) and (orientation: landscape) {

	section.approach-section {
		padding: 50px 0;
	}

	section.section-1 {
		background: #2b3037;
		padding: 120px 0 50px;
	}

	section.approach-section  {
		height: auto !important;
	}

	.layer-1-content h1 {
		font-size: 24px;
		line-height: 30px;
		width: auto;
		text-align: left;
	}

	.approach-section h2,
	.layer-9-content .circle-txt h2 {
		opacity: 1;
	    text-align: left;
	    margin: 0;
	    width: auto;
	    font-size: 22px;
	    line-height: 30px;
	    padding: 0;
	    font-weight: 700;
	    -webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}

	.approach-section h3,
	.layer-3-content .circle-txt h3,
	.layer-5-content .tool-txt h3,
	.layer-6-content .circle-txt h3,
	.layer-6-content .char-txt h3,
	.layer-7-content .circle-txt h3,
	.layer-7-content .square-txt h3,
	.layer-8-content .circle-txt h3 {
		margin: 10px 0 0;
	    font-size: 18px;
	    line-height: 22px;
	    text-align: left;
	    width: auto;
	    -webkit-transform: translateX(0px);
		-moz-transform: translateX(0px);
		-o-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}

	.approach-section p, 
	.layer-3-content .circle-txt p,
	.layer-5-content .style-txt p,
	.layer-6-content .circle-txt p,
	.layer-7-content .circle-txt p,
	.layer-7-content .square-txt p,
	.layer-8-content .circle-txt p,
	.layer-9-content .circle-txt p,
	.expertise.approach-expertise p {
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
		opacity: 1;
		font-size: 14px;
		margin-top: 10px;
		width: auto;
		text-align: left;
		padding:0;
		margin-left: 0;
		margin-right: 0;
		line-height: 22px;
		left: 0;
	}

	.approach-section a,
	.layer-3-content .circle-txt a {
		width: auto;
		text-align: left;
		font-size: 14px;
	}

	div.approach-content {
		padding: 0;
	}

	.layer-2-content .circle-txt, 
	.layer-2-content .your-personality, 
	.layer-2-content .their-personality,
	.layer-3-content .circle-txt, 
	.layer-3-content .tool-txt,
	.layer-6-content .circle-txt,
	.layer-5-content .style-txt,
	.layer-5-content .tool-txt,
	.layer-5-content .style-txt,
	.layer-7-content .circle-txt,
	.layer-9-content .circle-txt {
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
		opacity: 1;
	}

	.layer-2-content .your-personality, 
	.layer-2-content .their-personality {
		position: relative;
		top: 0;
		width: auto;
		margin-top: 25px;
	}

	.your-personality img, .their-personality img {
		margin: 15px auto;
		width: 100px;
	}

	.layer-3-content .tool-txt {
		position: relative;
		top: 0;
		margin-top: 28px;
		width: auto;
	}

	.color-txt,
	.layer-6-content .char-txt,
	.layer-7-content .square-txt {
		width: auto;		
		top:0;
		left: 0;
		position: relative;
		margin:0;
		margin-bottom: 20px;
		-webkit-transform: translateX(0px);
		-moz-transform: translateX(0px);
		-o-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}

	.blue-txt {
		margin-bottom: 0;
	}

	.svg-4-brain {
		height: 350px;
	    width: 100%;
	    position: relative;
	    top: 0;
	    left: 0;
	    margin: 0;
	}	

	.svg-4-brain svg {
		width: 280px;
	    height: 350px;
	    opacity: 1;
	    margin: 0 auto;
	    display: block;
	}

	.svg-4-brain .red-brain {
		stroke: #ed1c24;
	}

	.svg-4-brain .yellow-brain {
		stroke: #f1c10d;
	}

	.svg-4-brain .blue-brain {
		stroke: #00adee;
	}

	.svg-4-brain .green-brain {
		stroke: #49af47;
	}

	.svg-4-brain .red-fill {
		fill: #ed1c24;
	}

	.svg-4-brain .yellow-fill{
		fill: #f1c10d;
	}

	.svg-4-brain .blue-fill{
		fill: #00adee;
	}

	.svg-4-brain .green-fill{
		fill: #49af47;
	}

	.layer-6-content .circle-txt h3, 
	.layer-6-content .circle-txt p {
		color: #333;
	}

	.layer-5-content .tool-txt,
	.layer-5-content .style-txt {
		position: relative;
		top: 0;
		left:0;
		right: 0;
		bottom: 0;
		width: auto;
	}

	.layer-5-content .style-txt {
		margin-bottom: 25px;
	}

	.layer-6-content .circle-txt{
		margin-top: 0;
		position: relative;
		margin-bottom: 15px;
	}

	.layer-6-content .char-txt {
		margin-bottom: 30px;
	}

	.layer-6-content .char-txt:last-child {
		margin-bottom: 0;
	}

	.layer-6-content .char-txt img {
		margin-top: 15px;
		width: 100px;
	}

	.layer-6-content .char-5 img {
		width: 60px;
	}

	section.section-bg, .layer-7-content h2, .layer-7-content p {
		background: #2b3037;
	}

	.layer-7-content .circle-txt, .safari .layer-7-content .circle-txt {
		margin-top: 17px;
	}

	.layer-7-content .square-txt, .safari .layer-7-content .square-txt {
		background: none;
		height: auto;
		margin-top: 35px;
	}

	.safari .layer-7-content .circle-txt p {
		left: 0;
	}

	.safari .layer-7-content .square-txt {
		top: 0;
	}

	.layer-7-content .respond-txt {
		margin-bottom: 0;
	}

	.layer-7-content .square-txt img {
		margin: 10px auto;
	}

	.svg-8-circle {
		position: relative;
	    width: 100%;
	    height: 260px;
	    left: 0;
	    margin-left: 0;
	    top: 0;
	    margin-top: 20px;
	}

	.svg-8-circle svg {
		width: 250px;
		height: 260px;
		margin: 0 auto;
		display: block;
	}

	.layer-8-content .circle-txt {
		margin-top: 10px;
	}

	.e-person {
		position: absolute;
		left: 50%;
		top: 50%;
		margin-top: -40px;
		margin-left: -26px;
	}

	.svg-8-circle .pause,
	.svg-8-circle .play {
		position: absolute;
		left: 50%;
		margin-left: -15px;
		background: #fff
	}

	.svg-8-circle .pause {
		top: -1px;
	}

	.svg-8-circle .play {
		bottom: -1px;
	}

	.pause img ,
	.play img {
		width: 30px;
	}

	.layer-9-content .circle-txt {
		margin-top: 0;
	}

	.layer-10-content{
		min-height: 0;
	}

	.section-10 section  {
		position: relative;
		top: 0;
		opacity: 1;
		margin-top: 0 !important;
	}

	.layer-10-content {
		margin: 25px 0 0;
	}

	.section-10-personal .layer-10-content, .layer-10-image{
		margin: 0;
		min-height: 0;
	}

	.layer-10-content ul {
		margin-top: 7px;
	}

	.layer-10-content ul li {
		font-size: 14px;
	}

	.section-10 .layer-10-image {
		width: 290px;
		margin-left: auto;
		margin-right: auto;
	}

	.layer-10-image .person-1 {
		width: 130px;
	    background-size: 100%;
	    position: relative;
	    top: 0;
	    left: 0;
	    margin: 15px auto;
	    height: 150px;
	}

	.layer-10-image .person-1 img {
		width: 70px;
	    height: 80px;
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    margin-left: -35px;
	    margin-top: -40px;
	}

	.section-10-organizational .layer-10-image {
		position: relative;
		height: 320px;
	}

	.section-10-organizational .layer-10-image .person-1 {
		position: absolute;
	    top: 50%;
	    left: 50%;
	    margin: 0;
	    margin-left: -65px;
	    margin-top: -75px;
	}

	.section-10-organizational .layer-10-image .person {
		opacity: 1;
		width: 95px;
	    height: 108px;
	    background-size: 100%;
	    position: absolute;
	    -webkit-transform: translateY(45px);
	-moz-transform: translateY(45px);
	-o-transform: translateY(45px);
	transform: translateY(45px);

	}

	.section-10-organizational .layer-10-image .person img {
		    width: 50px;
    height: 64px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -32px;
    margin-left: -25px;
	}

	.person-2 {
		left: 51px;
    top: -45px;
	}

	.person-3 {
		    top: -35px;
    left: 160px;
	}

	.person-4 {
		    left: -17.5px;
    top: 50px;
	}

	.person-5 {
		    left: 212px;
    top: 70px;
	}

	.person-6 {
		left: 33px;
    top: 154px;
	}

	.person-7 {
		    top: 164px;
    left: 145px;
	}

	#readMoreTxt1 img, #readMoreTxt2 img {
		width: 100%;
	}

	.approach-expertise .container div h2 {
		text-align: left;
	}

	.approach-expertise a {
		font-size: 14px;
	}

	.carousel {
		border: 5px solid #fff;
		margin: 30px 0;
		padding: 0 25px;
	}

	.carousel-inner {
		margin-bottom: 50px;
	}

	.carousel-indicators {
		bottom: 3px;
	}

	div.style-list {
		margin: 30px 0px;
		padding:0;
	}

	.style-list ul {
		margin: 20px 0;
	}

	.style-list ul li {
		width: 48%;
		text-align: center;
		color: #fff;
	}

	.style-list ul li img, .style-list ul li span {
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
	 .style-list ul li img {
	 	width: 60px;
	 	height: 70px;
	 }

	.style-list ul li span {
		width: auto;
		font-size: 12px;
		height: 40px;
    	display: inline-flex;
	} 

	.carousel-inner .item {
		border-bottom: 1px solid #45494f;		
	}

	.carousel-inner {
		margin-bottom: 50px;
	}

}




@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
	.circle-desktop {
		display: none !important;
	}

	.circle-mobile {
		display: block !important; 
	}
}


/*.square-1*/

@keyframes dash {
  from {
    stroke-dashoffset: 1481;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/* .line1 */

@keyframes dash-1 {
  from {
    stroke-dashoffset: 160;
  }
  to {
    stroke-dashoffset: 0;
  }
}


/* .outer-circle-1 */

@keyframes dash-2 {
  from {
    stroke-dashoffset: 875;
  }
  to {
    stroke-dashoffset: 1750;
  }
}

/* .outer-circle-2 */

@keyframes dash-3 {
  from {
    stroke-dashoffset: 875;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.inner-circle-1*/

@keyframes dash-4 {
  from {
    stroke-dashoffset: 837;
  }
  to {
    stroke-dashoffset: 1674;
  }
}

/* .inner-circle-2 */

@keyframes dash-5 {
  from {
    stroke-dashoffset: 837;
  }
  to {
    stroke-dashoffset: 0;
  }
}


/* .svg-2-path-3 .line-1 */

@keyframes dash-6 {
  from {
    stroke-dashoffset: 103;
  }
  to {
    stroke-dashoffset: 206;
  }
}

/* .svg-2-path-4 .line-1 */

@keyframes dash-7 {
  from {
    stroke-dashoffset: 93;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/* .svg-2-path-2 .line-1 */

@keyframes dash-8 {
  from {
    stroke-dashoffset: 90;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-3-path-1 .line-1*/

@keyframes dash-9 {
 from {
    stroke-dashoffset: 80;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-3-circle .line-1*/

@keyframes dash-10 {
 from {
    stroke-dashoffset: 55;
  }
  to {
    stroke-dashoffset: 110;
  }
}

/*.svg-3-circle .left-path*/
@keyframes dash-11 {
 from {
    stroke-dashoffset: 690;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-3-circle .right-path*/

@keyframes dash-12 {
 from {
    stroke-dashoffset: 617.67;
  }
  to {
    stroke-dashoffset: 1235.34;
  }
}

/*.svg-3-circle .cirlce-path*/

@keyframes dash-13 {
 from {
    stroke-dashoffset: 86;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-3-path-2 .line-1*/

@keyframes dash-14 {
 from {
    stroke-dashoffset: 73;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-7-path-1 .line-1*/

@keyframes dash-15 {
 from {
    stroke-dashoffset: 300;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-7-square .polygon-1*/

@keyframes dash-16 {
 from {
    stroke-dashoffset: 1092;
  }
  to {
    stroke-dashoffset: 2184;
  }
}

/*.svg-7-square .polygon-2*/

@keyframes dash-17 {
 from {
    stroke-dashoffset: 1092;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-9-circle .polyline-1*/
@keyframes dash-18 {
 from {
    stroke-dashoffset: 1467;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-9-circle .polyline-*/
@keyframes dash-19 {
 from {
    stroke-dashoffset: 1467;
  }
  to {
    stroke-dashoffset: 2934;
  }
}

/*.svg-5-path-1 .line-1*/
@keyframes dash-20 {
 from {
    stroke-dashoffset: 380;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-5-path-1 .polyline-1*/
@keyframes dash-21 {
 from {
    stroke-dashoffset: 2243;
  }
  to {
    stroke-dashoffset: 4486;
  }
}

/*.svg-5-path-1 .polyline-2*/
@keyframes dash-22 {
 from {
    stroke-dashoffset: 2251;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-5-path-2 .line-1*/
@keyframes dash-23 {
 from {
    stroke-dashoffset: 292.49;
  }
  to {
    stroke-dashoffset: 0;
  }
}

/*.svg-8-circle .path-1*/
@keyframes dash-24 {
 from {
    stroke-dashoffset: 1750;
  }
  to {
    stroke-dashoffset: 0;
  }
}
