.how-it-works-section {

    height:500px;

}

.how-it-works-section img {

    width:100%;

}

.how-it-works-heading-container {

    text-align:center; margin-left:-120px; z-index:20; position:relative;

}

.how-it-works-number {
    
    position:absolute; background:#00aeef; border-radius:100px; box-sizing:border-box; width:60px; height:60px; padding-top:28px; font-size:42px; color:#fff; font-weight:bold; line-height:0; text-align:center;

}

.how-it-works-text {

    font-size:26px; line-height:110%;

}

.how-it-works-relative {

    position:relative; width:100%; height:100%;

}

.how-it-works-container-1 {

    position:absolute; top:110px; left:7%; width:573px; height:227px; z-index:3;

}

.how-it-works-container-2 {

    position:absolute; top:360px; left:23%; width:573px; height:227px; z-index:2;

}

.how-it-works-container-3 {

    position:absolute; top:110px; right:26%; width:573px; height:227px; z-index:1;

}

.how-it-works-container-4 {

    position:absolute; top:360px; right:8%; width:573px; height:227px; z-index:0;

}

.how-it-works-image-1 {

    height:75px; position:absolute; left:50px; top:-50px; z-index:5;

}

.how-it-works-image-2 {

    height:100px; position:absolute; left:50px; top:-55px; z-index:5;

}

.how-it-works-image-3 {

    height:120px; position:absolute; right:-100px; top:-50px; z-index:5;

}

.how-it-works-image-4 {

    height:154px; position:absolute; right:-170px; top:-70px; z-index:5;

}

.how-it-works-number-1 {

    top:-30px; left:150px; z-index:10;

}

.how-it-works-number-2 {

    top:-10px; left:150px; z-index:10;

}

.how-it-works-number-3 {

    top:-10px; left:150px; z-index:10;

}

.how-it-works-number-4 {

    top:-10px; left:150px; z-index:10;

}

.how-it-works-cloud-1 {

    position:absolute; top:0; left:0; width:573px; height:227px; z-index:1;

}

.how-it-works-cloud-2 {

    position:absolute; top:0; left:0; width:573px; height:227px; z-index:1;

}

.how-it-works-cloud-3 {

    position:absolute; top:0; left:0; width:573px; height:227px; z-index:1;

}

.how-it-works-cloud-4 {

    position:absolute; top:0; left:0; width:573px; height:227px; z-index:1;

}

.how-it-works-inner-1 {

    position:absolute; top:40px; left:130px; color:#fff; text-align:center; width:330px; z-index:5;

}

.how-it-works-inner-2 {

    position:absolute; top:60px; left:130px; color:#fff; text-align:center; width:330px; z-index:5;

}

.how-it-works-inner-3 {

    position:absolute; top:70px; left:130px; color:#fff; text-align:center; width:330px; z-index:5;

}

.how-it-works-inner-4 {

    position:absolute; top:60px; left:130px; color:#fff; text-align:center; width:330px; z-index:5;

}

.how-it-works-arrow-1 {

    position:absolute; top:220px; left:20px; height:140px; z-index:2; pointer-events:none;

}

.how-it-works-arrow-2 {

    position:absolute; top:-50px; right:-260px; height:140px; transform:rotate(270deg); z-index:2; pointer-events:none;

}

.how-it-works-arrow-3 {

    position:absolute; top:140px; right:-290px; height:140px; transform:rotate(270deg) scaleX(-1); z-index:2; pointer-events:none;

}

@media only screen and (max-width: 1560px) {
    
    .how-it-works-container-1 { left:30px; }
    .how-it-works-container-4 { right:30px; }

}

@media only screen and (max-width: 1470px) {
    
    .how-it-works-container-2 { left:15%; }
    .how-it-works-container-3 { right:15%; }
    .how-it-works-arrow-1 { left:-100px; }
    .how-it-works-arrow-3 { top:80px; }

}

@media only screen and (max-width: 1370px) {
    
    .how-it-works-container-2 { left:12%; }
    .how-it-works-container-3 { right:12%; }
    .how-it-works-image-4 { height:100px; top:-20px; }

}

@media only screen and (max-width: 1270px) {
    
    .how-it-works-container-1 { left: -50px; }
    .how-it-works-container-2 { left: 10%; }
    .how-it-works-container-3 { right:10%; }
    .how-it-works-container-4 { right:-40px; }
    .how-it-works-arrow-1 { left:-70px; top:200px; }
    .how-it-works-arrow-3 { top:100px; }

}

@media only screen and (max-width: 1150px) {
    
    .how-it-works-container-1 { left: -70px; }
    .how-it-works-container-4 { right:-60px; }

}

@media only screen and (max-width: 1100px) {
    
    .how-it-works-container-1 { position:relative !important; top:0; left:0; right:0; bottom:0; margin:30px auto 30px auto; z-index:0; }
    .how-it-works-container-2 { position:relative !important; top:0; left:0; right:0; bottom:0; margin:30px auto 30px auto; z-index:0; }
    .how-it-works-container-3 { position:relative !important; top:0; left:0; right:0; bottom:0; margin:30px auto 30px auto; z-index:0; }
    .how-it-works-container-4 { position:relative !important; top:0; left:0; right:0; bottom:0; margin:30px auto 30px auto; z-index:0; }
    .how-it-works-section { height:auto; }
    .how-it-works-arrow-1 { display:none }
    .how-it-works-arrow-2 { display:none }
    .how-it-works-arrow-3 { display:none }
    .how-it-works-arrow-4 { display:none }
    .how-it-works-image-2 { left:200px; top:-30px; }
    .how-it-works-heading-container { margin-left:0; padding-bottom:10px; }

}

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

    .how-it-works-heading-container { padding-bottom:0; }
    .how-it-works-text { font-size:24px; }

    .how-it-works-container-1 { width:auto; height:auto; padding-bottom:20px; border-bottom:1px dotted rgba(255,255,255,0.5); padding-top:10px; }
    .how-it-works-inner-1 { width:auto; height:auto; position:relative; top:0; left:0; padding:40px 20px 0 0; }
    .how-it-works-cloud-1 { display:none; }
    .how-it-works-image-1 { display:none; }
    .how-it-works-number-1 { left:50%; transform:translateX(-50%); }

    .how-it-works-container-2 { width:auto; height:auto; padding-bottom:20px; border-bottom:1px dotted rgba(255,255,255,0.5); padding-top:0px; }
    .how-it-works-inner-2 { width:auto; height:auto; position:relative; top:0; left:0; padding:60px 20px 0 0; }
    .how-it-works-cloud-2 { display:none; }
    .how-it-works-image-2 { display:none; }
    .how-it-works-number-2 { left:50%; transform:translateX(-50%); }

    .how-it-works-container-3 { width:auto; height:auto; padding-bottom:20px; border-bottom:1px dotted rgba(255,255,255,0.5); padding-top:0px; }
    .how-it-works-inner-3 { width:auto; height:auto; position:relative; top:0; left:0; padding:60px 20px 0 0; }
    .how-it-works-cloud-3 { display:none; }
    .how-it-works-image-3 { display:none; }
    .how-it-works-number-3 { left:50%; transform:translateX(-50%); }

    .how-it-works-container-4 { width:auto; height:auto; padding-bottom:20px; border-bottom:1px dotted rgba(255,255,255,0.5); padding-top:0px; }
    .how-it-works-inner-4 { width:auto; height:auto; position:relative; top:0; left:0; padding:60px 20px 0 0; }
    .how-it-works-cloud-4 { display:none; }
    .how-it-works-image-4 { display:none; }
    .how-it-works-number-4 { left:50%; transform:translateX(-50%); }

}