.preSite
{
    position: relative;
    float: left;
    width: calc(100% - 30px);
    /* width: calc(100% - 20px); */
    padding: 0 10px 0 10px;
    /* margin: 5px 5px 0px 5px; */
    height: 40px;
    line-height: 40px;
    /* background-image: url("../img/background.png"); */
    background-image: rgba(255, 255, 255, 0.80), rgba(255, 255, 255, 1.0), rgba(255, 255, 255, 0.80);
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.3));
    border-radius: 5px;
}

.preSite div
{
    position: relative;
    float: left;
}

.social-media-links
{
    position: relative;
    float: left;
}
.social-media-links a
{
     float: left;
     margin: 4px 0 0 4px;
     width: 32px;
     height: 32px;
     /* border-right: 1px solid #455F81; */
     padding-right: 4px;
     padding-left: 4px;
}

.social-media-links a img
{
     float: left;
     width: 100%;
     height: 100%;
}

.navWrapper
{
     z-index: 999;
     position: relative;
     float: left;
     /* width: calc(100% - 20px); */
     width: 100%;
     /* margin-top: 10px;
     margin-left: 10px; */
     height: 64px;
     /* border-radius: 5px; */
     /* border-radius: 0 0 5px 5px; */
     /* background-color: #fff; */
     /* padding-top: 8px;
     padding-bottom: 6px; */
     overflow: hidden;
     /* border-bottom: 1px solid #bbb; */
     /* box-shadow: 0 2px 10px 1px #bbb; */
     /* background-image: url("../img/backLightGrey.png"); */
     /* box-shadow: 1px 1px 2px 0 #333333; */
     /* background-color: rgba(255, 255, 255, 0.80);
     backdrop-filter: blur(5px);
     box-shadow: 1px 1px 5px 0 #222; */
     
}

.navMain
{
     position: relative;
     /* max-width: 480px; */
     height: 64px;
     margin: auto;
     /* padding: 0 10px 0 10px; */
     /* background-color: rgba(255, 255, 255, 0.80); */
     background-image: linear-gradient(to right, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.8));
     -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
     /* border-radius: 5px; */
     box-shadow: 1px 1px 5px 0 #222;
}

.navMain a
{
     display: block;
     position: relative;
     float: left;
     width: 64px;
     height: 100%;
     line-height: 64px;
     text-align: center;
     /* padding-bottom: 4px;
     border-radius: 5px; */
     color: #222;
     /* padding: 0 5px 0 5px; */

     /* background-color: rgba(255, 255, 255, 0.85);
     box-shadow: 1px 1px 1px 0 #222;
     backdrop-filter: blur(5px); */
}

.navMain a img
{
     position: relative;
     margin: 0;
     width: 64px;
     height: 64px;
     border-radius: 5px;
}

.navMain a:hover:before, .navMain a:focus:before
{
     visibility: visible;
     transform: scaleX(1);
}

.navMain a:hover
{
     /* background-color: rgba(255, 255, 255, 0.92);
     box-shadow: 1px 1px 1px 0 #222; */
}

.navCenter a:before
{
     content: "";
     position: absolute;
     width: 100%;
     height: 0px;
     bottom: 10px;
     left: 0;
     visibility: hidden;
     border-radius: 5px;
     transform: scaleX(0);
     transition: 0.15s linear;
     /* background: #455F81;
     border: 2px solid #455F81; */
     background: #fff;
     border: 1px solid #455F81;
}

.navLeft
{
     float: left;
     width: 64px;
     height: 64px;
}

.navCenter
{
     position: absolute;
      width: 284px; /* 390px */
     top: 0;
     left: 50%;
     margin: 0 0 0 -142px; /* -158px */
}

.navCenter :nth-child(5), .navCenter :nth-child(6), .navCenter :nth-child(7)
{
     display: none;
}

.navCenter a
{
     margin-right: 10px;
}

.navRight
{
     float: right;
     width: 80px;
     margin-right: 5px;
}

.navRight a
{
     width: 80px;
}

.navRight a:before
{
     content: "";
     position: absolute;
     width: 78px;
     height: 0px;
     bottom: 10px;
     left: 0;
     visibility: hidden;
     border-radius: 5px;
     transform: scaleX(0);
     transition: 0.15s linear;
     /* background: #455F81;
     border: 2px solid #455F81; */
     background: #fff;
     border: 1px solid #455F81;
}


@media screen and (min-width: 750px)
{ 
     .navCenter
     {
          width: 284px; /* 390px */
          margin: 0 0 0 -142px; /* -195px */
     }

     .navCenter :nth-child(5)
     {
          display: block;
     }
 }

 
 /* @media screen and (min-width: 820px)
 { 
      .navCenter
      {
           width: 464px;
           margin: 0 0 0 -232px;
      }
 
      .navCenter :nth-child(6)
      {
           display: block;
      }
  }
 
  @media screen and (min-width: 890px)
{ 
     .navCenter
     {
          width: 538px;
          margin: 0 0 0 -269px;
     }

     .navCenter :nth-child(7)
     {
          display: block;
     }
 } */