.ffNephilm{
   font-family:Nephilm;
}
.orangxt{
    color: #ff5722;
}
.lightBlueBg{
    background:#4a7ead;
}
.halfLightBlue{
    background: linear-gradient(to right, #4a7ead 50%, transparent 50%);
}
.textLightBlue{
    color:#A2E9FC!important;
}
.redPatern:before{
    content:'';
    width:150px;
    height:45px;
    position:absolute;
    top:0;
    right:0;
    background:#ff5722;
}

.redPatern:after{
    content:'';
    width:80px;
    height:150px;
    position:absolute;
    top:0;
    right:-30px;
    background:#ff5722;
}
.blueStep:before{
    position:absolute;
    top:25%;
    content:'';
    width:30px;
    height:250px;
   background: linear-gradient(#94c4d7, #3b8bbf);
   border-radius:16px;
}


.blue-dot{
    position:relative;
}
.blue-dot:before{
    content: '';
    width: 150px;
    height: 30px;
    left: 67%;
    top: 37%;
    position: absolute;
    background: url(../images/blue-dot.png) no-repeat left;
}


.orangeStep:before{
    position:absolute;
    top:42%;
    content:'';
    width:30px;
    right:-1.5em;
    height:250px;
   background: linear-gradient(#e89951, #ff5722);
   border-radius:16px;
}


.orange-dot{
    position:relative;
}
.orange-dot:before{
     content: '';
    width: 150px;
    height: 30px;
    right: 0%;
    top:37%;
    position: absolute;
    background: url(../images/orange-dot.png) no-repeat left; 
}
.msless-4{
    left: -34%;
    top:-10px;
    position: relative;
    z-index: 10;
}
.meless-4{
     right: -66%;
    top:-20px;
    position: relative;
    z-index: 10;
}
.lastStep:before{
    content:'';
    display:none;
}
.lastStep .msless-4{
    top:-10%;
}

@media screen and (max-width: 1399px){
    .msless-4{
        left:-40%;
    }
    .meless-4{
        right: -60%;
    }
    
}
@media screen and (max-width: 1133px){
    .orangeStep:before{
        right:auto;
    }
    .msless-4, .meless-4 {
        left:0;
    }
    .orange-dot:before,
    .blue-dot:before{
        right:auto;
        left:60%;
    }

    .orangeStep:before,
    .blueStep:before {
        right: auto;
        left: 7%;
    }  

}

@media screen and (max-width: 991px){
    .orangeStep:before, .blueStep:before{
        left:9%;
    }
    .orange-dot:before, .blue-dot:before{
        left:82%;
    }
}

@media screen and (max-width: 767px){
    .orange-dot:before, .blue-dot:before{
        display:none;
    }
    .msless-4, .meless-4{
        left: 0;
        width: 100px;
    }
    .msless-4{
        top:-11px;
        left:-4px;
    }
    .meless-4{
       top: -38px;
       left: -5px;
    }
    .msless-4.fstStep {
       top: 15px;
    }
    
  
    .redPatern:after{
        right:0;
        width:10px;
    }
    .redPatern:before{
        height:10px;
    }
    .blueStep:before,
    .orangeStep:before{
       height: 280px;
    }
    .lastStep .msless-4 {
    top: -39px;
    }
    .orangeStep:before{
        top:21px;
    }
    
    .bg-sky{
        
    }
}
.bg-red {
    position: absolute;
    top: 0;
    width: 90px;
    height: 30px;
    background-color: #ff5722;
    right: 0;
}