/**********  support.css  **********/

  /***  Compress with:  http://csscompressor.net/  using "Highest" setting ***/


  /* p {
    min-width: 600px;
    max-width: 900px;
    margin-top: 10px;
  }  */
  a.int-link {
    font-size: 1em;
    font-weight: bold;
    color: #02a;
    text-decoration: none;
  }
  a.int-link:hover {
    font-size: 1em;
    color: #04f;
    text-decoration: underline;
  }
  /* ul li {
    font-size: 1.1em;
    max-width:800px;
    margin-bottom: 7px;
  } */
  ul:not(.pg-hdr-menu) > li > ul > li {
    font-size: 1.0em;
    max-width:750px;
    margin-bottom: 7px;
  }
  ul:not(.pg-hdr-menu) > li > ol > li {
    font-size: 1.0em;
    max-width:750px;
    margin-bottom: 7px;
  }



  /* Begin main sections accordion */
  /* REF:  https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_accordion_symbol  */
  .accordion {    /* This is a <h4> html element, acting as a button... */
    background-color: #eee;
    color: #0051b3;
    cursor: pointer;
    padding: 16px;
    width: 900px;
    border-bottom: 1px solid #bbb;
    text-align: left;
    outline: none;
    transition: 0.4s;   /* "Button" color transition */
  }
  .accordion:hover {
    background-color: #ddd;
  }
  .accordion:after {
    content: '\2304';   /* Down arrow head */
    color: #0051b3;
    font-size: 1.1em;
    font-weight: bold;
    float: right;
    margin-left: 5px;
  }
  .acc-active:after {
    content: '\2303';   /* Up arrow head */
  }
  /* Main section corresponding to the accordion "button" */
  .acc-panel-small, .acc-panel-medium, .acc-panel-large {   /* These are divs, holding the accordion item content */
    background-color: white;
    max-height: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0;
    margin-bottom: 100px;
    position: relative;
    mask-image: none;
  }
  .acc-panel-small {
    transition: max-height 0.4s ease-out;
  }
  .acc-panel-medium {
    transition: max-height 0.6s ease-out;
  }
  .acc-panel-large {
    transition: max-height 0.8s ease-out;
  }
  /* Special class to introduce a linear gradient fade when the main acc-panel-xxxxx is minimized */
  .acc-panel-fade {
    mask-image: linear-gradient(0deg, transparent, white 60%);
  }
  /* .acc-panel-fade:after {
    color: #a00;
    content: 'More...'
  } */

  /* End main sections accordion */



  /* Begin OCFD antenna performance table */
  #ocfd-performance {
    border: 0 solid #aaa;
    border-collapse: separate;
    border-spacing: 1px;   /* Replaces cellspacing */
    width: 100%;
  }
  #ocfd-performance thead tr {
    background-color: #26c;
  }
  #ocfd-performance thead tr th {
    color: #fff;
    padding: 4px;
    vertical-align: bottom;
  }
  /* #ocfd-performance tbody tr {
    background-color: #fff;
  } */
  #ocfd-performance tbody tr td {
    text-align: center;
    padding: 3px;
  }
  /* #ocfd-performance tbody > tr > td:nth-child(1), td:nth-child(2), td:nth-child(3), td:nth-child(4) { */
  #ocfd-performance tbody  tr  td:nth-child(-n+4) {    /* 1st, 2nd, 3rd and 4th - see, e.g.  https://developer.chrome.com/docs/css-ui/css-nth-child-of-s */
    background-color: #f4f4f4;
  }
  #ocfd-performance tbody tr td:nth-child(2), td:nth-child(4), td:nth-child(11) {
    border-right: 1px solid #666;
  }
  /* End OCFD antenna performance table */



  /* Animated OCFD VSWR charts */
  .anim-block{
    /* height: 100vh; */
    position: relative;
    background-color:#111;
    overflow:hidden;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction:column;
  }


  /* OCFD animation images */
  .ocfd-img-div{
     visibility:hidden;
     background-repeat: repeat;
     background-size: cover;
     background-position: center;
     width:800px;
     height:324px;
     position:absolute;
  }
  .ocfd-img1{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_10.png");
  }
  .ocfd-img2{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_12.png");
  }
  .ocfd-img3{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_14.png");
  }
  .ocfd-img4{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_16.png");
  }
  .ocfd-img5{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_18.png");
  }
  .ocfd-img6{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_20.png");
  }
  .ocfd-img7{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_22.png");
  }
  .ocfd-img8{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_24.png");
  }
  .ocfd-img9{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_26.png");
  }
  .ocfd-img10{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_28.png");
  }
  .ocfd-img11{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_30.png");
  }
  .ocfd-img12{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_32.png");
  }
  .ocfd-img13{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_34.png");
  }
  .ocfd-img14{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_36.png");
  }
  .ocfd-img15{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_38.png");
  }
  .ocfd-img16{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_40.png");
  }
  .ocfd-img17{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_42.png");
  }
  .ocfd-img18{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_44.png");
  }
  .ocfd-img19{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_46.png");
  }
  .ocfd-img20{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_48.png");
  }
  .ocfd-img21{
    background-image: url("../grafx/ocfd_40m_vswr_images/ocfd_vswr_chart_50.png");
  }


  /* Horizontal Moxon animation images */
  .moxn-img-div{
     visibility:hidden;
     background-repeat: repeat;
     background-size: cover;
     background-position: center;
     width:900px;
     height:336px;
     position:absolute;
  }
  .moxn-img1{
    background-image: url("../grafx/moxon_10m_patt_images/azim_elev_4.png");
  }
  .moxn-img2{
    background-image: url("../grafx/moxon_10m_patt_images/azim_elev_5.png");
  }
  .moxn-img3{
    background-image: url("../grafx/moxon_10m_patt_images/azim_elev_6.png");
  }
  .moxn-img4{
    background-image: url("../grafx/moxon_10m_patt_images/azim_elev_7.png");
  }
  .moxn-img5{
    background-image: url("../grafx/moxon_10m_patt_images/azim_elev_8.png");
  }
  .moxn-img6{
    background-image: url("../grafx/moxon_10m_patt_images/azim_elev_9.png");
  }
  .moxn-img7{
    background-image: url("../grafx/moxon_10m_patt_images/azim_elev_10.png");
  }


  /* Vertical Moxon animation images */
  .vert-moxn-img-div{
     visibility:hidden;
     background-repeat: repeat;
     background-size: cover;
     background-position: center;
     width:900px;
     height:336px;
     position:absolute;
  }
  .vert-moxn-img1{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_1.png");
  }
  .vert-moxn-img2{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_2.png");
  }
  .vert-moxn-img3{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_3.png");
  }
  .vert-moxn-img4{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_4.png");
  }
  .vert-moxn-img5{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_5.png");
  }
  .vert-moxn-img6{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_6.png");
  }
  .vert-moxn-img7{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_7.png");
  }
  .vert-moxn-img8{
    background-image: url("../grafx/moxon_10m_patt_images/vert_azim_elev_8.png");
  }


  /* Progress buttons for the animations */
  .prog-btn {
    background-size:12px !important;
    background-position: 4px 3px;
    background-repeat:no-repeat;
    font-size:1em;
    color:#000;
    width:25px;
    height:23px;
    padding:0;
    margin:0 0 0 1px;
    border-radius:3px;
    cursor:pointer;
  }
  .prog-btn:active {
    background-position: 5px 3px;
  }
  .pb-start {
    background-image:url(../grafx/progress_start.png);
  }
  .pb-jog-back {
    background-image:url(../grafx/progress_jog_back.png);
  }
  .pb-jog-forward {
    background-image:url(../grafx/progress_jog_forward.png);
  }
  .pb-pause {
    background-image:url(../grafx/progress_pause.png);
  }
  .pb-stop {
    background-image:url(../grafx/progress_stop.png);
  }





  .inline-hilite {
    color: #00a;
    font-size: 1em;
    font-weight: bold;
    font-style: italic;
  }




/**********  EOF  **********/