/* ==================================================================================================== */
/* CSS file for "RIR Stats" website - "RIPE Allocations" section
These rules are prefixed by div.ripeallocs and should be used inside an enclosing <div class="ripeallocs">.
Table classes: menu, menu.sorttype, stats, stats.zone, stats.country, allocs.
Div classes: menu, pagebanner, chart.
Div classes in allocations table: lircode, lirname, ipv4, ipv6.
*/
/* ==================================================================================================== */

/* ---------------------------------------------------------------------------------------------------- */
/* Enclosing div */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs {
  padding: 10px 20px;
  background-color: #E6E6FA; /* lavender */
}

/* Responsive design: smaller padding for enclosing div */
@media only screen and (max-width: 825px) {
  div.ripeallocs {
    padding: 10px 10px;
  }
}

/* ---------------------------------------------------------------------------------------------------- */
/* Headers */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs h1, div.ripeallocs h2, div.ripeallocs h3 {
  text-align: center;
  color: #000080; /* navy blue */
}

/* ---------------------------------------------------------------------------------------------------- */
/* Page banner */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs div.pagebanner {
  padding: 1px 10px;
  background-color: #9370DB; /* medium purple */
}

/* ---------------------------------------------------------------------------------------------------- */
/* Charts */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs div.chart {
  margin: 10px auto;
}

/* ---------------------------------------------------------------------------------------------------- */
/* Common values for tables: menu, stats and allocs */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs table.menu, div.ripeallocs table.stats {
  border-collapse: collapse;
  text-align: center;
}

div.ripeallocs table.menu th, div.ripeallocs table.menu td, div.ripeallocs table.stats th, div.ripeallocs table.stats td {
  border-style: solid;
  border-width: 2px;
  border-color: #990000; /* dark red */
}

div.ripeallocs table.menu thead, div.ripeallocs table.stats thead {
  font-weight: bold;
  color: #000080; /* navy blue */
  background-color: #FFD840; /* yellow */
}

div.ripeallocs table.menu tbody, div.ripeallocs table.stats tbody {
  background-color: white;
}

div.ripeallocs table.allocs {
  background-color: white;
}

div.ripeallocs table.stats tbody>:nth-child(odd), div.ripeallocs table.allocs tbody>:nth-child(odd) {
  background-color: #D3D3D3; /* light grey */
}

/* ---------------------------------------------------------------------------------------------------- */
/* Menu and sort type menu */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs table.menu {
  margin: 20px auto;
}

div.ripeallocs table.menu th, div.ripeallocs table.menu td {
  padding: 10px;
}

div.ripeallocs table.menu.sorttype {
  width: 40%;
}

div.ripeallocs table.menu.sorttype td {
  width: 50%;
}

div.ripeallocs table.menu td.focus {
  font-weight: bold;
  font-style: italic;
  background-color: #FFD840; /* yellow */
}

/* ---------------------------------------------------------------------------------------------------- */
/* Page "Zone stats", table stats.zone and page "Country stats", table stats.country */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs table.stats {
  margin: 20px auto;
}

div.ripeallocs table.stats th, div.ripeallocs table.stats td {
  padding: 10px 20px;
}

/* Responsive design: smaller padding for page "Zone stats", table stats.zone */
@media only screen and (max-width: 650px) {
  div.ripeallocs table.stats.zone th, div.ripeallocs table.stats.zone td {
    padding: 10px 5px;
  }
}

/* Responsive design: smaller padding for page "Country stats", table stats.country */
@media only screen and (max-width: 1010px) {
  div.ripeallocs table.stats.country th, div.ripeallocs table.stats.country td {
    padding: 10px 5px;
  }
}

/* Responsive design: do not display columns 1 and 3 (rank, LIR Code) for page "Country stats", table stats.country */
@media only screen and (max-width: 820px) {
  div.ripeallocs table.stats.country tr>:nth-child(1), div.ripeallocs table.stats.country tr>:nth-child(3) {
    display: none;
  }
}

/* Responsive design: smaller font size for page "Country stats", table stats.country */
@media only screen and (max-width: 580px) {
  div.ripeallocs table.stats.country td {
    font-size: smaller;
  }
}

/* ---------------------------------------------------------------------------------------------------- */
/* Page "Country allocations", table allocs */
/* ---------------------------------------------------------------------------------------------------- */

div.ripeallocs table.allocs {
  margin: 20px auto;
  padding: 20px;
  text-align: left;
  font-family: monospace;
  font-size: large;
}

/* Responsive design: smaller padding and font size for page "Country allocations", table allocs */
@media only screen and (max-width: 580px) {
  div.ripeallocs table.allocs {
    padding: 5px;
    font-size: medium;
  }
}

div.ripeallocs table.allocs td {
  padding: 10px;
}

div.ripeallocs table.allocs div {
  white-space: pre-wrap;
}

div.ripeallocs table.allocs div.lirname, div.ripeallocs table.allocs div.ipv4, div.ripeallocs table.allocs div.ipv6 {
  margin-left: 40px;
}

/* Responsive design: smaller margin-left for page "Country allocations", table allocs, div lirname, ipv4 and ipv6 */
@media only screen and (max-width: 580px) {
  div.ripeallocs table.allocs div.lirname, div.ripeallocs table.allocs div.ipv4, div.ripeallocs table.allocs div.ipv6 {
    margin-left: 5px;
  }
}

div.ripeallocs table.allocs div.lircode, div.ripeallocs table.allocs div.ipv4, div.ripeallocs table.allocs div.ipv6 {
  margin-bottom: 4px;
}

div.ripeallocs table.allocs div.lirname {
  margin-bottom: 20px;
}

div.ripeallocs table.allocs div.lircode, div.ripeallocs table.allocs div.lircode a {
  font-weight: bold;
  color: red;
}

div.ripeallocs table.allocs div.lirname {
  font-style: italic;
  color: #990000; /* dark red */
}

div.ripeallocs table.allocs div.ipv4, div.ripeallocs table.allocs div.ipv4 a {
  color: blue;
}

div.ripeallocs table.allocs div.ipv6, div.ripeallocs table.allocs div.ipv6 a {
  color: #009900; /* green */
}
