.avatar {
    vertical-align: middle;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    margin-left: 0px;
    margin-right: 20px;
  }
.avatars{
  margin-bottom: 20px;
  margin-top: 8px;
  margin-left: 0px;
}
.queriescenter{
  display: block;
}
.r2{
  margin-left: 18px;
}
.r3{
  margin-left: 0px;
}

#right{
  z-index: -1;
 }
 .left{
   z-index: 1;
 }
 #red{
    z-index: 1;
}
.mri{
  margin-left: -150px;
  margin-right: 100px;
  
}
.mrt{
  margin-right: -100px;
}
.tm{
  margin-top: -15px;
}
#small-button{
  margin-left: -18px;
  height: 50px;
  width: 150px;
}
.media-date{
  margin-bottom: 18px;
  margin-top: 10px;
  margin-left: 20px;
}
#media-coverage-text{
  margin-top: 100px;
  text-align: center;
}
.dateicon{
  margin-left: 0px;
}
#calendar{
  margin-top: 4px;
}

#cadre{
  max-width: 150%;
    height: auto;
}
section{
  margin-top: -100px;
}
.vid{
  width: 36%;
 height: 47%;
 border-radius: 50%;
 -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
 -webkit-transform: rotate(0.000001deg); 
 background-image: '../img/canalhackit3.png';
 background-size: cover;
 -webkit-border-radius: 100%; 
 -moz-border-radius: 100%;
 position: absolute;
  margin-top: 28.6%;
  margin-left: 28.6%;

}
#imgcanal{
  width: 36.5%;
  height: 47.4%;
  border-radius: 50%;
  -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
  -webkit-transform: rotate(0.000001deg); 
  background-image: '../img/canalhackit3.png';
  background-size: contain;
  background-position: center;
  -webkit-border-radius: 100%; 
  -moz-border-radius: 100%;
  position: absolute;
  margin-top: 20.0%;
  margin-left: 23.7%;
}
#imgcanal2{
  width: 31%;
 height: 31%;
 border-radius: 50%;
 -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
 -webkit-transform: rotate(0.000001deg); 
 -webkit-border-radius: 100%; 
 -moz-border-radius: 100%;
 position: absolute;
  margin-top: 26.1%;
  margin-left: 26.1%;
}
#playicon{
  width: 100%;
  height: 100%;
  border-radius: 50%;
  -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
  -webkit-transform: rotate(0.000001deg); 
  background-image: '../img/canalhackit3.png';
  background-size: contain;
  -webkit-border-radius: 100%; 
  -moz-border-radius: 100%;
  position: absolute;
  margin-top: 0%;
  margin-left: -8%;
}
.video{
  margin-left: -20%;
  object-fit: cover;
}
.part2{
  display: none;
}

@media only screen and (max-width: 1199px) {

  #imgcanal{
    width: 42.5%;
    height: 47.4%;
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
    -webkit-transform: rotate(0.000001deg); 
    background-image: '../img/canalhackit3.png';
    background-size: contain;
    -webkit-border-radius: 100%; 
    -moz-border-radius: 100%;
    position: absolute;
    margin-top: 23.6%;
    margin-left: 28.7%;
  }
  #imgcanal2{
    width: 31%;
   height: 31%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
    margin-top: 32.1%;
    margin-left: 35.1%;
  }
   #playicon{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
    -webkit-transform: rotate(0.000001deg); 
    background-image: '../img/canalhackit3.png';
    background-size: contain;
    -webkit-border-radius: 100%; 
    -moz-border-radius: 100%;
    position: absolute;
    margin-top: 0%;
    margin-left: 0%;
  } 
  .video{
    margin-left: -24%;
    margin-top: -9%;
    object-fit: cover;
  }
  .mri{
    margin-left: 0px;
    margin-right: 0px;
    
  }
  .mrt{
    margin-right: 0px;
  }
 
}
@media only screen and (max-width: 991px) {

  #imgcanal{
    width: 52%;
    height: 48%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
   margin-top: 28.6%;
   margin-left: 13.1%;
  
  }
  #imgcanal2{
    width: 31%;
   height: 31%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
    margin-top: 38.1%;
    margin-left: 23.1%;
  }
  #playicon{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
    -webkit-transform: rotate(0.000001deg); 
    background-image: '../img/canalhackit3.png';
    background-size: contain;
    -webkit-border-radius: 100%; 
    -moz-border-radius: 100%;
    position: absolute;
    margin-top: 0%;
    margin-left: -11%;
  }
  .video{
    margin-left: -50%;
    margin-top: -30%;
    object-fit: cover;
  }
  .mri{
    margin-left: 0px;
    margin-right: 0px;
    
  }
  .mrt{
    margin-right: 0px;
  }
  #cadre {
    max-width: 130%;
    height: auto;
    margin-left: -75px;
  }
}

@media only screen and (max-width: 767px) {
  .part2{
    display: block;
    margin-top: 40px;
  }
  .part1{
    display: none;
  }
  .part3{
    
    margin-top: 40px;
  }
  .media-date{
    margin-bottom: 18px;
    margin-top: 10px;
    text-align: center!important;
  }
  .mri{
    margin-left: 0px;
    margin-right: 0px;
    
  }
  .mrt{
    margin-right: 0px;
  }
  .tm{
    margin-top: -15px;
    text-align: center!important;
  }
  .queriescenter{
    text-align: center!important;
  }
  #imgcanal{
    width: 38%;
    height: 49%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
   margin-top: 20.5%;
   margin-left: 28.5%;
  }
  #imgcanal2{
    width: 31%;
   height: 31%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
    margin-top: 26.1%;
    margin-left: 30.6%;
  }
  #playicon{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
    -webkit-transform: rotate(0.000001deg); 
    background-image: '../img/canalhackit3.png';
    background-size: contain;
    -webkit-border-radius: 100%; 
    -moz-border-radius: 100%;
    position: absolute;
    margin-top: 0%;
    margin-left: -3.4%;
  }
  .mediatitle{
    line-height: 3rem;
    margin-bottom: 15px;
    width: 90%;
  }
  .tcenter{
    display: flex;
  justify-content: center;
  }
 
  .r2{
    justify-content: center!important;
  }
  .r3{
    justify-content: center!important;
  }
  .video{
    margin-left: -30%;
    margin-top: -15%;
    object-fit: cover;
  }
  #cadre{
    margin-left: 5%;
    max-width: 90%;
      height: auto;
  }
  .text-center-respo {
    text-align: center!important;
    width: 80%;
    flex: 0 0 100%;
    max-width: 80%;
  }
  .dateicon{
    margin-left: -3px;
  }
  .avatars{
    margin-bottom: 20px;
    margin-top: 8px;
    margin-left: 0px;
    align-content: center;
    align-self: center;
  }
}
@media only screen and (max-width: 573px) {
  #imgcanal{
    width: 38%;
    height: 49%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
   margin-top: 19.5%;
   margin-left: 28.1%;
  }

}
@media only screen and (max-width: 563px) {
  #imgcanal{
    width: 38%;
    height: 49%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
   margin-top: 20.0%;
   margin-left: 28.5%;
  }

}
@media only screen and (max-width: 465px) {
  .part2{
    display: block;
    margin-top: 40px;
  }
  .part1{
    display: none;
  }
  .part3{
    
    margin-top: 40px;
  }
  .media-date{
    margin-bottom: 18px;
    margin-top: 10px;
    text-align: center!important;
  }
  .mri{
    margin-left: 0px;
    margin-right: 0px;
    
  }
  .mrt{
    margin-right: 0px;
  }
  .tm{
    margin-top: -15px;
    text-align: center!important;
  }
  .queriescenter{
    text-align: center!important;
  }
  #imgcanal{
    width: 37%;
    height: 47%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
   margin-top: 20.4%;
   margin-left: 28.5%;
  }
  #imgcanal2{
    width: 31%;
   height: 31%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
    margin-top: 26.1%;
    margin-left: 30.6%;
  }
  #playicon{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
    -webkit-transform: rotate(0.000001deg); 
    background-image: '../img/canalhackit3.png';
    background-size: contain;
    -webkit-border-radius: 100%; 
    -moz-border-radius: 100%;
    position: absolute;
    margin-top: 0%;
    margin-left: -3.4%;
  }
  .mediatitle{
    line-height: 3rem;
    margin-bottom: 15px;
    width: 90%;
  }
  .tcenter{
    display: flex;
  justify-content: center;
  }
 
  .r2{
    justify-content: center!important;
  }
  .r3{
    justify-content: center!important;
  }
  .video{
    margin-left: -30%;
    margin-top: -15%;
    object-fit: cover;
  }
  #cadre{
    margin-left: 5%;
    max-width: 90%;
      height: auto;
  }
  .text-center-respo {
    text-align: center!important;
    width: 80%;
    flex: 0 0 100%;
    max-width: 80%;
  }
  .dateicon{
    margin-left: -3px;
  }
  .avatars{
    margin-bottom: 20px;
    margin-top: 8px;
    margin-left: 0px;
    align-content: center;
    align-self: center;
  }
}
@media only screen and (max-width: 420px) {
  #imgcanal{
    width: 38%;
    height: 49%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
   margin-top: 19.8%;
   margin-left: 28.4%;
  }

}
@media only screen and (max-width: 360px) {
  #imgcanal{
    width: 38%;
    height: 49%;
   border-radius: 50%;
   -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
   -webkit-transform: rotate(0.000001deg); 
   -webkit-border-radius: 100%; 
   -moz-border-radius: 100%;
   position: absolute;
   margin-top: 19.6%;
   margin-left: 27.5%;
  }

}