/* ==================================================================================================== */
/* CSS file for "RIR Stats" website - "RIR Delegations" section
These rules are prefixed by div.rirdelegs and should be used inside an enclosing <div class="rirdelegs">.
Table classes: menu, menu.sorttype, charts, stats, delegs, byzone.
Div classes: menu, pagebanner, chart, ip-list.
*/
/* ==================================================================================================== */

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

div.rirdelegs {
  padding: 10px 20px;
}

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

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

div.rirdelegs h1, div.rirdelegs h2, div.rirdelegs h3 {
  text-align: center;
  color: black;
}

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

div.rirdelegs div.pagebanner {
  padding: 1px 10px;
  font-weight: bold;
}

/* ---------------------------------------------------------------------------------------------------- */
/* Charts in page "Zone stats" */
/* ---------------------------------------------------------------------------------------------------- */

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

/* ---------------------------------------------------------------------------------------------------- */
/* Charts in page "Stats by zone" */
/* ---------------------------------------------------------------------------------------------------- */

div.rirdelegs table.charts {
  margin: 20px auto;
}

/* Responsive design: display table in mode inline-block for page "Stats by zone", table charts */
@media only screen and (max-width: 1340px) {
  div.rirdelegs table.charts {
    text-align: center;
  }
  div.rirdelegs table.charts td {
    display: inline-block;
    margin-bottom: 5px;
  }
}

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

div.rirdelegs table {
  border-collapse: collapse;
}

div.rirdelegs table.menu th, div.rirdelegs table.menu td, div.rirdelegs table.stats th, div.rirdelegs table.stats td, div.rirdelegs table.delegs th, div.rirdelegs table.delegs td, div.rirdelegs table.byzone th, div.rirdelegs table.byzone td {
  border-style: solid;
  border-width: 2px;
  border-color: black;
}

div.rirdelegs table.menu, div.rirdelegs table.stats, div.rirdelegs table.delegs, div.rirdelegs table.byzone {
  text-align: center;
}

div.rirdelegs table.menu thead, div.rirdelegs table.stats thead, div.rirdelegs table.delegs thead, div.rirdelegs table.byzone thead {
  font-weight: bold;
}

div.rirdelegs table.menu thead, div.rirdelegs table.byzone thead {
  background-color: white;
}

div.rirdelegs table.stats, div.rirdelegs table.delegs {
  background-color: white;
}

div.rirdelegs table.stats tbody tr:nth-child(odd) {
  background-color: #D3D3D3; /* light grey */
}

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

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

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

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

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

div.rirdelegs table.menu td.focus {
  font-weight: bold;
}

/* ---------------------------------------------------------------------------------------------------- */
/* Page "Zone stats", table stats */
/* ---------------------------------------------------------------------------------------------------- */

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

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

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

/* ---------------------------------------------------------------------------------------------------- */
/* Page "Country delegations", p note et ul note */
/* ---------------------------------------------------------------------------------------------------- */

div.rirdelegs p.note, div.rirdelegs ul.note {
  font-size: large;
}

/* ---------------------------------------------------------------------------------------------------- */
/* Page "Country delegations", div ip-list */
/* ---------------------------------------------------------------------------------------------------- */

div.rirdelegs div.ip-list {
  padding-top: 20px;
  text-align: center;
  font-size: large;
}

/* ---------------------------------------------------------------------------------------------------- */
/* Page "Country delegations", table delegs */
/* ---------------------------------------------------------------------------------------------------- */

div.rirdelegs table.delegs {
  margin: 30px auto;
}

div.rirdelegs table.delegs th, div.rirdelegs table.delegs td {
  padding: 10px 20px;
}

/* Text-align right for columns "Range start" (column 4) and "Number" (column 5 for ASN/IPv4, column 6 for IPv6) in table body */
div.rirdelegs table.delegs tbody td:nth-child(4), div.rirdelegs table.delegs.asn tbody td:nth-child(5), div.rirdelegs table.delegs.ipv4 tbody td:nth-child(5), div.rirdelegs table.delegs.ipv6 tbody td:nth-child(6) {
  text-align: right;
}

div.rirdelegs table.delegs tbody {
  font-family: monospace;
  font-size: large;
}

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

/* Responsive design: do not display columns 1 to 3 (zone, country code, parameter) for page "Country delegations", table delegs */
@media only screen and (max-width: 750px) {
  div.rirdelegs table.delegs tr>:nth-child(1), div.rirdelegs table.delegs tr>:nth-child(2), div.rirdelegs table.delegs tr>:nth-child(3) {
    display: none;
  }
}

/* Responsive design: smaller font size for page "Country delegations", table delegs */
@media only screen and (max-width: 510px) {
  div.rirdelegs table.delegs tbody {
    font-size: medium;
  }
}

/* ---------------------------------------------------------------------------------------------------- */
/* Page "Stats by zone", table byzone */
/* ---------------------------------------------------------------------------------------------------- */

div.rirdelegs table.byzone {
  margin: 30px auto;
}

div.rirdelegs table.byzone th, div.rirdelegs table.byzone td {
  padding: 15px 20px;
}

/* Responsive design: smaller padding and font size for page "Stats by zone", table byzone */
@media only screen and (max-width: 860px) {
  div.rirdelegs table.byzone td {
    padding: 15px 5px;
    font-size: smaller;
  }
}

/* ---------------------------------------------------------------------------------------------------- */
/* Background colors specific to each zone, World and Country:
- First rule-set: light color for page background / menu and sort type menu rows / delegs table body (even rows) / byzone table rows.
- Second rule-set: dark color for page banner / focus in menu and sort type menu / delegs table head.
*/
/* ---------------------------------------------------------------------------------------------------- */

div.rirdelegs.afrinic, div.rirdelegs table.menu tr.afrinic, div.rirdelegs table.delegs.afrinic tbody tr:nth-child(even), div.rirdelegs table.byzone tr.afrinic {
  background-color: #CC9966; /* light brown */
}

div.rirdelegs.afrinic div.pagebanner, div.rirdelegs table.menu tr.afrinic td.focus, div.rirdelegs table.delegs.afrinic thead {
  background-color: #996600; /* dark brown */
}

div.rirdelegs.apnic, div.rirdelegs table.menu tr.apnic, div.rirdelegs table.delegs.apnic tbody tr:nth-child(even), div.rirdelegs table.byzone tr.apnic {
  background-color: #FFFF99; /* light yellow */
}

div.rirdelegs.apnic div.pagebanner, div.rirdelegs table.menu tr.apnic td.focus, div.rirdelegs table.delegs.apnic thead {
  background-color: #FFD700; /* dark yellow */
}

div.rirdelegs.arin, div.rirdelegs table.menu tr.arin, div.rirdelegs table.delegs.arin tbody tr:nth-child(even), div.rirdelegs table.byzone tr.arin {
  background-color: #99FFFF; /* light blue */
}

div.rirdelegs.arin div.pagebanner, div.rirdelegs table.menu tr.arin td.focus, div.rirdelegs table.delegs.arin thead {
  background-color: #0099FF; /* dark blue */
}

div.rirdelegs.lacnic, div.rirdelegs table.menu tr.lacnic, div.rirdelegs table.delegs.lacnic tbody tr:nth-child(even), div.rirdelegs table.byzone tr.lacnic {
  background-color: #FFCC66; /* light orange */
}

div.rirdelegs.lacnic div.pagebanner, div.rirdelegs table.menu tr.lacnic td.focus, div.rirdelegs table.delegs.lacnic thead {
  background-color: #FF6600; /* dark orange */
}

div.rirdelegs.ripencc, div.rirdelegs table.menu tr.ripencc, div.rirdelegs table.delegs.ripencc tbody tr:nth-child(even), div.rirdelegs table.byzone tr.ripencc {
  background-color: #99FF66; /* light green */
}

div.rirdelegs.ripencc div.pagebanner, div.rirdelegs table.menu tr.ripencc td.focus, div.rirdelegs table.delegs.ripencc thead {
  background-color: #009900; /* dark green */
}

div.rirdelegs.world, div.rirdelegs table.menu tr.world, div.rirdelegs table.byzone tr.world {
  background-color: #FFCCFF; /* light pink */
}

div.rirdelegs.world div.pagebanner, div.rirdelegs table.menu tr.world td.focus {
  background-color: #FF00FF; /* dark pink */
}

div.rirdelegs.country, div.rirdelegs table.menu tr.country {
  background-color: #DCDCDC; /* light grey */
}

div.rirdelegs.country div.pagebanner, div.rirdelegs table.menu tr.country td.focus {
  background-color: #A9A9A9; /* dark grey */
}

div.rirdelegs table.menu.sorttype tr {
  background-color: white;
}