.iframe {
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  margin-bottom: 1em;
  height: 0px;
  overflow: hidden;
  padding-top: 56.25%;
  position: relative;
  width: 100%;
  border-radius: 0.4em;
}
.iframeSingleVideo {
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  margin-bottom: 1em;
  height: 0px;
  overflow: hidden;
  padding-top: 30%;
  position: relative;
  width: 100%;
  border-radius: 0.4em;
}
/*-- -------------------------- -->
<---           Tools            -->
<--- -------------------------- -*/
/* Mobile */
@media only screen and (min-width: 0rem) {
  #tools .container {
    padding-top: 2em;
  }
  #tools .item {
    margin-bottom: 2em;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #tools .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 1em;
  }
  #tools .singleVideoContainer {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    gap: 1em;
  }
  #tools .item {
    grid-column: span 1;
    grid-row: span 1;
  }
  #tools .singleVideoItem {
    grid-column: span 1;
    grid-row: span 1;
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #tools .container {
    grid-template-columns: repeat(3, 1fr);
  }
  #tools .singleVideoContainer {
    grid-template-columns: 1fr;
  }
   
}
/* Large Desktop - 1300px */