/* CSS Reset & Vars Styles v2.0 by Ron Craig*/
/* Written 29 Oct 2020 : Revised 15 Mar 2023 */
/* Flexbox startup
   # - id="" - can only be used 1nce per page
   . - class="" - can be used multiple times per page */
/*  The width & height properties do not include padding, border, & margin of the element  */

  /* Side Menu - main vertical menu */
  .side-menu {
    width:184px;
    margin:1rem auto;
    font:italic bold 1.3rem/2.8rem cursive,sans-serif;
  }
  .side-menu ul {
     position:relative; border-top:8px solid #ccc; border-right:8px solid #636363; border-bottom:8px solid #636363; border-left:8px solid #ccc;
  }
  .side-menu li {
    border:1px solid #fff;
    border-width:0 1px 1px 1px;
  }
  .side-menu li.top { border-top:1px solid #fff; }
  .side-menu a {
    display:block;
    text-align:center;
    margin:0 auto;
    background:#00f;
  }
  .side-menu a:hover { color:#ff0; border-color:#f0f; background:#90f; }
  .side-menu li:hover { margin:-1px 0 0; border:1px solid #f0f; }
  .side-menu li:first-child:hover { margin:0; }

  /* Main Page Layout */
  .main-header { padding:4rem 0 3rem; }

  .meetinimg { max-width:500px; }
  .netimg { max-width:250px; }
  .ad {
    padding:1rem 1rem;
    font:italic bold 2.6rem cursive,sans-serif;
    border-radius:1rem;
  }

  .section-head {
    font-size:4rem;
    padding:2.5rem 0;
  }

  /* Calendar table fix for responsiveness */
  /* .box {
    max-width:950px;
    margin:1rem auto;
    //padding:1rem;
  } */
  #evntCal, #contestCal, #vuhfCal {
    /* max-width:950px; */
    margin:0 auto 1rem;
    padding:1rem;
    border-radius:1rem;
    font-size: 2.2rem;
    background:#ccc;
  }

  .flx-container { border:2px solid #bbb; border-radius:1rem; }
  .flx-tabl {
    display:flex;
    align-items:baseline;
    align-content:center;
    padding-left:0.5rem;
    line-height:3rem;
    font-size:2rem;
    text-align:left;
  }
  .flx-tabl:nth-child(2n + 3) { background:#f2f2f2; }
  .flx-tabl a, .flx-tabl p, .flx-tabl div {
    /*padding-left:1rem;*/
    text-align:left;
    font-size:2rem;
  }
  .flx-tabl .headx { font-size:3.6rem; line-height:6rem; }
  .flx-tabl p.colname { padding:0.5rem 0 0.5rem 1rem; }
  .flx-tabl .col1 { flex:3; border-right:2px solid #ccc; }
  .flx-tabl .col2 { flex:2; padding-left:0.5rem; }
  .bdr-top { border-top:2px solid #bbb; }
  @media(max-width:768px) {
    .box { max-width:500px; }
    .dayt-box { font-size:2rem; }
    .sp-box { max-width:500px; }
    .flx-tabl { flex-direction:column; }
    /* .flx-tabl a, .flx-tabl p, .flx-tabl div { padding:0 1rem; } */
    /*.flx-tabl p.colname { padding:0.5rem 0 0.5rem 2rem; }*/
    .flx-tabl .col1 { padding-left:2rem; border-right:0; }
    .flx-tabl .col2 { padding-left:1rem; }
  }

  /* Header */
  header, header h1 { height:110px; padding:0.5rem; }
  .head         { height:110px; padding:0.5rem; }
  .head-top {
    max-width: var(--inner-width);
    margin:0 auto;
    display:flex;
    justify-content:space-evenly;
    align-items:center;
    text-align:center;
    /* background:#f0f; */
  }
  .head-top .item img { display:block; width:133px; height:184px; }
  .head-top .item .headr { flex:4; }
  @media(max-width: 1200px) {
    .head-top .item img { display:none; }
  }
  .headr     { max-width:650px; padding:1rem; background-color:rgb(0,255,255); }

  .container-header,
  div.header {
    /* max-width:1250px; */
    /* height:240px; */
    margin:auto;
    display:flex;
    justify-content:center;
    align-items:center;
    /* background:#f0f; */
  }
  /* div.header {
    display:flex;
    max-width:1250px;
  } */
  .container-header img {
    width:97%;
    margin
    /*padding:2rem 0.5rem 0.5rem;*/
  }
  /* .container-header { display:none; } */

  /* Login */
  #container {
    max-width:400px;
    margin:auto;
    padding:20px;
    border-radius:10px;
    text-align:left;
  }
  .form-wrap {
    background:#ccc;
    padding:15px 25px;
    border-radius:10px;
    color:#333;
  }
  .form-wrap .form-group {
    margin-top:15px;
  }
  .form-wrap .form-group label {
    display:block;
    margin-bottom:5px;
    color:#666;
  }
  .form-wrap .form-group input {
    width:100%;
    padding:10px;
    border:1px solid #ddd;
    border-radius:5px;
  }
  .form-wrap input[type='submit'] {
    display:block;
    width:100%;
    margin-top:20px;
    padding:10px;
    font-size:16px;
    background:#49c1a2;
    color:#fff;
    cursor:pointer;
    border-radius:5px;
  }
  .form-wrap input[type='submit']:hover {
    background:#37a08e;
  }
  .form-wrap a {
    display:block;
    margin-top:20px;
    color:#00f;
    text-align:center;
  }

  /* section: repeater-dipole */
  .repeater-dipole {
    display:flex;
    justify-content:space-between;
  }
  .repeater-dipole a img { display:block; }
  .repeater-dipole a.item-1 { flex:0 0 168px; order:1; }
  .repeater-dipole .item-2 { max-width:530px; order:2; }
  .repeater-dipole a.item-3 { flex:0 0 200px; order:3; }

  .new-radio {
    display:flex;
    justify-content:space-evenly;
  }
  @media(max-width:1200px) {
    .repeater-dipole .item-2,
    .new-radio .item-2 {
      font-size:1.6rem;
    }
  }
  @media(max-width: 910px) {
    .repeater-dipole  {
      display:flex;
      justify-content:space-between;
      /* justify-content:center; */
      align-items:center;
      align-content:center;
      text-align:center;
      max-width:500px;
      flex-wrap:wrap;
      /* height:330px; */
      background:#ccc;
    }
    .repeater-dipole a { margin:0; padding:0; border:0; }
    .repeater-dipole a img { display:block; margin:0; padding:0; }
    .repeater-dipole a.item-1 { flex:0 0 168px; order:1; }
    .repeater-dipole .item-2 { /*flex:0 1 500px;*/ order:3; }
    .repeater-dipole a.item-3 { flex:0 0 200px; order:2; }
  }

  .eqsl      { width:150px; margin:0.5rem 2rem 0; padding:0.5rem; border-radius:0.5rem; text-align:center; }
  .eqsl2     { width:150px; margin:8rem auto 0; padding:0.5rem; border-radius:0.5rem; text-align:center; }
  .qrz       { width:150px; margin:0.5rem 2rem 0; padding:0.5rem; border-radius:0.5rem; text-align:center; }
  .solar     { max-width:100%; margin:1rem auto; padding:1.5rem; border:1px solid #000; border-radius:1rem; background-color:#000; }
  span.znam        { line-height:2.5rem; padding-top:0.8rem; display:block; text-align:center; color:#00f; font:italic bold 2rem cursive,Arial,sans-serif; }
  span.ztym        { line-height:2.5rem; padding:0 0 1rem; display:block; text-align:center; color:#f00; font:italic bold 1.9rem cursive,Arial,sans-serif; }

  div.tzclok     { max-width:684px; margin:0 auto; padding: 1rem 0.5rem 0.7rem; text-align:center; font:italic bold 2rem/3.4rem cursive,sans-serif; background:#000; border-radius:0.5rem; }
  div.tzclokbotm { max-width:684px; margin:0 auto; text-align:center; color:#00f; font:italic bold 2rem/3.4rem cursive,sans-serif; }
  table.tzclk    { max-width:670px; margin:1rem auto 0; color:#333; border-collapse:collapse; }
  /*-.tzclk tr      { line-height:3.6rem; }*/
  .tzclk td      { text-align:center; }
  .tzclk td.end  { width:140px; padding:0 1rem 0 0; text-align:right; }

  a.link  { width:100%; padding:1rem; text-align:center; font:italic bold 3rem/4rem cursive,sans-serif; }
  /* a.link  { width:100%; padding:3px; text-align:center; font-size:2.4rem; font-style:italic; font-weight:bold; } */
  a.lnka  { width:100%; line-height:3rem; padding:0.4rem 0; display:inline-block; font:italic bold 2.2rem cursive,Arial,sans-serif; }
  a.lnkb  { padding: 0.4rem 0; display:inline-block; font:italic bold 2.2rem cursive,Arial,sans-serif; }
  span.blnk, a.blnk { font:italic bold 3rem/1.4 cursive,Arial,sans-serif; }
  span.dlnk, a.dlnk { font:italic bold 3.6rem/1.4 cursive,Arial,sans-serif; }
  /* span.dlnk, a.dlnk { font:italic bold 3rem/1.4 cursive,Arial,sans-serif; } */
  a.ilnk        { font:italic bold 2.4rem cursive,Arial,sans-serif; }
  a.norm        { padding: 0.3rem; font-style:italic; font-weight:bold; }
  a.norm-red    { padding: 0.3rem; color:#f00; font-size:5rem; text-align:center; font-style:italic; font-weight:bold; }
  a.page        { padding: 0.3rem; font-size:2.4rem; font-style:italic; font-weight:bold; }
  a.bpage       { padding: 0.3rem; font-size:2.4rem; font-style:italic; font-weight:bold; }
  a.ssiz        { padding: 0.3rem; font-style:italic; font-weight:bold; }
  a.links       { padding: 0.3rem; display:inline-block; font-style:italic; font-weight:bold; }
  a.inlnlinks   { max-width:45%; margin:0 auto 1rem; padding:0.5rem 1rem; display:inline-block; border:1px solid #aaa; border-radius:1rem; font:italic bold 2.2rem cursive,Arial,sans-serif; background-color:#ccc; }
  a.inlnlinks:hover { border:1px solid #0f0; border-radius: 1rem; color:#008000; }
   /* font:italic bold 24px/1.4 Arial,sans-serif; */
  p.msgred      { background-color:#fcc; }
  p.msggrn      { background-color:#d9ffcc; }
  p.msgmag      { background-color:#fcf; }
  p.msgblue     { background-color:#99ebff; }
  /* p.msggrn      { margin:0; padding:1rem 0; color:#000; font-size:2.4rem; font-style:italic; font-weight:bold; border-radius:1rem; background-color:#d9ffcc; } */
  .clock         { max-width:700px; line-height:2.2rem; margin:2rem auto; padding:1rem; border:1px solid #ccc; border-radius:2rem; display:block; word-wrap:break-word; text-align:center; color:#fff; font:italic bold 2.2rem cursive,Arial,sans-serif; background-color:#666; }
  .clok          { max-width:720px; margin:1rem auto; padding:1rem; border:1px solid #000; border-radius:1rem; text-align:center; font:italic bold 2rem/1.4 cursive,Arial,sans-serif; background-color:#ccc; }
  .test          { margin:0 auto 1rem; padding:1rem; /*border:1px solid #444;*/ border-radius:1rem; color:#00f; text-align:left; font:italic bold 2.4rem cursive,Arial,sans-serif; /*background-color:#bbb;*/ }
  #meetings      { max-width:1000px; margin:0 auto; /*padding:1.5rem 1rem;*/ border-radius:1rem; background-color:#ccc; }

  div.skey      { max-width:1150px; margin:0 0 1rem 3rem; padding:1.5rem; border-radius:1rem; clear:both; background-color:#ccc; }
  div.skey p    { margin:1rem 3rem; font:italic 1.8rem Arial,cursive,sans-serif; text-align:left; }
  img.imglt     { margin:1rem 2rem 1rem; float:left; }
  img.imgrt     { margin:1rem 0 1rem 2rem; float:right; }

  /* .box             { width:600px; margin:15px auto 0; padding:10px; border:1px solid #444; clear:both; color:#fff; font-size:14px; background-color:#454545; }*//*-moz-border-radius:10px; -webkit-border-radius:10px; }*/
  /* .box      { max-width:750px; margin:15px auto 0; padding:10px; border:1px solid #303030; color:#00f; font-size:18px; font-style:italic; background-color:#c0c0c0; } */
  .transbox             { max-width:650px; line-height:25px; margin:1.5rem auto; padding:1rem; border:1px solid #666; border-radius:10px; color:#0ff; text-align:center; background-color:#4447; /*opacity:0.7;*/ }/*filter:alpha(opacity=80); background-color:#b0b0b0;*/
  .transbox a:visited   { color:#b0b0b0; }
  .transbox h2          { margin:0 0 10px; padding:5px 0; font-style:italic; text-align:center; background-color:#c0c0c0; }
  .transbox p           { margin:0; font-style:italic; text-align:center; }
  .transbox p a:visited { color:#f00; }
  .transbox p.hilite    { margin:0; padding:10px 0; background-color:#fbb; }
  .transbox img.small   { height:35px; margin:5px 10px; padding:0; }
  .transbox * { z-index:5; }
  div#solar-wide   { max-width:630px; margin:1rem auto; padding:1rem; border:0; border-radius:1rem; background-color:#000; }
  table.icontst        { width:450px; margin:10px auto 6px; padding:0; border:0; }/*border:1px solid #fff; }*/
  p.icontst            { margin:10px; padding:0; border:0; }
  .icontst a,
  .icontst a img       { margin:0; padding:0; border:0; }
  .buttonbox            { width:250px; margin:0 auto; padding:0; border:1px solid #444; border-width:0 1px 1px; font-size:20px; text-align:center; background-color:#c0c0c0; }
  .buttonbox a.top      { border-top:1px solid #000; }
  .buttonbox a          { width:250px; line-height:30px; margin:0 auto; padding:5px 0; display:block; color:#00f; font-size:20px; font-style:italic; text-align:center; background-color:#c0c0c0; }
  /*.buttonbox a:visited  { color:#f00; }*/
  .buttonbox a:hover    { color:#fff; background-color:#00f; }
  .menupic      { /*height:35px;*/ margin:-25px auto 0; padding:0 0 0 1px; position:relative; }
  .menupic li   { width:150px; margin:0; padding:0; float:left; color:#0f0; font-size:16px; }
  .menupic li a { width:150px; line-height:20px; display:block; float:left; color:#0f0; font-weight:bold; font-style:italic; text-align:center; font-family:arial, verdana, sans-serif; /*border:#fff solid 1px;*/ }
  .menupic li a:hover { color:#ff0; }
  #slyd-700-lablex  { width:870px; height:49px; margin:59px 0 0 170px; padding:0; border:0; /*float:left;*/ /*border:1px solid #fff;*/ }
  #slyd-800-lablex  { width:870px; height:49px; margin:59px 0 0 170px; padding:0; border:0; /*float:left;*/ /*border:1px solid #fff;*/ }
  .slyd-700-lable   { width:704px; height:40px; margin:60px auto 0; padding:20px 10px 0; border:0; text-align:center; color:#0f0; font-size:20px; z-index:2000; background-color:#656565; }
  .slyd-800-lable   { width:804px; height:40px; margin:60px auto 0; padding:20px 10px 0; border:0; text-align:center; color:#0f0; font-size:20px; z-index:2000; background-color:#656565; }

    /* 4:3pix -land - landscape 700px X 525px, -port - portrait 394px X 525px black - #000 brown - #630 */
  .slyd-700-txt     { margin:0 auto; padding:0; color:#0f0; font-size:20px; font-weight:bold; font-style:italic; }
  .slyd-700-img     { width:700px; height:525px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-700-land    { width:700px; height:525px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-700-port    { width:394px; height:525px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-700         { width:704px; height:529px; margin:10px auto 0; padding:10px; border:0; background-color:#656565; }
  .slyd-700-label   { width:704px; height:44px; margin:0 auto; padding:10px; border:0; color:#0f0; font-size:20px; background-color:#656565; }
  .slyd-700-nav     { width:704px; height:64px; margin:0 auto 10px; padding:10px; border:0; background-color:#656565; }

    /* 4:3pix -land - landscape 800px X 600px, -port - portrait 450px X 600px black - #000 brown - #630 */
  .slyd-800-txt     { margin:0 auto; padding:10px 0; color:#0f0; font-size:20px; font-weight:bold; font-style:italic; }
  .slyd-800-img     { width:800px; height:600px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-800-land    { width:800px; height:600px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-800-port    { width:450px; height:600px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-800         { width:824px; height:624px; margin:10px auto 0; padding:10px; border:0; border-radius:5px 5px 0 0; background-color:#656565; }
  .slyd-800-label   { width:824px; height:60px; margin:0 auto; padding:10px 0 20px; border:0; color:#0f0; font-size:20px; background-color:#656565; }
  .slyd-800-nav     { width:824px; height:84px; margin:0 auto 10px; padding:10px 0 40px; border:0; border-radius:0 0 5px 5px; background-color:#656565; }

    /* 3:2pix -land - landscape 800px X 533px, -port - portrait 355px X 533px black - #000 brown - #630 */
  .slyd-800w-txt    { margin:0 auto; padding:0; color:#0f0; font-size:20px; font-weight:bold; font-style:italic; }
  .slyd-800w-img    { width:800px; height:533px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-800w-land   { width:800px; height:533px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-800w-port   { width:355px; height:533px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-800w        { width:804px; height:537px; margin:10px auto 0; padding:10px; border:0; background-color:#656565; }
  .slyd-800w-label  { width:804px; height:44px; margin:0 auto; padding:10px; border:0; color:#0f0; font-size:20px; background-color:#656565; }
  .slyd-800w-nav    { width:804px; height:64px; margin:0 auto 10px; padding:10px; border:0; background-color:#656565; }

    /* 3:2pix -land - landscape 700px X 466px, -port - portrait 310px X 466px black - #000 brown - #630 */
  .slyd-700w-txt    { margin:0 auto; padding:0; color:#0f0; font-size:20px; font-weight:bold; font-style:italic; }
  .slyd-700w-img    { width:700px; height:466px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-700w-land   { width:700px; height:466px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-700w-port   { width:310px; height:466px; margin:0 auto; padding:0; border:2px solid #630; background-color:#ccc; }
  .slyd-700w        { width:704px; height:470px; margin:10px auto 0; padding:10px; border:0; background-color:#656565; }
  .slyd-700w-label  { width:704px; height:44px; margin:0 auto; padding:10px; border:0; color:#0f0; font-size:20px; background-color:#656565; }
  .slyd-700w-nav    { width:704px; height:64px; margin:0 auto 10px; padding:10px; border:0; background-color:#656565; }

  #phantmi-slide img { width:695px; height:521px; margin:0 auto; padding:0; border:3px solid #630; }
  #phantmi-lable     { width:702px; margin:-7px auto 10px; padding:15px 0; border:0; color:#f00; font-weight:bold; font-style:italic; background-color:#454545; border-left:2px; text-align:center; font-size:14pt; }

  /* Footer */
  .footer       { max-width:var(--inner-width); margin:2rem auto; color:#00f; text-align:center; font-weight:bold; font-style:italic; }/*border:1px solid #ff0; }*/
  .footer img   { width:88px; height:31px; padding:1rem; border:none; }
  .footer p     { padding:0.5rem 0; }
  .footer .transbox { max-width:600px; line-height:2.5rem; margin:1.5rem auto 1rem; padding:1rem; border:1px solid #444; color:#00f; text-align:center; background-color:#b0b0b0; opacity:0.8; border-radius:1rem; }


  #colage { max-width:1250px; margin:50px auto; padding:0; border:0; }
  #colagePix { line-height: 70%; /*10px;*/ }
  #colagePix {
    -moz-column-count:6;
    -moz-column-gap:0px;
    -webkit-column-count:6;
    -webkit-column-gap:0px;
    column-count:6;
    column-gap:0px;
    max-width:1190px;
  }
  #colagePix img { width:100%; margin:0; padding:0; border:0; display:inline-block; }
  #colagePix li { margin:-4px 0 0; padding:0px; border:0px; list-style-type:none; }
  #colagePix a  { margin:0px; padding:0px; border:0px; display:block; text-decoration:none; }

  @media only screen and (max-width:1189px),
  only screen and (max-device-width:1189px) {
    #colagePix {
      -moz-column-count:5;
      -moz-column-gap:0px;
      -webkit-column-count:5;
      -webkit-column-gap:0px;
      column-count:5;
      column-gap:0px;
      max-width:990px;
    }
    #colage { max-width:990px; }
  }

  @media only screen and (max-width:989px),
  only screen and (max-device-width:989px) {
    #colagePix {
      -moz-column-count:4;
      -moz-column-gap:0px;
      -webkit-column-count:4;
      -webkit-column-gap:0px;
      column-count:4;
      column-gap:0px;
      max-width:790px;
    }
    #colage { max-width:790px; }
  }

  @media only screen and (max-width:789px),
  only screen and (max-device-width:789px) {
    #colagePix {
      -moz-column-count:3;
      -moz-column-gap:0px;
      -webkit-column-count:3;
      -webkit-column-gap:0px;
      column-count:3;
      column-gap:0px;
      max-width:590px;
    }
    #colage { max-width:590px; }
  }

  @media only screen and (max-width:589px),
  only screen and (max-device-width:589px) {
    #colagePix {
      -moz-column-count:2;
      -moz-column-gap:0px;
      -webkit-column-count:2;
      -webkit-column-gap:0px;
      column-count:2;
      column-gap:0px;
      max-width:390px;
    }
    #colage { max-width:390px; }
  }

/* EOF */
