.external-links { width: 100%; display: flex; justify-content: space-between; align-items: center; background: #212526;  }
.external-links > a { border-right: 1px solid #515556; display: flex; justify-content: center; align-items: center; color: #fff; width: 33.33%; flex-grow: 1; height: 50px; padding: 0 10px; text-decoration: none; transition: all .1s ease-in;  }
.external-links > a svg.indicator { display: none; }
.external-links > a.external-links__pylon:hover,
.external-links > a.external-links__epsilon-singular:hover { background: #313536; }
.external-links > a.external-links__epsilonnet:hover,
.external-links > a.external-links__ergani:hover,
.external-links > a.external-links__espa:hover { box-shadow: inset 0 0 0 100px rgb(0 0 0 / 20%); }
.external-links > a.active { background: #0099ff; position: relative; }
.external-links > a.active svg.indicator { width: 20px; height: 8px; position: absolute; top: 100%; left: 50%; transform: translate(50%, -80%); fill: #fff; display: block; }
.external-links svg.site-logo { fill: #fff; }
.external-links svg.-epsilon,
.external-links svg.-smart,
.external-links svg.-ergani { height: 25px;  width: 190px; }
.external-links svg.-pylon { height: 25px;  width: 100px; }
.external-links svg.-epsilon-singular { height: 25px;  width: 256px; }

.external-links__epsilonnet { background-color: #0195F9; }
.external-links__pylon { background-color: #000; }
.external-links__epsilon-singular { background-color: #4D4C4E; }
.external-links__ergani { background-color: #C31039; }
.external-links__espa { background-color: #491D9E; }

@media only screen and (max-width: 991px) {
    .external-links__espa { display: none !important; }
    .external-links { flex-direction: column; }
    .external-links > a { width: 100%; }
}

@media only screen and (max-width: 600px) {
    .external-links > a { padding: 0; /*width: auto;*/ }
    /*.external-links svg.-epsilon,
    .external-links svg.-smart,
    .external-links svg.-ergani,
    .external-links svg.-epsilon-singular { height: 17px;  width: 115px; }*/
    .external-links svg.-pylon { height: 17px;  width: 68px; }
    .external-links > a.active svg.indicator { display: none; }
}

@media only screen and (max-width: 350px) {
    .external-links { flex-direction: column; }

    .external-links > a { width: 100%; }

    .external-links > a .site-logo { width: 175px; height: auto; }
}