body{
    background-color: white;
    height: 100%;
    padding: 0;
    margin: 0%;
    height: 100vh;
    overflow-x: hidden;
}

.content-about{
    background-color:#009ca3 !important;
    background-position: center 30%;
    background-size: cover; 
    background-attachment: fixed; 
    background-repeat: no-repeat; 
    height: 700px;
    display: flex;
    padding: 50px 0px;
    align-items: center;
    text-align: center;
    position: relative;
    flex-wrap: nowrap;
    justify-content: center;
    
    img{
        width: 1300px;
        position: relative;
        top: 35px;
        right:5px;
        left: 10px;
    }
     
    
    h1{
        margin-left: 730px;  
        padding-right:110px; 
        padding-left: 60px;  
        width: 800px;
        border-radius: 50px 0 0 50px;
        position:absolute;
        padding: 10px;
        background-color:rgba(0, 84, 89, 0.5); 
        color: white;
        font-family: Arial, sans-serif;
        font-size: 80px;
    } 

    .img-title{
        justify-content: center;
        width: 248px;
        top: 10px; 
        left: -700px;
        z-index: 2;
    }
}

.about{
    align-items: center;
    text-align: center;
    position: relative;
    justify-content: center;
    height: 780px;
    
    .introduction {
        position: relative;
        align-items: center;
        max-width: 1300px; 
        margin: -16px auto;
        left:-80px;
       
       p{
        align-items: center;
        font-family: Arial, sans-serif; 
        height: 100px;
        margin-top: 10px;
        border-radius: 0 80px 80px 0;
        padding: 30px;
        padding-left: 300px;
        background-color:#f7aa00;
        color: #ffffff;
        text-align: left;
        font-size: 16px;
        line-height:1.8;
       }
    }

    .steps-icons-blue{
        background-image: url('images/about/images/content/background.png');
        background-position: center 30%;
        background-size: cover; 
        background-attachment: fixed; 
        background-repeat: no-repeat; 
        position: relative; 
        align-items: center;
        max-width: 1205px; 
        margin: -10px auto;
        left:-75px;
        background-color:#009ca3;
        top: 80px;
        border-radius: 0 90px 90px 0;
        height: 200px;
        display: flex;
        justify-content: flex-start; 

       .steps{
          display: flex;
          align-items: center;
          gap: 10px; 
          width: 100%; 
          
          .step{
            display: flex; 
            flex-direction: column; 
            align-items: center;
            
            p{
                color: white;
                font-family: Arial, sans-serif;
                align-items: center;
                padding-left: 50px;
                font-size: 18px;
                white-space:nowrap;
                position: relative; 
                top: -40px; 
                
            }
            img{
                width: 200px;
                position: relative;
                left: 30px;
            }
          }
        }

       .title-contractors {
          position: relative;
          text-align: center; 
          
          h2{
            color: white;
            font-family: Arial, sans-serif;
            font-size: 30px;
            letter-spacing:0.5px;
            position: relative;
            z-index: 2;
            font-weight: bold;
            left: 60px;
          }
          img{
            position: absolute;
            top: -200px; 
            left: 20px;
            width: 550px; 
            z-index: 1;   
            }
       }
       
    }
   
    
 
    .steps-icons-yellow{
        background-color: #f7aa00;
        position: relative;
        align-items: center;
        width: 1300px; 
        margin: 15px auto;
        left:80px;
        top: 150px;
        border-radius: 90px 0 0 90px;
        height: 200px;
        display: flex;
        justify-content: flex-start; 

        .steps{
            display: flex;
            align-items: center;
            gap: 10px; 
            width: 100%; 

            .step{
                display: flex; 
                flex-direction: column; 
                align-items: center;
                
                
                p{
                    color:white;
                    font-family: Arial, sans-serif;
                    align-items: center;
                    padding-right: 30px;
                    font-size: 18px;
                    white-space:nowrap;
                    position: relative; 
                    top: -40px; 
                    
                }
                img{
                    width: 200px;
                    position: relative;
                    top: 20px;
                
                }
            }
        }

        .title{
            position: relative;
            text-align: center; 
            
            h2{
              color:#ffffff;
              font-family: Arial, sans-serif;
              font-size: 30px;
              letter-spacing:0.5px;
              position: relative;
              z-index: 2;
              font-weight: bold;
              left: -60px;
            }
            img{
                 position: absolute;
                top: -225px; 
                left: 50px;
                transform: translateX(-40%);
                width: 550px; 
                z-index: 1;    
            }
  
         }
      

    }
    
    .steps-icons-yellow::before {
        content: ""; 
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color:rgba(247, 170, 0, 0.8);
        border-radius: 80px 0 0 80px; 
        z-index: 0; 
    }

    
}