* {
          margin: 0;
          padding: 0;
          box-sizing: border-box;
}
.vm1.header{
          padding:0em;
}

.vm1.main {
          display: flex;
          flex-direction: column;
          width: 100%;
          padding: 1em 2em;
          max-width: 100%;
}

.flex_1 {
          width: 100%;
          height: 100%;
          /* background-color:white; */
          position: relative;
          overflow: hidden;
          border: 10px solid black;

}
.logo{
   position: absolute;
   left:0;
   z-index: 999;
   max-width: 100%;
}


.img_1 {
          width: 100%;
          max-width: 100%;
          background-color: rgb(175, 169, 169);
}

.img_2 {
          width: 100%;
          max-width: 100%;
          position: absolute;
          left: 0;
          filter: drop-shadow(8px -25px 0px black);
}
.img_3{
   width: 100%;
   position: absolute;
   filter: drop-shadow(0px 2px 0px black);
   left: 0;
}
.flex_2{
          background-color: black;
          padding: 1em;
          margin:-1em 0em;
          z-index: 999;
}

.color_div_1,.color_div_2{
          display: flex;
          color: white;
          justify-content: center;
          align-items: center;
          margin: 1em 0  ;
}
.color_div_1 p,.color_div_2 p{
         font-size: 18px;
         padding:0 15px 0 0;
}

.vm1 ul {
          display: flex;
          flex-wrap: wrap;
          flex-direction: row;
}

.vm1 li {
          list-style: none;
          margin: 0em 8px 0;
}

 .vm1 a {
          width: 35px;
          height: 35px;
          display: block;
          box-shadow: 0px 0px 1px 2px #fff;
          background-color: red;
}
.tooltip {
          position: relative;
}

.tooltip .tooltiptext {
          visibility: hidden;
          width: 120px;
          background-color: black;
          color: #fff;
          text-align: center;
          border-radius: 6px;
          padding: 5px 0;
          position: absolute;
          z-index: 1;
          top: -35px;
          left: -35px;
}

.tooltip:hover .tooltiptext {
          visibility: visible;
}
@media screen and (max-width: 768px) {
   .logo{
      width:100px;
   }
          .main{
                    padding: 0;
          }
          .img_2{
               filter: drop-shadow(8px -10px 0px black);
          }
          .color_div_1,.color_div_2{
                    flex-direction: column;
                    flex-wrap: wrap;
          }
          li {
                   margin: 10px;
          }
          
}



/* .flex_1{
         
          background-color: white;
    
     
}
 .img_wrap{
} 
.img_wrap img{
          width: 100%;
          max-width: 100%;
}
.img_wrap .img_1{
          background:blue;
        
}
.img_wrap .img_2{
          filter: drop-shadow(2px 10px 0px yellow);
}
@media screen and (max-width: 760px) {
        
} */
/* .img_wrap{
          /* display: flex; */
/* justify-content: center; */
/* width:80%;
          height:100vh;
          overflow:hidden; */

/* 
img {
          position: relative;
          top: 0;
          width: 100%;
          /* overflow: hidden; */
/* 
.tooltip {
          position: relative;
}

.tooltip .tooltiptext {
          visibility: hidden;
          width: 120px;
          background-color: black;
          color: #fff;
          text-align: center;
          border-radius: 6px;
          padding: 5px 0;
       
          position: absolute;
          z-index: 1;
          top: -35px;
          left: -35px;
}

.tooltip:hover .tooltiptext {
          visibility: visible;
}

ul {
          display: flex;
          flex-wrap: wrap;
          flex-direction: row;
}

li {
          list-style: none;
          margin: 15px;
}

a {
          width: 35px;
          height: 35px;
          display: block;
          box-shadow: 0px 0px 1px 2px #000;
          background-color: red;
} */
/* #img0{
          background-color: red;
          z-index: -99;
}
#img1{
          z-index: 999;
          filter: drop-shadow(2px 10px 0px yellow);
} 
   <div class="img_wrap"><img src="image9.png" id="img0" /><img src="image9.png" id="img1" /></div>
*/