Responsive Youtube Video Embed Code 4

Responsive Video Embedding4.css

    <style>
    .tbn_css_frame_wrap {
        width: 100%;
        max-width: 560px;
        margin: 30px auto; }
    .tbn_css_frame_wrap_inner {
        position: relative;
        padding-bottom: 53%;
        height: 0;
        background-color: #000 !important;
        border: 15px solid #CACACA; }
    .tbn_css_frame_wrap_inner iframe,
    .tbn_css_frame_wrap_inner object,
    .tbn_css_frame_wrap_inner embed {
        position:absolute;
        top:0;
        width:100%;
        height:100%; }
    .bottomshadows {
      position: relative;}
    .bottomshadows:before, .bottomshadows:after {
      z-index: -1;
      position: absolute;
      content: "";
      bottom: 0px;
      left: 10px;
      width: 50%;
      top: 80%;
      max-width:300px;
      background: #777;
      -webkit-box-shadow: 0 15px 10px #777;
      -moz-box-shadow: 0 15px 10px #777;
      box-shadow: 0 15px 10px #777;
      -webkit-transform: rotate(-4deg);
      -moz-transform: rotate(-4deg);
      -o-transform: rotate(-4deg);
      -ms-transform: rotate(-4deg);
      transform: rotate(-4deg);}
    .bottomshadows:after {
      -webkit-transform: rotate(4deg);
      -moz-transform: rotate(4deg);
      -o-transform: rotate(4deg);
      -ms-transform: rotate(4deg);
      transform: rotate(4deg);
      right: 10px;
      left: auto;}
    @media all and (max-width: 400px) {
    .tbn_css_frame_wrap_inner {
        border: 7px solid #CACACA !important; }
    .bottomshadows:before, .bottomshadows:after {
        bottom: 9px !important;} }
    </style>