#SPL a{
  position: absolute;
}

#SPL a::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 4px;
    border-radius: 50px;
    background-color: #FF5D00;
    bottom: -4px;
    left: 0;
    transform-origin: left;
    transform: scaleX(0.2);
    transition: transform .3s ease-in-out;
  }

#SPL a:hover::before {
  transform-origin: left ;
  transform: scaleX(1);
}

#SPL a:hover {
    color: #FF5D00;
}

#SPL a {
    color: #ffffff;
		font-weight: 600;
    transition-duration: 0.3s;
}

#SPIL a{
  position: absolute;
}

#SPIL a::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 4px;
    border-radius: 50px;
    background-color: #FF5D00;
    bottom: 0px;
    left: 0;
    transform-origin: left;
    transform: scaleX(0.2);
    transition: transform .3s ease-in-out;
  }

#SPIL a:hover::before {
  transform-origin: left ;
  transform: scaleX(1);
}

#SPIL a:hover {
    color: #FF5D00;
}

#SPIL a {
    color: #ffffff;
		font-weight: 600;
    transition-duration: 0.3s;
}
#web-overlay {
                position: absolute;
                top: 0;
                left: 10%;
                width: 80%;
                height: 100%;
                background: rgba(0,0,0,0.3);
                margin: auto;
                border-radius: 35px;
            }
            #web-overlay i {
                display: block;
                font-size: 23px;
                margin-bottom: -14px;
            }

            #web-overlay span {
                display: block;
                margin-top: 35%;
            }

            #web-image:hover .web-overlay {
                display: none;
            }

            @media(min-width:1365px) and (max-width:1366px){
                #web-wrap {
                    width:88%;
                }

                #web-overlay {
                    left: 6%;
                    width: 88%;
                }

                #phone-wrap {
                    height: 588px;
                }
            }
            
            @media(min-width:769px) and (max-width:1024px){

                #the-solution-outer .text-list li span {
                    display: inline-block;
                    width: 92%;
                }

                #web-wrap {
                    width: 89%;
                    -webkit-border-radius: 28px;
                    -moz-border-radius: 28px;
                    border-radius: 28px;
                    height: 591px;
                }

                #web-overlay {
                    position: absolute;
                    left: 5%;
                    width: 90%;
                    border-radius: 28px;
                }

            }

            @media(max-width:768px){ 
                .the-solution-outer .image-text .row {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                }

                #the-solution-outer .row.right .col:nth-child(1) {
                    order:1;
                    text-align: left;
                }

                #the-solution-outer .row.right .col:nth-child(2) {
                    order:2;
                }

                #the-solution-outer .image-info {
                    padding: 0 5%;
                }

                #the-solution-outer .image-text .right .image-info {
                    padding-left: 0;
                    padding-right: 0;
                }

                #the-solution-outer .text-list li span {
                    display: inline-block;
                    width: 89%;
                }

                3text-with-image-2-outer .video-thumb {
                    margin: 0 !important;
                }

                #web-wrap {
                    width: 89%;
                    -webkit-border-radius: 12px;
                    -moz-border-radius: 12px;
                    border-radius: 12px;
                    height: 432px;
                } 

                #web-overlay {
                    left: 5%;
                    width: 90%;
                    border-radius: 17px;
                }

                #the-solution-outer .col {
                    width: 100% !important;
                }       
                
                #tablet-container .web-overlay, 
                #phone-container .phone-overlay  {
                    display:none !important;
                }

                #tablet-container .web-wrap,
                #phone-container .phone-wrap {
                    overflow-y: hidden !important;
                }

            }
            @media(max-width:768px){
                #web-wrap {
                    height: 235px;
                } 

                #the-solution:after {
                    background: transparent;
                }               

                #tablet-container {
                    display:none;
                }

                #the-solution {
                    padding: 60px 0;
                }

                #the-solution-outer .text-green {
                    font-size:36px !important;
                }

            }