body {
  padding-top: 30px;
}

:root
{
  --site-control-color: #31D3F7;
}

.xtwitter       img:first-child{display:inline-block}
.xtwitter       img:last-child{display:none}

.xtwitter:hover img:first-child{display:none}
.xtwitter:hover img:last-child{display:inline-block}

.overlay_image 
{
        top: 0px;
        right: 0px;
        position: absolute;
        margin-top: 0px;
}

.dropdown_button {
  max-height: 30 !important;
}

.badge {
  max-height: 30 !important;
}

.dropdown-menu .dropdown-item 
{
  font-size: 14px;
}

.dropdown button 
{
  font-size: 14px;
}

button.btn 
{
  font-size: 14px;
}

span.badge 
{
  font-size: 14px;
}

.shortest-text { display: none; }
.short-text { display: none; }
@media (max-width: 576px) 
{
  /* .shortest-text { display: inline-block; } */
  /* span.short-text { display: none; } */

  .shortest-text { display: none; }
  .short-text { display: none; }
  .full-text { display: inline-block; }

  .scene-title { max-width: 200px; }
  .middle_nav { width: 100% !important; }
}
@media (max-width: 768px) 
{
  .shortest-text { display: none; }
  .short-text { display: none; }
  .full-text { display: inline-block; }

  .scene-title { max-width: 200px; }
}
@media (max-width: 992px) 
{
  .shortest-text { display: none; }
  .short-text { display: none; }
  .full-text { display: inline-block; }

  .scene-title { max-width: 200px; }
}
@media (max-width: 1200px) 
{
  .shortest-text { display: none; }
  .short-text { display: none; }
  .full-text { display: inline-block; }
  
  .scene-title { max-width: 200px; }
}

.btn-home, .btn-apply 
{
  background-color: var(--site-control-color) !important; 
  border-color: var(--site-control-color) !important;
  color: #343A40 !important;
}

.btn-home:hover, .btn-apply:hover { filter: brightness(95%); }

.active { background-color: var(--site-control-color); }

div.twitter
{
    background: url('<%Response.Write asset("twitter_white.png")%>');
}

div.twitter:hover
{
    background: url('<%Response.Write asset("twitter_white.png")%>');
}

.x_twitter_background {
  height: 32px;
  width: 32px;
  border-radius: 4px;
  background-color: white;
  opacity: 1;
  display: block;
  z-index: 2;
}

.x_twitter_div:hover .x_twitter_background {
  cursor: pointer;
  height: 32px;
  width: 32px;
  border-radius: 4px;
  background-color: #31D3F7;
  opacity: 1;
  display: block;
  z-index: 2;
}

.x_twitter {
  z-index: 3;
}

.nav-item {color: white !important;}
.nav-item:is(.active) {color: #343A40 !important;}

.navbar-brand:hover, .nav-item:hover:not(.active) {color: var(--site-control-color) !important;}

.nav-item:hover:is(.active) {filter: brightness(95%);}