.col{

    padding-bottom: 20px;
}
.sam{
    margin: 10px;
    font-family: sans-serif;
    font-size: 12px;
}
.gad{
    font-size: 18px;
    padding-bottom: 100px;
}
.xe{
    width:400px;
    height: 400px;
}
.ss{
    font-family: sans-serif;
}
.res{ 
    margin-left: 80px;
    width: 200px;
    height: 200px;
    text-align: justify;
}
.ress{ 
  
  text-align: justify;
}


.bo{
    font-family: sans-serif;
    position: relative;
    top: 30px;
}
.tl{
    margin: 100px;
    font-size: 18px;
}
.text{
    text-align: justify;
}
.sasa{
    color: #3A3F58;
}

/* videocss */


.containere {
    display: grid;
   
    position: relative;
    left: 200px;
  }
  
  .video-background {
    position: relative;
    z-index: -1;
    width: 1500px;
    height: 600px;
    overflow: hidden;
  }
  
  .video-background video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 150%;
    min-height: 150%;
 
  }
  
  .content {
    z-index: 1;
  }

.sercice{
    width: 600px;
    background-color: #3A3F58;
}
/* .koko{
    background-color: rgb(139, 130, 130);
} */


.kompany{

  
    width: 500px;
    height: 600px;
    margin-left: 100px;
    margin-top: 100px;
    padding: 20px;
    border-radius: 10px;
    position: relative;
    left: 100px;

}
@media only screen and (max-width: 792px) {
    
    .containere {
        display: grid;
       
        position: relative;
        left: 15px;
      }
      
      .video-background {
        position: relative;
        z-index: -1;
        width: 400px;
        height: 400px;
        overflow: hidden;
      }
      
      .video-background video {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        min-width: 150%;
        min-height: 150%;
     
      }
      
      .content {
        z-index: 1;
      }
      .kompany{

        width: 400px;
        position: absolute;
        left: -100px;
       
    
    }
    }
    
    @media only screen and (max-width: 500px) {
    
      .containere {
          display: grid;
         
          position: relative;
          left: 15px;
        }
        
        .video-background {
          position: relative;
          z-index: -1;
          width: 395px;
          height: 400px;
          overflow: hidden;
        }
        
        .video-background video {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          min-width: 150%;
          min-height: 150%;
       
        }
        
        .content {
          z-index: 1;
        }
        .kompany{
  
          width: 450px;
          position: absolute;
          left: -100px;
         
      
      }
      }   

      @media only screen and (max-width: 400px) {
    
        .containere {
            display: grid;
           
            position: relative;
            left: 15px;
          }
          
          .video-background {
            position: relative;
            z-index: -1;
            width: 360px;
            height: 400px;
            overflow: hidden;
          }
          
          .video-background video {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            min-width: 150%;
            min-height: 150%;
         
          }
          
          .content {
            z-index: 1;
          }
          .kompany{
    
            width: 450px;
            position: absolute;
            left: -100px;
           
        
        }
        }