.bg-image {
    height: 786px;
    background-image: url('../assets/img/Web\ apps.png') !important;
    background-repeat: no-repeat;
    background-size: 53%;
    margin-left: 2px !important;
    margin-right: 2px !important;
}

.triagles-image {
    height: 320px;
    background-image: url('../assets/img/WEB.jpeg') !important;
    background-repeat: no-repeat;
    background-size: 100%;
    opacity: 40%;
}

.bottom-border{
    border-bottom: 9px solid #009FE3;
    
}


.btn-blue{
    background-color: #009FE3 !important;
    border-radius: 15px !important;
    text-transform: uppercase !important;
    color: white !important;
    width: 231px !important;
    height: 57px !important;
    font-weight: 600 !important;
    margin-right: 20px;
}

.content{
    margin-left: 0;
}

.photo{
    background-image: url('../assets/img/TitleCont.jpeg');
    background-repeat: no-repeat;
    background-size: cover;
    height: 475.28px;
 }
.photo1{
    background-image: url('../assets/img/aLK9LiX69nA-1.png');
    background-repeat: no-repeat;
    background-size: cover;
    height: 475.28px;
 }

.btns{
    display: flex !important;
    flex-wrap: nowrap !important; 
    margin-top: 40px;
 }

 .text-desktop{
    width: 70%;
     }

     .footer-bg{
        background-image: url(../assets/img/footer.png);
        background-size: cover;
        background-repeat: no-repeat;
    } 
    
    .footer-text{
        font-family: Poppins !important;
      font-style: normal !important;
      font-weight: 400 !important;
      font-size: 18px !important;
      line-height: 159%;
      color: #FFFFFF;
      text-align: center;
      margin-bottom: 10px;
    }

    .text2-desktop{
        width: 40% !important;
    }

    .angular{
        background-image: url('../assets/img/Angular.png');
        background-repeat: no-repeat;
        background-size: 90%;
        height: 18vw;
        display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: flex-start;
     }
     .jsf{
        background-image: url('../assets/img/JSF.png');
        background-repeat: no-repeat;
        background-size: 100%;
        height: 45vw;
        display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: flex-end;
         margin-left: auto;
     }
     .primefaces{
        background-image: url('../assets/img/PrimeFaces.png');
        background-repeat: no-repeat;
        background-size: 90%;
        height: 29vw;
        display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: flex-start;
     }
    
     .text3-desktop{
         width: 23% !important;
     }
     .text3-1-desktop{
         width: 30% !important;
     }
     
    
     .adapt-visible{
         display: none !important;
    
     }

     .footer-bg{
        background-image: url(../assets/img/footer.png);
        background-size: cover;
        background-repeat: no-repeat;
    } 
    
    .footer-text{
        font-family: Poppins !important;
      font-style: normal !important;
      font-weight: 400 !important;
      font-size: 18px !important;
      line-height: 159%;
      color: #FFFFFF;
      text-align: center;
      margin-bottom: 10px;
    }

    @media (max-width: 768px) and (min-width: 200px) {
        .adapt-hide{
            display: none;
            }
    
            .right-side{
                height: 400px;
                background-image: url('../assets/img/web.png');
                background-repeat: no-repeat;
                background-size: cover;
            }
                .bg-image{
            
                    background-size: 100% !important;
                }
    
       
                    .btn-blue{
                        color: white !important;
                        width: 160px !important;
                        height: 40px !important;
                        font-size: 13px !important;
                        border-radius: 9px !important;
                    }
    
                    .photo{
                        display: none;
                    }
                    .photo1{
                        display: none;
                    }
    }
    
    @media (max-width: 417px) and (min-width: 200px) {
        .btns{
            flex-wrap: wrap !important; 
            margin: 0 !important;
         }
    
         .btn-blue{
            width: 100% !important;
            margin-top: 15px;
            margin-right: 0 !important;
        }
    
        .right-side-content{
            margin-top: 70px;
        }
    
        .adapt-hide1{
           display: none;
           }
    
           .photo{
            display: none;
        }
           .photo1{
            display: none;
        }
    
        .text-desktop{
            width: 90%;
             }
    
             .menu{
                display: none !important;
            }
            .footer-text{
                font-family: Poppins !important;
              font-style: normal !important;
              font-weight: 400 !important;
              font-size: 13px !important;
              line-height: 159%;
              color: #FFFFFF;
              text-align: center;
            }

            .text2-desktop{
                width: 90% !important;
        }

        .jsf{
            background-image: none;
            height: 179vw;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            border-bottom: 2px solid #ffff;
            border-top: 2px solid #ffff;
         }
        .primefaces{
            background-image: none;
            height: 179vw;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            border-bottom: 2px solid #ffff;
            border-top: 2px solid #ffff;
         }
        .angular{
            background-image: none;
            height: 62vw;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            border-bottom: 2px solid #ffff;
            border-top: 2px solid #ffff;
         }

         .text3-desktop{
            width: 80% !important;
            text-align: center;
            padding-top: 20px;
            padding-bottom: 20px;
            
         }
         .text3-1-desktop{
            width: 80% !important;
            text-align: center;
            padding-top: 20px;
            padding-bottom: 20px;
            
         }

            .adapt-visible{
            display: flex !important;
            justify-content: flex-end;
            width: 100% !important;
            margin-bottom: 80px;
            
            
        }
    
    }
    
    @media (max-width: 992px) and (min-width: 880px) {
    
    
        .photo{
            display: none;
        }
        .photo1{
            display: none;
        }
    
        .text-desktop{
            width: 90%;
             }

             .jsf{
                background-image: none;
                height: 24vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
             }
             .primefaces{
                background-image: none;
                height: 24vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
             }
             .angular{
                background-image: none;
                height: 24vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
             }
    
             .text3-desktop{
                width: 80% !important;
                text-align: center;
             }
             .text3-1-desktop{
                width: 80% !important;
                text-align: center;
             }
            
    
             .adapt-visible{
                display: flex !important;
                justify-content: flex-end;
                width: 100% !important;
                margin-bottom: 40px;
                
            }
    }
    
    
    @media (max-width: 880px) and (min-width: 557px) {
    
        .menu{
            display: none !important;
        }
    
        .adapt-hide1{
            display: none;
            }
    
        .photo{
            display: none;
        }
        .photo1{
            display: none;
        }
    
        .text-desktop{
            width: 90%;
             }

             .text2-desktop{
                width: 80% !important;
            }

            .jsf{
                background-image: none;
                height: 57vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
             }
            .primefaces{
                background-image: none;
                height: 57vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
             }
            .angular{
                background-image: none;
                height: 24vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
             }
    
             .text3-desktop{
                width: 80% !important;
                text-align: center;
             }
    
             .text3-1-desktop{
                width: 80% !important;
                text-align: center;
             }
            
    
             .adapt-visible{
                    display: flex !important;
                    justify-content: flex-end;
                    width: 100% !important;
                    margin-bottom: 40px;
                
            }
    
    }
    
    @media (max-width: 557px) and (min-width: 417px) {
    
        .menu{
            display: none !important;
        }
    
        .adapt-hide1{
            display: none;
            }
    
            .photo{
                display: none;
            }
            .photo1{
                display: none;
            }
    
            .text-desktop{
                width: 90%;
                 }

                 .text2-desktop{
                    width: 80% !important;
            }

            .jsf{
                background-image: none;
                height: 80vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
                 }
                .primefaces{
                background-image: none;
                height: 80vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
                 }
                .angular{
                background-image: none;
                height: 43vw;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                border-bottom: 2px solid #ffff;
                border-top: 2px solid #ffff;
                 }
    
                 .text3-desktop{
                    width: 80% !important;
                    text-align: center;
                 }
                 .text3-1-desktop{
                    width: 80% !important;
                    text-align: center;
                 }
    
                 .adapt-visible{
                    display: flex !important;
                    justify-content: flex-end;
                    width: 100% !important;
                    margin-bottom: 40px;
                    
                }
    }
    
    @media (max-width: 1412px) and (min-width: 1013px) {
        .btn-blue{
        color: white !important;
        width: 195px !important;
        height: 50px !important;
        font-size: 16px !important;
        border-radius: 13px !important;
        }
    
        .text-desktop{
            width: 90%;
             }
    
    }

    @media (max-width: 1013px) and (min-width: 992px) {
        .jsf{
            background-image: none;
            height: 21vw;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            border-bottom: 2px solid #ffff;
            border-top: 2px solid #ffff;
         }
        .primefaces{
            background-image: none;
            height: 21vw;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            border-bottom: 2px solid #ffff;
            border-top: 2px solid #ffff;
         }
        .angular{
            background-image: none;
            height: 21vw;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            border-bottom: 2px solid #ffff;
            border-top: 2px solid #ffff;
         }
    
         .text3-desktop{
            width: 80% !important;
            text-align: center;
         }
         .text3-1-desktop{
            width: 80% !important;
            text-align: center;
         }
    
        
    
         .adapt-visible{
            display: flex !important;
            justify-content: flex-end;
            width: 100% !important;
            margin-bottom: 40px;
            
        }
    
        
    }