.what-we-do-section-container
{
    visibility: visible;
}
.main-container_w-w-d{
    padding :6rem 2rem;
    position: relative;
}
.contant_w-w-d{
    display: flex;
    flex-basis: 100%;
    margin-bottom: 2rem;
    height: 50vh;
}
.wrap-w-w-d-left{
    flex: 0 0 50%;
    padding-right: 25px;
    position: relative;
}
.wrap-w-w-d-left > p{
    font-size: 1em;
    margin-bottom: 13px;
    color: #263238;
}
.wrap-w-w-p-right{
    flex:0 0 50%;
    padding-left: 25px;
    position: relative;
}
.stylesheet_w-w-d
{
    height: 70vh;
}
.w-w-d-red-image{
    width: 75%;
    position: absolute;
    animation: w-w-d-red-image 1s 0s linear forwards;
}
@-webkit-keyframes w-w-d-red-image {
    0%{
      opacity: 1;
      width: 10%;
    }
    100%{
      opacity: 1;
      width: 75%;
    }
}
.w-w-d-red-image-bottom{
    width: 86%;
    position: absolute;
    top: 104%;
    right: 10%;
    animation: w-w-d-red-image-bottom 1s 0s linear forwards;
}
@-webkit-keyframes w-w-d-red-image-bottom {
    0%{
      opacity: 1;
     right:0%;
     width: 10%;
    }
    100%{
      opacity: 1;
      right: 10%;
    width: 86%;
    }
}
.w-w-d-red-man{
    position: absolute;
    width: 28%;
    top:54%;
    left: 34%;
    z-index: 3;
    animation: w-w-d-red-man-animation 1s 0s linear forwards;
}
@-webkit-keyframes w-w-d-red-man-animation {
    0%{
      opacity: 1;
      top:0%;
    }
    100%{
      opacity: 1;
      top: 54%;
    }
}
.w-w-d-red-car{
    width: 18%;
    position: absolute;
    right: 11%;
    animation: w-w-d-red-car-animation 1s 0s linear forwards;
    top: 90%;
}
@-webkit-keyframes w-w-d-red-car-animation {
    0%{
      opacity: 1;
      right: 0%;
    }
    100%{
      opacity: 1;
      right: 11%;
    }
}
.w-w-d-left{
    position: absolute;
    width: 33%;
    right: 34%;
    bottom: 65%;
    animation: w-w-d-left-animation 1s 0s linear forwards;
}
@-webkit-keyframes w-w-d-left-animation {
    0%{
      opacity: 1;
      bottom: 0%;
      width: 1%;
      right: 16%;
    }
    100%{
        opacity: 1;
        bottom: -24%;
        width: 33%;
        right: 65%;
    }
}
.w-w-d-right-code{
    position: absolute;
    width: 43%;
    right: 24%;
    top: 12%;
    z-index: 2;
    animation: w-w-d-right-code-animation 1s 0s linear forwards;
}
@-webkit-keyframes w-w-d-right-code-animation {
    0%{
      opacity: 1;
      right: 0%;
    }
    100%{
      opacity: 1;
      right: 24%;
    }
}
.w-w-d-left-lock{
    position: absolute;
    width: 26%;
    right: 72%;
    top: 13%;
    animation: w-w-d-left-lock-animation 1s 0s linear forwards;
}
@-webkit-keyframes w-w-d-left-lock-animation {
    0%{
      opacity: 1;
      top:0%;
    }
    100%{
      opacity: 1;
      top: 13%;
    }
}
.w-w-d-button{
    padding: 6px 27px;
    font-size: 24px;
    font-weight: bold;
    background-color: #fff;
    border: 1px solid #263238;
    border-radius: 25px;
    bottom: 131px;
    position: absolute;
}
/* media quary */
@media only screen and (max-width: 1200px) {
    .wrap-w-w-d-left > p{
        font-size: 19px;
    } 
}
@media only screen and (max-width: 1150px) {
    .wrap-w-w-p-right{
        height: 345px;
        align-self: flex-end;
    }
}
@media only screen and (max-width: 1050px){
    .wrap-w-w-d-left > p{
        font-size: 16px;     
    }
    .wrap-w-w-p-right{
        height: 278px;
        align-self: flex-end;
    }
}
@media only screen and (max-width: 900px) {
    .wrap-w-w-d-left > p{
        font-size: 14px;
    }
    .wrap-w-w-p-right {
        height: 235px;
        align-self: flex-end;
    }
}
