@media screen and (max-device-width: 920px), screen and (max-width: 920px){
  body {
      background-color: lightblue;
  }
  .main{ padding:.5rem; }
  .w30,.w40,.w50,.w100{
    width:auto; float:none; margin:1rem auto;
  }
  .bb{ border:0;text-align:center; }
  .bb img{ display:inline-block; border:2px solid #2F3186; }

  .special a{ left:1rem; font-size:100% }

  .content .bigPicBox .textLeft,
  .content .bigPicBox .textRight,
  .content .bigPicBox .textBot { position: static; margin:1rem !important;}
  .content .bigPicBox .nbPad{ padding:0; }
  .content .imgRight{ margin:0 0 1rem 0; float:none; text-align:center}
  .content .imgRight img{ display:inline-block; box-sizing: border-box;}

  .content .vcBox,.content .vcEle{ display:block; }
  .content .vcBox.debox{ margin:0; }
  .content .vcBox.pad{ padding-top:0;  }
  .content  .vcEle .box{ padding-left:0 !important; }

  .content .debox[style="padding-top:1em"]{ padding-top:0 !important; }

  .content video{ max-width:100%; height:auto }

  .footer{ padding-left:1rem; }

  .header{ padding:0 }
  .header img{ max-height:10vh; }

  .centerBox .header{ padding-top:2rem; }
}

@media screen and (max-device-width: 600px), screen and (max-width: 600px){
  .wrapper > label{ display:block !important; color:#000;
    position:fixed; top:1rem; right: 1rem; padding:.5rem .5rem 0; border-radius:.25rem;
    background:rgba(47, 49, 134,.9);cursor: pointer; z-index:1000; color:#eee;}
  .wrapper > label > div{ width:1.5rem; height:2px; background:#eee; margin-bottom:.5rem }

  .special{ text-align:center; }
  .special a{ position:static; display:inline-block; margin:.5rem 0 .75rem;}
  .special a br{ display:none }

  .menu{ display:none; position:fixed; background:#494BA0;
    bottom:0;left:0; width:100%; padding:0; z-index:1000}
  .menu a{ float:none; color:#eee }

  .wrapper > input:checked + .menu{ display:block; }
}
