.timeline {
  border-left:5px solid #fff6e0;
}
.timeline li {
      margin-left: -13px;
}
.timeline li::marker {
    font-size: xxx-large;
    color:#fff6e0;
}
.timeline h3 {
      position: relative;
    top: -6px;
}
.timeline p {
  margin:-20px 0 0 0;
  opacity:0.7;
}
svg {
  max-width:1500px;
  width:100%;
  max-height: fit-content;
  border-bottom:3px solid #ffa8a8;
}
#color:hover {
  fill:#4a1010;
}
h2, h3 {
  margin-left: 30px;
  font-family: "Besley", serif;
}
.stateinfo h3 {
  font-family: "Besley", serif;
  font-variant: small-caps;
  text-align:center;
  font-variant: no-contextual;
  margin:5px 0;
}
.badges {
    background: #f7dab5;
    padding: 20px;
    color: black;
    display: flex;
    flex-wrap: wrap;
    box-shadow: inset 0px 0px 20px 0px #694b25;
    gap: 5px;
    border-radius: 10px;
    align-items: anchor-center;
}
.badges div {
  flex:1 1 200px;
}
.badges div h3 {
  margin: 5px 0;
}
.badges div h3 img {
  width:30px;
  vertical-align: middle;
    margin-right: 10px;
}
.badges div p {
  margin:0;font-size:0.9rem;
}
.stateinfo {
  padding:10px;
  margin:10px 0;
  border-radius:5px;
}
.stateinfo[data="NC"] { background: #1e4a7a; color: #f5e6d3; outline: 3px solid #102a45;}.stateinfo[data="NC"] td:first-of-type { background: #b22234; color: white;}.stateinfo[data="ND"] { background:#5a3725; color:#f5e6d3; outline:3px solid #3a1f12; }.stateinfo[data="ND"] td:first-of-type { background:#f5d36c; color:#3a1f12; }.stateinfo[data="OH"] { background: #5a1f2b; color: #f5e6d3; outline: 3px solid #3a0f16;}.stateinfo[data="OH"] td:first-of-type { background: #9aa3ad; color: #1f2a38;}.stateinfo[data="OK"] { background: #8b3a2b; color: #f5e6d3; outline: 3px solid #5a2419;}.stateinfo[data="OK"] td:first-of-type { background: #2a7f7a; color: white;}.stateinfo[data="OR"] {background: #1c57a5;color: #f5d36c;outline: 3px solid #0f3a7a;}.stateinfo[data="OR"] td:first-of-type {background: #f5d36c;color: #0f3a7a;}.stateinfo[data="MS"] {background: #5a3725;color: #f5e6d3;outline: 3px solid #3a1f12;}.stateinfo[data="MS"] td:first-of-type {background: #2c5a2d;color: white;}.stateinfo[data="MO"] {background: #4a3a2a;color: #f5e6d3;outline: 3px solid #2c1f12;}.stateinfo[data="MO"] td:first-of-type {background: #2a4a6a;color: #f5e6d3;}.stateinfo[data="MT"] { background:#2f4f6f; color:#f6e7c1; outline:3px solid #1e364d; }.stateinfo[data="MT"] td:first-of-type { background:#b7410e; color:white; }.stateinfo[data="NE"] { background: #4a3f2a; color: #f5e6d3; outline: 3px solid #2c2416;}.stateinfo[data="NE"] td:first-of-type { background: #d9b65c; color: #2c2416;}.stateinfo[data="NV"] { background:#3a3f45; color:#f2e6c9; outline:3px solid #1f2429; }.stateinfo[data="NV"] td:first-of-type { background:#c9c9c9; color:#1f2429; }.stateinfo[data="NH"] { background:#4a2a4f; color:#f5e6d3; outline:3px solid #2c1630; }.stateinfo[data="NH"] td:first-of-type { background:#f5d36c; color:#2c1630; }
.stateinfo[data="NJ"] { background: #2f4a3c; color: #f5e6d3; outline: 3px solid #1c2f26;}.stateinfo[data="NJ"] td:first-of-type { background: #b89a6b; color: #1c2f26;}
.stateinfo[data="MN"] {background: #1f2a44;color: #e8f1ff;outline: 3px solid #0f1629;}.stateinfo[data="MN"] td:first-of-type {background: #8ab4e6;color: #0f1629;} .stateinfo[data="TN"] { background:#7a1f2b; color:#f5e6d3; outline:3px solid #4a0f16; }.stateinfo[data="TN"] td:first-of-type { background:#1c57a5; color:white; }.stateinfo[data="ME"] { background:#2b4f61; color:#f5e6d3; outline:3px solid #18323f; }.stateinfo[data="ME"] td:first-of-type { background:#2d5e2d; color:white; }.stateinfo[data="MD"] {background: #2a2a2a;color: #f5d36c;outline: 3px solid #1a1a1a;}.stateinfo[data="MD"] td:first-of-type {background: #bf3b3b;color: white;}.stateinfo[data="MA"] { background:#4a5568; color:#f5e6d3; outline:3px solid #2f3644;}.stateinfo[data="MA"] td:first-of-type { background:#d9cdb8; color:#2f3644;}.stateinfo[data="MI"] { background:#2f4a5a; color:#e6f2f5; outline:3px solid #1c2e38; }.stateinfo[data="MI"] td:first-of-type { background:#a7c7d9; color:#1c2e38; }.stateinfo[data="PA"] { background:#2a2a2a; color:#f5d36c; outline:3px solid #1a1a1a; }.stateinfo[data="PA"] td:first-of-type { background:#224585; color:white; }.stateinfo[data="RI"] { background:#1e5aa7; color:#f0d9a7; outline:3px solid #0f3a7a; }.stateinfo[data="RI"] td:first-of-type { background:#d4b57f; color:#0f3a7a; }.stateinfo[data="SC"] { background:#1f5a5a; color:#f5e6d3; outline:3px solid #123a3a;}.stateinfo[data="SC"] td:first-of-type { background:#f5d36c; color:#123a3a;}.stateinfo[data="SD"] { background:#8a5a2b; color:#f5e6d3; outline:3px solid #5a3a1a;}.stateinfo[data="SD"] td:first-of-type { background:#2f4f6f; color:white;}.stateinfo[data="IN"] { background:#d4b57f; color:#1c326b; outline:3px solid #b69a63;}.stateinfo[data="IN"] td:first-of-type { background:#1c326b; color:#f5d36c;}.stateinfo[data="IA"] { background:#e7d3a3; color:#3a2a1a; outline:3px solid #bfa36a;}.stateinfo[data="IA"] td:first-of-type { background:#355f7a; color:#f5e6d3;}.stateinfo[data="KS"] {background: #1c57a5;color: #f5d36c;outline: 3px solid #0f3a7a;}.stateinfo[data="KS"] td:first-of-type {background: #f5d36c;color: #0f3a7a;}.stateinfo[data="KY"] { background:#4a3a2a; color:#f5e6d3; outline:3px solid #2c2217; }.stateinfo[data="KY"] td:first-of-type { background:#2d5e2d; color:white; }.stateinfo[data="LA"] {background: #1c57a5;color: #f5d36c;outline: 3px solid #0f3a7a;}.stateinfo[data="LA"] td:first-of-type {background: white;color: #0f3a7a;}.stateinfo[data="UT"] {background: #2f4f6f;color: #f6e7c1;outline: 3px solid #1e364d;}.stateinfo[data="UT"] td:first-of-type {background: #b7410e;color: white;}.stateinfo[data="VT"] {background: #2d5e2d;color: #f5d36c;outline: 3px solid #1a3d1a;}.stateinfo[data="VT"] td:first-of-type {background: #1c57a5;color: #f5d36c;}.stateinfo[data="VA"] { background:#4a2a2a; color:#f5e6d3; outline:3px solid #2b1616; }.stateinfo[data="VA"] td:first-of-type { background:#7a8ca5; color:#1f2a38; }.stateinfo[data="WA"] {background: #2d5e2d;color: #f5d36c;outline: 3px solid #1a3d1a;}.stateinfo[data="WA"] td:first-of-type {background: #f5d36c;color: #1a3d1a;}.stateinfo[data="WV"] { background:#2d5e2d; color:#f5e6d3; outline:3px solid #1a3d1a; }.stateinfo[data="WV"] td:first-of-type { background:#3a3a3a; color:white; }.stateinfo[data="WI"] { background:#f0e1b0; color:#3a2a1a; outline:3px solid #c9b27a; }.stateinfo[data="WI"] td:first-of-type { background:#2d5e2d; color:white; }.stateinfo[data="WY"] { background:#3f2f1f; color:#f5e6d3; outline:3px solid #24180f;}.stateinfo[data="WY"] td:first-of-type { background:#0b2657; color:#f5d36c;}.stateinfo[data="DE"] {background: #1e5aa7;color: #f0d9a7;outline: 3px solid #0f3a7a;}.stateinfo[data="DE"] td:first-of-type {background: #d4b57f;color: #0f3a7a;}.stateinfo[data="FL"] { background:#f5e6d3; color:#8f2b2b; outline:3px solid #d4c3ad; }.stateinfo[data="FL"] td:first-of-type { background:#f5d36c; color:#8f2b2b; }.stateinfo[data="GA"] {background: #3a2f2f;color: #f5e6d3;outline: 3px solid #5a1f1f;}.stateinfo[data="GA"] td:first-of-type {background: #9e2a2b;color: white;}.stateinfo[data="ID"] {background: #1c326b;color: #f5d36c;outline: 3px solid #0f204b;}.stateinfo[data="ID"] td:first-of-type {background: #c95a1f;color: white;}.stateinfo[data="IL"] { background:#3f3f3f; color:#f5e6d3; outline:3px solid #262626; }.stateinfo[data="IL"] td:first-of-type { background:#224585; color:white; }.stateinfo[data="AL"] { background:#5a0f0f; color:#f5e6d3; outline:3px solid #3a0808; }.stateinfo[data="AL"] td:first-of-type { background:#f5e6d3; color:#3a0808; }.stateinfo[data="AZ"] { background: #7a4a2e; color: #f5e6d3; outline: 3px solid #4f2d1a;}.stateinfo[data="AZ"] td:first-of-type { background: #c95a1f; color: white;}.stateinfo[data="AR"] {background: #2c4f36;color: #f5e6d3;outline: 3px solid #1b3222;}.stateinfo[data="AR"] td:first-of-type {background: #a31f1f;color: white;}.stateinfo[data="CO"] { background:#1e3a5f; color:#f5e6d3; outline:3px solid #0f243d;}.stateinfo[data="CO"] td:first-of-type { background:#bf0a30; color:white;}.stateinfo[data="CT"] { background:#1f3a5f; color:#f5e6d3; outline:3px solid #11223a; }.stateinfo[data="CT"] td:first-of-type { background:#b07a3a; color:white; }.stateinfo[data="NY"] { background: #1f2a38; color: #e6edf5; outline: 3px solid #0f1620;}.stateinfo[data="NY"] td:first-of-type { background: #c9a24d; color: #0f1620;}.stateinfo[data="TX"] { background: #8f2b2b; color: #f5e6d3; outline: 3px solid #5a1818;}.stateinfo[data="TX"] td:first-of-type { background: #0b2a5a; color: white;}.stateinfo[data="NM"] { background: #cfa25a; color: #4a1f1f; outline: 3px solid #a37b3c;}.stateinfo[data="NM"] td:first-of-type { background: #4a6a8a; color: white;}.stateinfo[data="HI"] { background:#f9daa5; color:#957842; outline:3px solid #957842;}.stateinfo[data="HI"] td:first-of-type { background:#759809; color:white;}.stateinfo[data="AK"] { background: #1a1f2b; color: #e6f2f5; outline: 3px solid #0b0f18;}.stateinfo[data="AK"] td:first-of-type { background: #2d5e5e; color: white;}.stateinfo[data="CA"] { background: #f1efe9; color: #2b2b2b; outline: 3px solid #c7c2b8;}.stateinfo[data="CA"] td:first-of-type { background: #2f5d50; color: white;}.stateinfo[data="KS"] { background:#c9b27a; color:#2c2217; outline:3px solid #9e8a55;}.stateinfo[data="KS"] td:first-of-type { background:#2d5e2d; color:white;}.stateinfo[data="KY"] { background:#4a3a2a; color:#f5e6d3; outline:3px solid #2c2217; }.stateinfo[data="KY"] td:first-of-type { background:#2d5e2d; color:white; }.stateinfo[data="LA"] { background: #4a2a4f; color: #f5e6d3; outline: 3px solid #2c1630;}.stateinfo[data="LA"] td:first-of-type { background: #b08d57; color: #2c1630;}

.stateinfo td:first-of-type {
font-weight:bold;
}
.stateinfo td:first-of-type:after {
  content:':';
}
.stateinfo h3 img {
  vertical-align: sub;
  margin-right: 5px;
  border-radius: 5px;
  outline: 1px solid black;
}
path[data] {
  transition:0.4s ease;
}
path[data]:hover {
  fill:#8a2121;
}
.stateinfo {
  display:none;
}
.stateinfo table {
    border: 1px solid #dededf;
    height: 100%;
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border-spacing: 1px;
}
.stateinfo td {
    border: 1px solid;
    padding: 5px;
}
* {
  BOX-SIZING: BORDER-BOX;
}
.imp {
  color:darkred;
}
.imp.inverted {
  filter:invert(1);
}
.greyed {
  opacity:0.5;
}
.quote {
  display:block;
  margin:10px 0;
  background:#1d406c;
  color:#deedff;
  border-left:10px solid #0a173b;
  padding:10px;
}
q {
  font-style: italic;
}
.quote p {
      margin: 3px;
    padding-left: 10px;
}
.intro {
      background: linear-gradient(to right, #0a173b 80%, transparent);
    color: #ffffff;
    text-shadow: 3px 3px 0px #000000;
    font-variant: small-caps;
    padding: 10px 10px 10px 20px;
    margin: 10px 0 20px 0;
    font-weight:900;
}
.insideflex {
display: flex;
    width: 100%;
    flex-wrap: wrap;
    gap: 10px;
    max-height: min-content;
    row-gap: 0px;
    justify-content: center;
        padding-bottom: 10px;
}
main, .main2 {
  background:#08254a;
  color:white;
  padding:10px;
  font-size:1.2rem;
  flex:1 1 700px;
  margin-top:10px;
  border: 15px double #530c0c;
  height: fit-content;
  font-weight:400;
  box-shadow: inset 0px 0px 13px 4px rgb(39 29 35 / 50%);
}
.main2 {
  border: 15px double #08254a;
  background:#530c0c;
  flex:1 1 800px;
  font-weight:100;
}
nav a {
  display:block;
  margin:5px 0;
  flex:0 0 203px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.2em;
  color:#a3ccff;
    padding: 10px 20px 10px 10px;
    border: 2px solid #3f5a80;
    transition:0.2s ease;
    box-shadow: 2px 2px;
}
nav a:hover {
  background: #3f5a80;
  box-shadow: 2px 2px #bebecb;
  color:white;
}
nav {
      background: #0a3161;
    padding: 10px;
    border-top: 3px solid #071f3d;
    height: 100vh;
    position: sticky;
    top: 0;
    overflow: auto;
    max-width: 225.922px;
    width:100%;
    scrollbar-width: none;
    font-family: "Besley", serif;
    font-weight:900;
}
.flex {
  display:flex;
  gap:10px;
}
.overlay {
  min-height:10vh;
  width:100%;
   --s: 30px; /* control the size*/
  --c1: #bfbecb;
  --c2: #0a3161;
  
  --d: calc(var(--s)/10);  /* control the gap between stars */
  
  --_g: var(--c1) 36deg, #0000 0;   
  background:
    conic-gradient(from 162deg at calc(var(--s) * .5)  calc(var(--s) * .68), var(--_g)),
    conic-gradient(from 18deg  at calc(var(--s) * .19) calc(var(--s) * .59), var(--_g)),
    conic-gradient(from 306deg at calc(var(--s) * .81) calc(var(--s) * .59), var(--_g)),
    var(--c2);
  background-position: 0 calc(var(--s) * 0.35);
  background-size: calc(var(--s) + var(--d)) calc(var(--s) + var(--d));
}
.banner {
min-height: 10vh;
    width: 100%;
    background: linear-gradient(to left, transparent, #0a3161);
    align-content: center;
    border-bottom: 3px solid #071f3d;
    box-shadow: 0px 5px 20px 0px black;
}
h1.first {
  font-family: "Pinyon Script", cursive;
    margin: 0;
    margin-left: 10px;
    font-size: clamp(40px, 10vw, 70px);
    background-clip: text;
    color: transparent;
    filter: drop-shadow(-1.6px 0 white) drop-shadow(1.6px 0 white) drop-shadow(0 -1.6px white) drop-shadow(0 1.6px white) drop-shadow(0 2px 2px #00000040);
    padding: 20px;
    background-image: linear-gradient(black);
    line-height: 0.75;
}
body {
  margin:0;
  font-family: "Figtree", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}
  html {
  background: linear-gradient(to top left, #1f0101, transparent), url(/namerica/usa/img/rough-cloth.png), repeating-linear-gradient(#b31942, #b31942 30px, #7a0c2a 30px, #7a0c2a 60px);
    background-repeat: repeat;
    min-height: 100vh;
        scrollbar-color: #570909 darkblue;
    scrollbar-width: thin;
}
::selection {
  color:chocolate;
  background:navajowhite;
}
@media (max-width: 700px) {
  h2, h3 {
  margin-left: 0;
}
.timeline li {
      list-style-type: none;
}
  .banner, .overlay {
    height:min-content;
  }

.nav a {
  display: inline-block;
  padding: 8px 12px;
  text-decoration: none;
  color: #000;
}
  .flex {
    display:block;
    gap:10px;
  }
  nav {
    display: flex;
    height:min-content;
    gap:15px;
    max-width:none;
    overflow-x: auto;
    place-self: baseline;
    width: 100%;
    padding: 5px 0 5px 0;
    border-bottom: 3px solid #071f3d;
    z-index:99;
  }
  .mobileonlyme {
        display: flex;
    gap: 10px;
    width: max-content;
    margin: 0 auto;
    padding:0 10px;
  }
  nav a {
    text-indent: -9999px;
    min-width: 50px;
    flex: 0 0 50px;
    height:50px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40px auto;
  }
  nav a:hover {
    background:initial;
    text-indent: -9999px;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow:0px 0px 5px 5px white;
    background-size: 50px auto;
  }
  #society {
    background-image: url('/namerica/usa/img/icon/society.svg');
  }
  #history {
    background-image: url('/namerica/usa/img/icon/history.svg');
  }
  #technology {
    background-image: url('/namerica/usa/img/icon/technology.svg');
  }
  #economy {
    background-image: url('/namerica/usa/img/icon/economy.svg');
    background-size: 30px auto;
  }
  #economy:hover {
    background-size: 37px auto;
  }
  #geography {
    background-image: url('/namerica/usa/img/icon/geography.svg');
  }
  #politics {
    background-image: url('/namerica/usa/img/icon/politics.svg');
  }
  #legal {
    background-image: url('/namerica/usa/img/icon/legal.svg');
  }
  #ethics {
    background-image: url('/namerica/usa/img/icon/ethics.svg');
  }
  h1.first {
    margin-left:0;
  }
  body {
  background-color: #220102;
}
}
.nato summary, .oas summary {
  font-family: "Besley", serif;
  border-bottom:0.5px solid #004791;
}
details.nato {
  border:0.5px solid #004791;
}
details.oas {
  border:0.5px solid;
}
.footer {
  text-align:center;
  margin-top:10px;
  font-size:0.9em;
  opacity:0.7;
}
.footer a {
  color:white;
  text-decoration:none;
}
.footer a:hover {
  background:white;
  color:black;
}