#header-pdc-anime {
 background-color: rgba(47, 41, 29, 1.00);
 border-bottom: solid 8px #43733d;
}

#header-pdc-anime #animation_container {
 position: relative;
 display: block;
 margin: 0 auto;
 width: 100vw !important;
 height: 36vh !important;
 /*left: -100%;
 right: -100%;
 top: -100%;
 bottom: -100%;
 width: 100vw !important;
 height: 58vh !important;
*/
 overflow: hidden;
 z-index: 50 !important;
}

#header-pdc-anime #canvas {
 position: absolute;
 display: block;
 margin: 0;
 top: 50%;
 left: 50%;
 width: auto !important;
 height: 100% !important;
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 z-index: 49 !important;
 /*



 width: auto !important;
 height: 100% !important;

 margin: auto;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 width: auto !important;
 height: 100% !important;
 z-index: 1;
 */
}

#header-pdc-anime #dom_overlay_container {
 pointer-events: none;
 overflow: hidden;
 left: 0;
 top: 0;
 position: absolute;
 display: block;
 width: 100vw !important;
 height: 36vh !important;
}

@media (min-width: 576px) {
 #header-pdc-anime #canvas {
  width: auto !important;
  height: 100vw !important;
 }
}

@media (min-width: 768px) {
 #header-pdc-anime #canvas {
  width: auto !important;
  height: 100vh !important;
 }
}

@media (min-width: 992px) {
 #header-pdc-anime #canvas {
  width: 100vw !important;
  height: auto !important;
 }
 #header-pdc-anime #animation_container {
  width: 100vw !important;
  height: 38vw !important;
 }
}

@media (min-width: 1200px) {
 #header-pdc-anime #animation_container {
  width: 100vw !important;
  height: 38vw !important;
 }
}