/* 
* Journey
*/

.brand-cohesion-step .step-icon {
 display:inline-block;
 margin-right:.5em;
 background-size:contain;
 background-repeat:no-repeat;
 height:25px;
 width:25px
}
.step-icon:hover{cursor: pointer}

.section-brand-cohesion {
 color:#374246;
 background-color:#ffffff;
 font-size:16px;
 /*padding:1em 0 0 0;*/
}
.section-brand-cohesion .content {
 display:block;
 margin:0 auto;
 width:90%;
 max-width:700px
}
.section-brand-cohesion .content::after {
 clear:both;
 content:"";
 display:table
}
.brand-cohesion-steps {
 margin:0;
 padding:0;
 width:100%;
 float:left;
 list-style:none
}
.brand-cohesion-step {
 display:block;
 display:-webkit-box;
 display:-moz-box;
 display:-webkit-flex;
 display:-moz-flex;
 display:-ms-flexbox;
 display:flex;
 -webkit-flex-flow:wrap;
 -moz-flex-flow:wrap;
 flex-flow:wrap;
 -webkit-box-pack:center;
 -moz-box-pack:center;
 box-pack:center;
 -webkit-justify-content:center;
 -moz-justify-content:center;
 -ms-justify-content:center;
 -o-justify-content:center;
 justify-content:center;
 -ms-flex-pack:center;
 position:relative;
 margin-bottom:5.5em;
 min-height:170px;
}
.brand-cohesion-step::after {
 clear:both;
 content:"";
 display:table
}
.brand-cohesion-step .step-copy {
 -webkit-box-flex:2;
 -moz-box-flex:2;
 box-flex:2;
 -webkit-flex:2 1 auto;
 -moz-flex:2 1 auto;
 -ms-flex:2 1 auto;
 flex:2 1 auto;
 -webkit-align-self:center;
 -moz-align-self:center;
 align-self:center;
 -ms-flex-item-align:center;
 max-width:420px;
 margin:0 ;
 position:relative
}
.brand-cohesion-step .step-copy .step-explanation,.brand-cohesion-step .step-copy .step-title {
 display:inline-block;
 padding-left:15%;
 color:#374246
}
.brand-cohesion-step .step-copy .step-title {
 font-size:1em;
 font-weight:700;
 font-family:'Muli', sans-serif;
}
.brand-cohesion-step .step-copy .step-explanation { 
 font-family:'Muli', sans-serif;
 line-height:0.9;
 font-size:0.9em;
}
.brand-cohesion-step .step-copy .step-number {
 line-height:1.2;
 font-size:1.2em;
 color:#c0232a;
 font-family:'Muli', sans-serif;
 text-transform:uppercase;
 font-weight:700;
 position:absolute;
 height:100%
}
.brand-cohesion-step .step-icon {
 -webkit-box-flex:1;
 -moz-box-flex:1;
 box-flex:1;
 -webkit-flex:1 0 25%;
 -moz-flex:1 0 25%;
 -ms-flex:1 0 25%;
 flex:1 0 25%;
 -webkit-align-self:center;
 -moz-align-self:center;
 align-self:center;
 -ms-flex-item-align:center;
 background-position:center center;
 min-height:180px;
 max-width:180px;
 margin-bottom:0;

}

.brand-cohesion-step:nth-of-type(even) {
 -webkit-box-orient:horizontal;
 -moz-box-orient:horizontal;
 box-orient:horizontal;
 -webkit-box-direction:reverse;
 -moz-box-direction:reverse;
 box-direction:reverse;
 -webkit-flex-direction:row-reverse;
 -moz-flex-direction:row-reverse;
 flex-direction:row-reverse;
 -ms-flex-direction:row-reverse
}
.dotted-line {
 position:absolute;
 bottom:-11em;
 left:0;
 width:100%;
 height:12em;
 /*display:none*/
}
.dotted-line svg {
 height:100%;
 width:100%
}
.dashed,.overlay {
 fill:none;
 stroke-linecap:round
}
.dashed {
 stroke:#374246;
 stroke-width:2.8346;
 stroke-miterlimit:10;
 stroke-dasharray:22.6772
}
.overlay {
 stroke:#ffffff;
 stroke-width:4;
 -webkit-transition:stroke-dashoffset .4s ease-out;
 -moz-transition:stroke-dashoffset .4s ease-out;
 transition:stroke-dashoffset .4s ease-out
}