@font-face {
  font-family: Eliot Lord;
  src: url(Fonts/Eliothand-Regular.otf);
}

@font-face {
  font-family: Impact;
  src: url(Fonts/Impact.ttf);
}

@font-face {
  font-family: Montserrat;
  src: url(Fonts/Montserrat-Regular.ttf);
}

@font-face {
  font-family: Montserrat ExtraBold;
  src: url(Fonts/Montserrat-ExtraBold.ttf);
}

@font-face {
  font-family: VB;
  src: url(Fonts/AIVeritas%20Black/AIVeritas%20BlackRegular/AIVeritas%20Black%20Regular.otf);
}

@font-face {
  font-family: Eliot Headline;
  src: url(Fonts/EliotHeadline-Regular.ttf);
}

@font-face {
  font-family: DS Digital;
  src: url(Fonts/DS-DIGIT.TTF);
}

@font-face {
  font-family: Eliot Headline;
  src: url(Fonts/EliotHeadline-Regular.ttf);
}

@font-face {
  font-family: Devil;
  src: url(Fonts/DevilBreeze.ttf);
}

@font-face {
  font-family: Bell;
  src: url(Fonts/Bell%20MT.ttf);
}

@font-face {
  font-family: Corpid;
  src: url(Fonts/Corpid%20Caps%20Bold.otf);
}

@font-face {
  font-family: Corpid Regular;
  src: url(Fonts/Corpid%20Regular/Corpid%20Regular.otf);
}

@font-face {
  font-family: Helvetica Condensed;
  src: url(Fonts/HELVETI1.TTF);
}

@font-face {
  font-family: Time;
  src: url(Fonts/TIMES%20CY.TTF);
}

body {
  opacity: 100%;
  font-family: Eliot Lord;
  font-size: 2.2dvw;
  margin: 0;
  user-select: none;
  -webkit-user-drag: none;
  cursor: url(img/background/cursors/Cursor.svg),
    url(img/background/Pointer.svg), pointer;
}

/*Index*/

/*end Index*/

/*Hi*/
.topnavmail a:nth-of-type(2):hover {
  color: #1e4cad;
}

.topnavmail a:nth-of-type(3):hover {
  color: #850024;
}
.topnavmail a:nth-of-type(4):hover {
  color: #e91111;
}
.topnavmail a:nth-of-type(5):hover {
  color: #1147e9;
}
.topnavmail a:nth-of-type(6):hover {
  color: #c88410;
}
.topnavmail a:nth-of-type(7):hover {
  color: #ec1801;
}
.topnavmail a:nth-of-type(8):hover {
  color: #8b0000;
}

.topnavmail a:nth-of-type(9):hover {
  color: #a92216;
}

.topnavmail a:nth-of-type(10):hover {
  color: #0e32b3;
}
.topnavmail a:nth-of-type(11):hover {
  color: #ac713c;
}
.topnavmail a:nth-of-type(12):hover {
  color: #e1306c;
}
.topnavmail a:nth-of-type(13):hover {
  color: #b90005;
}

/*End Hi */

img {
  -webkit-user-drag: none;
}

/*body a:hover {
  background-image: url(img/background/Underline%20White.png);
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: 0px 85%;
}*/

a {
  text-decoration: none;
}

.radish a:hover {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: 0px 85%;
}

#e a:hover {
  font-weight: 900;
}

/*.footer a:hover {
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 120% 30%;
  background-position: 0px 100%;
}
*/
.gbbluesnavbar a {
  color: white;
}

.gbbluesnavbar a:hover {
  color: white;
}

.gbbluesnavbar {
  background: linear-gradient(to right, #031054, #071a6d, #1131a3, #1131a4);
  padding: 30px;
  font-family: Montserrat;
  left: 0;
  border-top: 6px solid #d42027;
}

.gbbluesnavbar a {
  padding: 10px;
  font-size: 1.3dvw;
  color: white;
  text-decoration: none;
}

.gbbluesnavbar :hover {
  font-family: Montserrat ExtraBold;
  font-size: 1.3dvw;
  font-weight: 1000;
  background-image: url(img/background/empty.png);
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: 0px 85%;
  font-size: 1.3dvw;
  font-weight: 1000;
}

.gbbluesnavbar {
  background: linear-gradient(to right, #031054, #071a6d, #1131a3, #1131a4);
  padding: 20px;
  font-family: Montserrat;
  left: 0;
  border-top: 6px solid #d42027;
}

.link :hover {
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;

  background-size: 100% 20%;
  background-position: bottom;
}

.activelinknav {
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  font-weight: 900;
}

.socials a:hover {
  text-decoration: none;
  background-image: url(img/background/empty.png);
}

font-face {
  font-family: Eliot Lord;
  src: url(Fonts/Eliothand2-Regular.otf);
}

.contrarynavigationbar a:hover {
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  font-size: 2.6dvw;
  font-weight: 1000;
  cursor: url(img/background/Pointer.svg);
}

.container {
  width: 80%;
  background-color: white;
  height: 100%;
  overflow: hidden;
  padding-top: 30px;
  margin: 0 auto;
}

#container1 {
  width: 80%;
  background-color: white;
  height: 100%;
  overflow: hidden;
  padding-top: 30px;
  margin: 0 auto;
}

#footerimagecenter {
  margin: auto;
  width: 50%;
  padding: 10px;
}

.footergb a {
  color: black;
  text-decoration: none;
  font-family: Montserrat;
  padding-right: 5%;
}

.footergb a:hover {
  color: #002a98;
  font-family: Montserrat ExtraBold;
  font-weight: 100;
}

#header {
  background-color: white;
  fill: white;
  padding-top: 20px;
  padding-bottom: 20px;
  font-family: Montserrat ExtraBold;
  font-size: 3dvh;
}

#header img {
  display: flex;
  justify-content: center;
}

#headerlogo1 {
  width: 50%;
  margin: auto;
}

.cv #header img {
  overflow-clip-margin: content-box;
  overflow: clip;
}

#GB_Blues img {
  overflow-clip-margin: content-box;
  overflow: clip;
}

a:hover,
img[onClick],
div[onclick] {
  cursor: url("img/background/Pointer.svg") pointer;
}

.navau a:hover {
  cursor: url("img/background/Pointer.svg");
}

/* Navigation bar */
.topnav a {
  font-family: Montserrat;
  padding: 20px;
}

.topnav a:hover {
  text-decoration: none;
  font-weight: 900;
  background-image: url(img/background/empty.png);
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: bottom;
}

a:hover,
img[onClick],
div[onclick] {
  cursor: url("img/background/Pointer.svg"),
    url("img/background/cursors/Finger%20cursor.png"), pointer;
}

footer,
#footer,
.footer a {
  user-select: none;
  -webkit-user-drag: none;
  float: none;
  display: inline-block;
  text-decoration: none;
}

.footer a {
  color: #ffffff;
}

.footer a:hover {
  color: white;
}

/*footer a {
  padding-left: 5px;
}*/

.fa {
  padding: 5px;
  font-size: 30px;
  width: 100px;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  padding-bottom: 20px;
  bottom: 100px;
  float: right;
}

footer,
.footer,
#footer {
  width: 100%;
}

.fa:hover {
  opacity: 0.7;
}

.fa-facebook {
  background: #1877f2;
  color: white;
  height: 20px;
  width: 20px;
}

.fa-twitter {
  background: #429bd6;
  color: white;
  height: 20px;
  width: 20px;
}

.fa-instagram {
  background: #ffffff;
  height: 20px;
  width: 20px;
}

.fa-substack {
  background-color: #ffffff;
  height: 20px;
  width: 20px;
}

.fa-mastodon {
  background-color: white;
  height: 20px;
  width: 20px;
}

/* Navigation bar */
.topnav a {
  font-family: Montserrat;
  padding: 20px;
  color: black;
  font-size: 2dvh;
}

.topnav a:hover {
  text-decoration: none;
  font-weight: 900;
  background-image: url(img/background/empty.png);
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: bottom;
}

#GB_Blues img {
  width: 20%;
  margin-left: 35%;
  margin-right: 35%;
}

.center {
  display: block;
  margin: auto;
  text-align: center;
}

#timesnavigationbar img:hover {
  background-color: black;
}

#timesnavigationbar,
#simesnavigationbar {
  font-size: 3dvw;
  font-weight: 900;
  background-color: black;
  font-family: "Times New Roman", Times, serif;
  height: auto;
  overflow: auto;
  position: sticky;
  top: 0;
  z-index: 2147483647;
  overflow: hidden;
}

.tfooter a:hover {
  color: white;
}

.tfooter a {
  font-family: Time;
  font-size: 1.2dvh;
}

#simesnavigationbar {
  font-size: 3dvw;
  font-weight: 900;
  font-family: "Times New Roman", Times, serif;
  height: auto;
  overflow: auto;
  background-image: linear-gradient(to right, #b50938, #e4003b, #faa61a);
  position: sticky;
  top: 0;
  z-index: 9000000000000;
  overflow: hidden;
}

#simesnavigationbar a {
  color: white;
}

#elcapitalfoot a {
  font-family: "Times New Roman", Times, serif;
  font-size: 3dvw;
  font-weight: 200;
  z-index: 2147483647;
  width: 13%;
  display: inline-block;
  margin: 0;
  padding: 0;
  height: 100%;
}

#elcapitalfoot {
  margin: 0;
  padding: 0;
  display: inline-block;
}

#elcapitalfoot a:hover {
  font-family: "Times New Roman", Times, serif;
  font-weight: 900;
  text-decoration: none;
  height: 100%;
  display: inline-block;
}

.elcapital::-webkit-scrollbar {
  width: 1em round;
  overflow: scroll;
}

#author {
  font-size: 0.8rem;
  font-weight: bold;
}

#author {
  font-family: Eliot Headline;
  font-size: 3dvw;
  font-weight: 200;
  z-index: 2147483647;
  width: 13%;
  display: inline-block;
  margin: 0;
  padding: 0;
  color: black;
}

button {
  cursor: url(img/background/Pointer.svg), pointer;
  height: 75px;
  font-family: Eliot;
  font-size: 30px;
}

.joke {
  font-family: Eliot Lord;
  font-size: 40px;
  font-weight: 500;
  margin: 40px;
}

.jokecontainer {
  background-color: white;
  color: rgba(0, 0, 0);
  background-color: rgba(255, 255, 255, 0.95);
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.9);
  transition: all 300ms ease;
  border-radius: 10px;
}

.jokecontainer {
  margin: auto;
  width: 75%;
  padding: 20px;
  text-align: center;
}

.jokecontainer {
  display: flex;
  flex-direction: column;
  min-height: 400px;
}

.jokecontainer .btn {
  margin-top: auto;
  position: relative;
}

.ToryGraph a,
.Joke a,
.Corgi a {
  text-decoration: underline;
}

.ToryGraph a:hover,
.Joke a:hover,
.Corgi a:hover {
  text-decoration: underline;
  background-image: none;
}

.navcar a {
  text-decoration: none;
}

.navcar a:hover {
  text-decoration: underline;
  text-decoration-color: #00908a;
}

.joke {
  font-family: Eliot Lord;
  font-size: 40px;
  font-weight: 900;
  margin: 40px;
}
.jokecontainer {
  background-color: white;
  color: rgba(0, 0, 0);
  background-color: rgba(255, 255, 255, 0.95);
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.9);
  transition: all 300ms ease;
  border-radius: 10px;
}

.jokecontainer {
  margin: auto;
  width: 75%;
  padding: 20px;
  text-align: center;
}

.jokecontainer {
  display: flex;
  flex-direction: column;
  min-height: 400px; /* Adjust as needed */
}

.jokecontainer .btn {
  margin-top: auto; /* Pushes button to bottom */
  position: sticky;
}

.wrapjoke {
  background-image: url(img/background/Laugh.svg);
  background-repeat: repeat;
  min-height: 100vh;
  display: block;
  justify-content: center;
  align-items: center;
  user-select: none;
  -moz-user-select: none;
}

.navau {
  background-color: white;
}

.footertel {
  background-color: #153247;
  font-family: Arial;
  font-size: 1.2rem;
  padding: 40px 40px 0px 40px;
  text-decoration: none;
  columns: 4;
  column-gap: 20rem;
}

.footertel a {
  color: white;
  text-decoration: none;
  padding: 40px 40px 0px 40px;
  font-size: 1.2rem;
}

.footertel a:hover {
  color: white;
  text-decoration: underline;
  background-repeat: repeat-x;
  text-decoration-color: white;
}

.Joke,
.Torygraph hr {
  display: block;
  border: 0;
  margin: 1em 0;
  padding: 0;
}
.Corgi {
  -webkit-user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}
.heading {
  font-size: 75px;
  font-weight: 200;
  font-family: Eliot Headline;
  text-shadow: 5px 5px 2px rgba(0, 0, 0, 0.3);
  letter-spacing: 2px;
}
.heading {
  font-size: 75px;
  font-weight: 200;
  font-family: Eliot Headline;
  text-shadow: 5px 5px 2px rgba(0, 0, 0, 0.3);
  letter-spacing: 2px;
}
.heading {
  font-size: 75px;
  font-weight: 200;
  font-family: Eliot Headline;
  text-shadow: 5px 5px 2px rgba(0, 0, 0, 0.3);
  letter-spacing: 2px;
}

.Joke .navcar {
  color: black;
}

.navcar a:hover {
  color: black;
  font-weight: 100;
  text-decoration: underline;
  background-repeat: repeat-x;
  text-decoration-color: #00908a;
}

.navau {
  top: 100%;
  background-color: white;
  opacity: 1;
}

.navau a {
  color: black;
  text-decoration: none;
  padding-left: 20px;
  font-family: Bell;
}

.navau a:hover {
  color: black;
  text-decoration: underline;
  background-repeat: repeat-x;
  text-decoration-color: #00908a;
}

.elcapital::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px black;
  width: 2em;
}

.elcapital::-webkit-scrollbar-thumb {
  background-color: #e4003b;
  width: 1em round;
  border-radius: 10px;
}

#timesnavigationbar img {
  float: left;
  top: 100%;
  width: 14%;
}

#timesnavigationbar a:hover {
  background-color: #4f4e4e;
}

#simesnavigationbar img {
  float: left;
  padding-left: 60px;
}

#simesnavigationbar a {
  text-decoration: none;
  width: 50%;
  margin: auto;
  padding: 2%;
}

#simesnavigationbar a:hover {
  background-color: #a92323;
  padding-bottom: -20px;
}

.elcapitalo img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

#timesnavigationbar img a:hover {
  background-color: black;
}

#timesnavigationbar a {
  font-family: "Times New Roman", Times, serif;
  color: white;
  text-decoration: none;
  font-size: 3.1dvw;
  padding: 10px 10px 1px 1px;
  margin: 0px;
  float: left;
}

#timesnavigationbar {
  font-size: 3dvw;
}

#timesnavigationbar {
  background-color: black;
  padding: 0px 0px;
  font-family: "Times New Roman", Times, serif;
}
#timesnavigationbar :hover {
  background-color: #4f4e4e;
  font-weight: 0;
}
#timesnavigationbar a:hover {
  font-weight: 900;
  padding: 10px 10px 10px;
  color: white;
}
#timesnavigationbar {
  background-color: black;
  font-family: "Times New Roman", Times, serif;
}
#timesnavigationbar a {
  font-family: "Times New Roman", Times, serif;
  color: white;
  text-decoration: none;
  padding: 10px 10px;
  font-weight: 800;
}

.header1 {
  font-family: Eliot Lord;
  font-size: 3dvw;
}

.bobois {
  display: block;
  margin-left: 10%;
  margin-right: 10%;
  width: 75%;
  background-color: #f4efeb;
}

#bobois img {
  display: block;
  margin: auto;
}
.content-box {
  padding-top: 30px;
  columns: 3 auto;
  max-width: 1400px;
  border-left: 0px;
  border-right: 0px;
  border-inline-start: #000;
  column-gap: 40px;
  column-rule: 0px;
}
.column,
#column {
  float: left;
  width: 300px;
  padding: 0;
}

@media (max-width: 768px) {
  .caption_text {
    font-size: 26px;
  }
  .title_text {
    font-size: 28px;
  }
  .title_text1 {
    font-size: 28px;
  }
  .title_text4 {
    font-size: 28px;
  }
  .title_text5 {
    font-size: 24px;
  }
}

#currentDate {
  font-size: 28px;
  color: black;
}

footer a {
  color: white;
}

#Hi {
  font-size: 24px;
}

#Hi a:hover {
  font-size: 22px;
}

.centerblockblack {
  width: 100%;
  background-color: black;
}

.centerblockblack h1,
a {
  color: white;
  text-align: center;
}
#date {
  color: black;
  text-align: center;
  width: 100%;
}

#timesheader,
.timesheader {
  background-color: white;
}

#timescontent,
.timescontent {
  margin-left: 10%;
  margin-right: 10%;
}
.central {
  background-color: white;
}
p #p1 {
  color: black;
  font-family: Eliot Lord;
  font-size: 2dvh;
}

#quiz {
  height: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px;
  background-color: #d10c41;
  border-radius: 5px;
  box-shadow: 10px 10px 10px black;
}
#quiz button:hover {
  cursor: url("img/background/Pointer.svg"), auto;
}

.Quiz {
  background-color: black;
}

.Quiz button {
  display: block;
  margin: 0 auto;
  padding: 10px 20px;
  background-color: rgb(227, 238, 10), 245, 161;
  color: #131313;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-family: Eliot Lord;
  font-size: 3dvh;
}

.Quiz button:hover {
  background-color: #8d8f8f;
  cursor: url("img/background/cursors/Cursor.svg");
}

.Quiz .footer a {
  font-family: Times;
}

.Quiz .footer a:hover {
  font-family: Times;
}

.Quiz .socials footer a {
  font-family: "Times New Roman", Times, serif;
  color: black;
  padding: 0px, 20px, 20px;
}
.Quiz footer :hover {
  font-family: "Times New Roman", Times, serif;
  color: white;
}
.Quiz footer {
  background-color: black;
  float: left;
  bottom: 0;
  font-size: 5dvh;
  width: 100%;
  position: relative;
  overflow: hidden;
  padding: 0px, 20px, 20px;
}

#question {
  margin-bottom: 20px;
}
#question a {
  font-size: 3dvw;
}
#options {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, 1fr);
}

#preheader #date {
  background-color: #ffffff;
  height: 50px;
  float: right;
}

#preheader #date a {
  color: white;
  text-emphasis-color: white;
}

#mailnavigationbar {
  font-weight: 900;
}

#mailnavigationbar a:hover {
  font-family: VB;
  text-decoration: none;
  display: inline-block;
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  font-weight: 900;
}

#footer a {
  color: black;
  font-family: VB;
  font-weight: 900;
  text-decoration: none;
  display: inline-block;
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: bottom;
}

@font-face {
  font-family: DM;
  src: url(Fonts/Dm-Regular.otf);
}

@font-face {
  font-family: Veritas;
  src: url(Fonts/AIVeritas%20Black/AIVeritas%20BlackRegular/AIVeritas%20Black%20Regular.otf);
}
.MailLogo {
  margin-left: 0;
}

.FailPlus {
  margin-right: 0;
}

.rhubarb a:hover {
  color: red;
}
.topnavmail {
  background-color: white;
  font-family: VB;
  font-size: 1dvw;
  padding: 5px 10px;
}

.topnavmail a {
  color: black;
  text-decoration: none;
  font-weight: 800;
}

.topnavmail a:hover {
  font-weight: 900;
}

.Mail a:hover {
  color: red;
  text-decoration-color: red;
}
#mailnavigationbar {
  background-color: #1e4cad;
  padding: 10px 10px;
  font-family: VB;
  font-size: 2.6dvw;
  color: white;
}

@media (min-width: 768px) {
  .content-box1 {
    columns: 2;
    max-width: 90%;
    column-gap: 40px;
  }
}

#mailnavigationbar a {
  font-family: VB;
  font-weight: 100;
  color: white;
  padding: 5px 10px;
  text-decoration: none;
  font-size: 2dvw;
  display: inline-block;
}

a[href^="Home"]a {
  color: rgb(255, 120, 2);
}
.topnavmail .Mail a:hover {
  color: red;
}
.topnavmail a:nth-of-type(1):hover {
  color: #ec1801;
}
.topnavmail a:nth-of-type(2):hover {
  color: #2357c7;
}
.topnavmail a:nth-of-type(3):hover {
  color: rgb(241, 184, 60);
}
.topnavmail a:nth-of-type(4):hover {
  color: rgb(78, 172, 12);
}
.topnavmail a:nth-of-type(5):hover {
  color: rgb(154, 39, 107);
}

.topnavmail a:nth-of-type(6):hover {
  color: #265b86;
}

.topnavmail a:nth-of-type(7):hover {
  color: #1131a3;
}

.topnavmail a:nth-of-type(8):hover {
  color: rgb(221, 42, 123);
}

.topnavmail a:nth-of-type(9):hover {
  color: rgb(51, 102, 153);
}

.topnavmail a:nth-of-type(10):hover {
  color: #11285e;
}

.topnavmail a:nth-of-type(11):hover {
  color: #ec6519;
}

.topnavmail a:nth-of-type(12):hover {
  color: #58c0ab;
}

#Hi {
  width: 75%;
  margin: 0 auto;
}

#footer a {
  font-size: 4.5dvh;
}

#Hola {
  background-color: white;
}

#Hola #date {
  text-align: right;
}

#Hola::-webkit-scrollbar {
  width: 1em round;
  overflow: scroll;
}

#Hola::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px #1e4cad;
}

#Hola::-webkit-scrollbar-thumb {
  background-color: #1e4cad;
  outline: 1px solid #1e4cad;
  width: 1em round;
  border-radius: 10px;
}

#Hola::-webkit-scrollbar-thumb:hover {
  cursor: url("img/background/Pointer.svg");
}

#header {
  background-color: white;
  fill: white;
  padding-top: 10px;
  padding-bottom: 10px;
}

#FailPlus a {
  font-family: DM;
  font-size: 10dvh;
  color: black;
}

#FailPlus {
  float: right;
  right: 0%;
  z-index: 2147483647;
}
#roche {
  padding: 0;
}

#Hola {
  width: 60%;
  margin: auto;
}

#Selling {
  width: 60%;
  margin: auto;
}

#Fail {
  width: 60%;
}

footer {
  background-color: #ffffff;
  float: left;
  bottom: 0;
  font-size: 3dvh;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.footer-container {
  background-color: #95aab6;
  display: flex;
}

footer a {
  user-select: none;
  -webkit-user-drag: none;
  float: none;
  display: inline-block;
  color: #ffffff;
  text-decoration: none;
  font-family: Eliot Lord;
  padding-left: 20px;
}

.footer-container a {
  color: #f5f6f7;
  text-decoration: none;
  font-family: Eliot Lord;
  font-size: medium;
  text-align: center;
}

footer .row {
  float: left;
  clear: both;
  width: 100%;
  border-bottom: #1e4cad;
}
footer .row a {
  width: 50%;
  display: inline-block;
  text-align: center;
  color: #ffffff;
  font-size: 3dvh;
  font-weight: normal;
}
footer .row a span {
  display: inline-block;
}

footer {
  background-color: #ffffff;
  float: left;
  bottom: 0;
  width: 100%;
  position: relative;
  overflow: hidden;
}

footer p {
  font-size: 3dvh;
}

.footer-container,
.footer1,
footer {
  font-size: 3.6dvw;
}

.mirrornavbar {
  font-family: "Times New Roman", Times, serif;
  background-color: #a92323;
  font-weight: 900;
  padding: 50px;
}

.mirrornavbar {
  height: 0px;
  background: #a92323;
}
.mirrornavbar a {
  font-family: "Arial Black";
  color: white;
  padding: 10px 10px 50px;
  text-decoration: none;
  padding-bottom: 5%;
}

.mirrornavbar a:hover {
  text-decoration: underline;
  color: white;
}

.mirrorf a:hover {
  color: white;
}

.gridcontainer {
  display: grid;
  color: black;
}

.picturearea {
  border-top-width: thick;
  border-top-color: white;
  border-top: white;
  z-index: 2147483647;
}

.elcapitalo {
  columns: 3;
  font-family: Eliot Lord;
  width: 80%;
  margin: auto;
  font-weight: 100;
}

.elcapitalo {
  padding: 30px;
  color: black;
}

.caption {
  font-size: 2.5dvh;
  font-family: Montserrat;
  text-align: left;
  padding-left: 40%;
  font-style: italic;
}

.headline {
  text-align: center;
  font-family: Eliot Headline;
  font-size: 7dvh;
}

.subheadline {
  font-size: 2.5dvh;
  font-family: Montserrat;
  text-align: center;
}

.date {
  font-size: 2.5dvh;
  font-family: Montserrat;
  text-align: center;
  font-style: italic;
}

.content {
  padding: 20px;
}

.content1 {
  padding: 20px;
}

.container {
  height: 100%;
  width: 100%;
  position: relative;
}

@media (max-width: 768px) {
  .column p {
    font-size: 20px;
  }
}
.column a:hover {
  color: #ffffff;
  text-decoration: underline;
}

.socials a:hover {
  text-decoration: none;
  background-image: url(img/background/empty.png);
}

.headlogo {
  background-color: #ec1801;
}

img header a:hover {
  text-decoration: none;
}
.headlogo a:hover {
  font-weight: 100;
  font-family: Eliot Lord;
}

#roche1 {
  float: right;
  bottom: 10px;
  background-color: #ec1801;
}

@media all and (max-width: 768px) {
  #galleries {
    width: 500px;
    margin: auto;
  }
}

#peace img {
  top: 100%;
  width: 100px;
  height: 100px;
  position: relative;
  top: 0;
  animation: linear infinite;
  animation-name: run, rotate;
  animation-duration: 3s, 2s;
  overflow-x: hidden;
}
@keyframes run {
  0% {
    left: 0;
  }
  50% {
    left: calc(100% - 100px);
  }
  100% {
    left: 0;
  }
}
@keyframes rotate {
  0% {
    rotate: 0deg;
  }
  50% {
    rotate: 180deg;
  }
  100% {
    rotate: 360deg;
  }
}

#footer a:first-of-type:hover,
#footer a:nth-of-type(8):hover {
  color: #1e4cad;
}
#footer a:nth-of-type(2):hover {
  color: #850024;
}
#footer a:nth-of-type(3):hover {
  color: #e91111;
}
#footer a:nth-of-type(4):hover {
  color: #1147e9;
}
#footer a:nth-of-type(5):hover {
  color: #c88410;
}
#footer a:nth-of-type(6):hover {
  color: #ec1801;
}
#footer a:nth-of-type(7):hover {
  color: #8b0000;
}
#footer a:nth-of-type(9):hover {
  color: #0e32b3;
}
#footer a:nth-of-type(10):hover {
  color: #ac713c;
}
#footer a:nth-of-type(11):hover {
  color: #e1306c;
}
#footer a:nth-of-type(12):hover {
  color: #b90005;
}

.title_text a {
  color: #1e4cad;
}

.title_text a:hover {
  font-weight: 900;
  color: #e4003b;
}

.middle {
  padding-top: 0;
  background-color: #fff;
}

@media (min-width: 768px) {
  #bobois {
    columns: 2;
  }
}

.Countdown {
  background-color: white;
  font-family: DS Digital;
  font-size: 50px;
  text-align: center;
}

h1 {
  font-family: DS Digital;
  font-weight: 900;
  font-size: 50px;
  text-align: center;
}
.foo a {
  font-family: Arial;
  text-decoration: none;
  text-align: center;
}

.foo a:hover {
  color: #00bed6;
  cursor: url(img/background/Pointer.svg);
  text-decoration: none;
}

.foo a {
  font-family: Arial;
  font-weight: 800;
  text-decoration: none;
  padding: 0 20px;
  margin: auto;
  text-align: center;
}

#navo a:hover {
  cursor: url(img/background/Pointer.svg), pointer;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
}

.nav {
  top: 100%;
  background-color: white;
  opacity: 1;
}

.navau {
  background-color: white;
}

.navau a {
  color: black;
  text-decoration: none;
  padding-left: 20px;
  font-family: Bell;
}

.navau a:hover {
  color: #e4003b;
  text-decoration: underline;
  cursor: url(img/background/Pointer.svg), pointer;
}

.navau a:hover {
  cursor: url("img/background/Pointer.svg"),
    url("img/background/cursors/Finger%20cursor.png"), pointer;
}
.nav a {
  color: black;
  text-decoration: none;
  padding-left: 20px;
  font-family: Bell;
}

.nav a:hover {
  color: #e4003b;
  text-decoration: underline;
  cursor: url(img/background/Pointer.svg), pointer;
}

.nav a:hover {
  cursor: url(img/background/Pointer.svg), pointer;
}

.btn {
  position: fixed;
  font-weight: 100;
  bottom: 17%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  background-color: rgba(0, 135, 220, 0.9);
  color: white;
  border-radius: 10px;
  padding: 20px;
  font-size: 30px;
  font-family: Bell;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 4px 4px rgba(228, 0, 59, 0.9);
}

.btn:hover {
  color: rgba(255, 159, 26);
  font-weight: Bell;
  font-weight: 900;
  background-color: rgba(0, 135, 220, 0.9);
  box-shadow: 0 4px 4px rgba(228, 0, 59, 0.9);
  transition: all 300ms ease;
}

.btn:hover {
  color: rgba(255, 159, 26);
  background-color: rgba(0, 135, 220, 0.9);
  box-shadow: 0 4px 4px rgba(228, 0, 59, 0.9);
  transition: all 300ms ease;
  cursor: url(img/background/Pointer.svg), pointer;
}

.btn,
#btn a:hover {
  cursor: url(img/background/Pointer.svg), pointer;
}

@font-face {
  font-family: Insta Sans;
  src: url("Fonts/instagram-sans-2/Instagram Sans Light.ttf");
}

@font-face {
  font-family: "Instagram Sans";
  src: url("Fonts/instagram-sans-2/Instagram Sans Bold.ttf");
}

@font-face {
  font-family: "Instagram";
  src: url("Fonts/Fontspring-DEMO-blue_vinyl_bold_ps_ot.otf");
}

.line5 {
  background-color: #8134af;
  height: 2px;
}
.navbarinsta {
  font-family: Insta Sans;
  font-size: 1.4dvw;
  padding: 15px 15px 15px;
  color: white;
}
.navbarinsta a {
  color: white;
  text-decoration: none;
  padding: 15px 15px 15px;
  font-size: 1.4dvw;
  font-family: Insta Sans;
  font-weight: 100;
}
.navbarinsta a:hover {
  background-image: url("img/background/UnderlineBlue.png");
  background-repeat: repeat-x;
  text-decoration: none;
  background-size: 100% 20%;
  background-position: bottom;
  color: white;
  font-family: Insta Sans;
  font-size: 1.4dvw;
  padding: 15px 15px 15px;
  font-weight: 800;
}
.navbarinsta a:active {
  font-family: "Instagram Sans";
  font-weight: 800;
}
.navbarinsta a:active {
  color: #00a2ff;
}
.tom:hover {
  color: #f58529;
}
.content-box2 {
  padding-left: 20px;
  padding-top: 30px;
  columns: 3 auto;
  max-width: 1400px;
  border-left: 0px;
  border-right: 0px;
  border-inline-start: #000;
  column-gap: 40px;
  column-rule: 0px;
  font-size: 3dvw;
  text-decoration: none;
}
.content-box2 a {
  color: #8134af;
  font-weight: 100;
  text-decoration: none;
}
.content-box2 a:hover {
  font-family: Insta Sans;
  color: #dd2a7b;
}

.content-box2 a {
  font-family: Insta Sans;
  font-size: 3dvw;
  padding: 20px 20px 20px;
  font-weight: 100;
}

.content-box2 p,
a {
  font-size: 3dvw;
}

.content-box2 {
  padding-left: 20px;
  padding-top: 30px;
  columns: 3 auto;
  max-width: 1400px;
  border-left: 0px;
  border-right: 0px;
  border-inline-start: #000;
  column-gap: 40px;
  column-rule: 0px;
  font-size: 3dvw;
}

.content-box2 a {
  color: #8134af;
  font-weight: 100;
  text-decoration: none;
}

.content-box2 a:hover {
  font-family: Insta Sans;
  color: #dd2a7b;
}

.content-box2 {
  font-family: Insta Sans;
}

.navbarinsta a {
  color: white;
  text-decoration: none;
  padding: 20px 20px 20px;
  font-size: 1.4dvw;
  font-family: Insta Sans;
  font-weight: 100;
}

.navbarinsta {
  font-family: Insta Sans;
  font-size: 1.4dvw;
  padding: 40px 40px 40px;
  color: white;
}

.header {
  padding: 20px 0px 20px;
  color: white;
  font-family: Instagram;
  font-size: 9dvw;
  font-weight: 900;
}

.navbarinsta a:hover {
  background-image: url("img/background/UnderlineBlue.png");
  background-repeat: repeat-x;
  text-decoration: none;
  background-size: 100% 20%;
  background-position: bottom;
  color: white;
  font-family: Insta Sans;
  font-size: 1.4dvw;
  padding: 20px 20px 20px;
  font-weight: 800;
}

.navbarinsta a:active {
  color: #00a2ff;
}

.tom:hover {
  color: #f58529;
}

.navbarinsta a:active {
  font-family: "Instagram Sans";
  font-weight: 800;
}

.activelinknavinsta {
  background-image: url("img/background/UnderlineBlue.png");
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: bottom;
  font-weight: 900;
  font-family: Helvetica;
  font-size: 3.6dvw;
}

.line5 {
  background-color: #8134af;
  height: 2px;
}

nav {
  font-family: Arial;
  text-align: center;
  background-color: #191919;
  padding: 20px 0px 20px;
}

nav a {
  color: white;
  text-decoration: none;
  padding: 20px 20px 20px;
  font-size: 1.4dvw;
  font-family: Arial;
  font-weight: 100;
}

nav a:hover {
  text-decoration: none;
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  color: white;
  font-family: Arial;
  font-size: 1.4dvw;
  padding: 20px 20px 20px;
  font-weight: 800;
}

/*Inspa*/

.Inspa a:hover {
  font-family: Instagram Sans;
  background-image: url("img/background/Underlinepink.png");
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  font-weight: 900;
  cursor: url ("img/background/Pointer.svg"), pointer;
}

.navbarinsta a:hover {
  background-image: url("img/background/UnderlineBlue.png");
  background-repeat: repeat-x;
}

body .Inspa::-webkit-scrollbar-thumb {
  background-color: #8134af;
  outline: 1px solid #8134af;
  border-radius: 10px;
}

.Inspa::-webkit-scrollbar {
  width: 1em round;
  overflow: scroll;
  color: #000;
}
.Inspa::-webkit-scrollbar {
  width: 1em round;
  overflow: scroll;
}

.Inspa::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px #1e4cad;
}

.Inspa::-webkit-scrollbar-thumb {
  background-color: #8134af;
  outline: 1px solid #8134af;
  border-radius: 10px;
}

.Inspa::-webkit-scrollbar-thumb:hover {
  cursor: url("img/background/Pointer.svg");
}

.Inspa {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.column1 {
  width: 350px;
}

.column2 {
  width: 350px;
}

.Inspa .title_text1 {
  font-family: Insta Sans;
  font-size: 3dvw;
}
.column1 .title_text1 a {
  text-align: justify;
}
.column2 .title_text1 a {
  text-align: justify;
}
.title_text1 {
  padding-left: 20px;
}

.container2,
.cv-description,
.cv-title {
  font-weight: 100;
  border-style: solid grey;
  background-color: white;
}

.cv-title a {
  color: #000;
  font-weight: 100;
}

.cv-title {
  font-weight: 100;
}

.container2 {
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding-top: 30px;
  margin: 0 auto;
}

.container2 a {
  font-weight: 100;
  color: #c33531;
}
.container2 a:hover {
  color: #1131a3;
}

.cv-description,
.cv-title {
  float: left;
  width: 50%;
}
.cv-title {
  font-size: 4dvw;
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
}
.cv-sub-title {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 70% 20%;
  background-position: bottom;
  font-size: 3.5dvw;
  font-weight: 900;
  padding-top: 0;
}

.cv-title,
.cv-title a,
.fa,
.fa-facebook,
.topnav a,
a:hover {
  text-decoration: none;
}

.cv-title a {
  color: #000;
  font-weight: 100;
}

.cv-title {
  font-weight: 100;
}
.cv-description,
.cv-title {
  float: left;
  width: 50%;
}
.cv-title {
  font-size: 4dvw;
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
}

.center1 {
  display: block;
  margin-left: 42%;
  margin-right: 42%;
  width: 100%;
}
.footerimagecenter {
  margin: auto;
  width: 50%;
  padding: 10px;
}
.cv-sub-title {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 70% 20%;
  background-position: bottom;
  font-size: 3.5dvw;
  font-weight: 100;
  padding-top: 0;
}

h3 {
  font-size: 1.2em;
}

h3 a {
  font-weight: 100;
  color: #c33531;
}

h3 a:hover {
  color: #1131a3;
}

.cv-title a,
footer a:hover {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 110% 30%;
  background-position: bottom;
  text-emphasis-color: black;
  text-decoration: none;
}

footer a:hover {
  cursor: url("img/background/Pointer.svg"), pointer;
}

.cv {
  width: 75%;
  margin: auto;
  overflow-x: hidden;
}

.cv p a {
  font-weight: 100;
  color: #c33531;
}

.cv p a:hover {
  color: #1131a3;
}

.cv-title a:hover {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 110% 30%;
  background-position: bottom;
  text-emphasis-color: black;
  text-decoration: none;
}

.cv-title {
  font-weight: 100;
}
.cv-title span,
.fa {
  padding: 5px;
}
.cv-title,
.cv-title a {
  text-decoration: none;
}

.wrap a:hover {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 110% 30%;
  background-position: bottom;
  text-decoration: none;
}

.topnavgb {
  background-color: white;
}

.topnavgb a {
  text-decoration: none;
  font-size: 1.2rem;
  padding: 20px;
  font-family: Montserrat;
  color: #000;
}

.topnavgb a:hover {
  font-size: 1.2rem;
  padding: 20px;
  color: #002a98;
  font-family: Montserrat ExtraBold;
  font-weight: 100;
}

.cv-description p a {
  font-weight: 100;
  color: #c33531;
}

.cv-description p a:hover {
  color: #1131a3;
}

.cv-title a {
  background-image: url();
  background-repeat: no-repeat;
  background-size: 110% 30%;
  background-position: bottom;
  text-emphasis-color: black;
  text-decoration: none;
}

.footergb a,
.footergb a:hover,
.footergb {
  background-color: #ebebeb;
}

.cv {
  width: 75%;
  margin: auto;
  overflow-x: hidden;
}

.cv .container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding-top: 30px;
  margin: 0 auto;
}

.cv::-webkit-scrollbar {
  width: 1em round;
  overflow: scroll;
}
.cv::-webkit-scrollbar-thumb:hover {
  cursor: url(img/background/cursors/Pointer1.svg);
}
.cv::-webkit-scrollbar-thumb {
  background-color: #002a98;
  outline: #002a98 solid 1px;
}
.cv footer {
  columns: 4;
}
.cv footer a {
  user-select: none;
  -webkit-user-drag: none;
  float: none;
  display: inline-block;
  font-family: Montserrat;
}
.cv footer a:hover {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.cv .container,
.cv-description,
.cv-title {
  border-style: solid grey;
}

h2 {
  font-size: 3dvw;
  background-color: #fff;
  padding-top: 0;
}

.gameleft,
.gameright {
  width: 50%;
  float: left;
  text-align: center;
}
.gameleft a,
.gameright a {
  color: #000;
  font-family: Montserrat-ExtraBold;
}
.prefooter {
  background: linear-gradient(
    to right,
    #e17cd0,
    #ea56dc,
    #c73dde,
    #af37e0,
    #be3bdc,
    #d43dbe,
    #db3eb3,
    #dc3eb0,
    #e53fa4,
    #e74a0a,
    #e94082,
    #ea4178
  );
}
.footergames {
  color: #000;
}
#cross {
  animation: shake 0.5s;

  /* When the animation is finished, start again */
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% {
    transform: translate(1px, 1px) rotate(0deg);
  }
  10% {
    transform: translate(-6px, -3px) rotate(-1deg);
  }
  20% {
    transform: translate(-6px, 0px) rotate(1deg);
  }
  30% {
    transform: translate(6px, 4px) rotate(0deg);
  }
  40% {
    transform: translate(2px, -2px) rotate(1deg);
  }
  50% {
    transform: translate(-2px, 4px) rotate(-1deg);
  }
  60% {
    transform: translate(-6px, 2px) rotate(0deg);
  }
  70% {
    transform: translate(6px, 2px) rotate(-1deg);
  }
  80% {
    transform: translate(-5px, -2px) rotate(1deg);
  }
  90% {
    transform: translate(2px, 4px) rotate(0deg);
  }
  100% {
    transform: translate(2px, -4px) rotate(-1deg);
  }
}

.inspalogo:hover {
  filter: brightness(0.6);
}

.love:hover {
  filter: brightness(0.6);
}

.plane:hover {
  filter: brightness(0.6);
}

#TimeToGo::-webkit-scrollbar {
  width: 1em round;
  overflow: scroll;
  background-color: #00bed6;
}

#TimeToGo::-webkit-scrollbar-thumb {
  width: 1em round;
  background-color: #000000;
  outline: #00bed6 solid 1px;
}

#menuOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 998;
}

#menuOverlay.overlay-active {
  opacity: 1;
  visibility: visible;
}

#myLinks {
  position: fixed;
  top: 0;
  right: -300px;
  width: 300px;
  height: 100%;
  background-color: #fff;
  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.3);
  transition: right 0.3s ease;
  z-index: 999;
  overflow-y: auto;
}

#myLinks.menu-open {
  right: 0;
}

.navtot {
  background-color: #00bed6;
}

.topnavoo {
  overflow: hidden;
  background-color: #333;
  position: relative;
}

.topnavoo #myLinks {
  display: none;
  z-index: 10000000000000;
}

.topnavoo a {
  color: white;
  padding: 14px 16px 16px 0px;

  text-decoration: none;
  font-size: 17px;
  display: block;
}

.topnavoo a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.topnavoo a:hover {
  background-color: #ddd;
  color: black;
}

a .active1 {
  background-color: #00bed6;
  color: white;
}

.active1 {
  background-color: #00bed6;
  font-size: 4dvh;
}

/*Whac-a-Tory*/

#startButton,
#endButton :hover {
  cursor: url("img/background/Pointer.svg");
}

#Mole {
  background-image: url(img/background/Whac-A-Mole-Background.svg);
}

#Mole {
  font-family: Eliot Lord;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow-x: hidden;
}

#score,
#timer {
  color: white;
  font-weight: 900;
}
.mirrornavbar img {
  height: auto;
  overflow: auto;
  top: 0;
  z-index: 2147483647;
  position: sticky;
}
.game-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 20px;
}
#startButton {
  margin-bottom: 20px;
  padding: 10px;
  font-size: 20px;
  border-radius: 25px;
  z-index: 2147483647;
}
#endButton {
  margin-bottom: 20px;
  padding: 10px;
  font-size: 20px;
  border-radius: 25px;
  z-index: 2147483647;
}
.hole {
  margin: auto;
  height: 150px;
  width: 150px;
  background-image: url("img/background/hole.svg");
  border: none;
  cursor: url("img/background/Pointer.svg");
  border-radius: 150px;
}

.mole {
  background-size: 150px;
  background-image: url("img/background/Tory Mole.svg");
}

@media only screen and (max-width: 600px) {
  .hole {
    height: 50px;
    width: 50px;
    border-radius: 100px;
    background-image: url("img/background/hole.svg");
  }
  .mole {
    background-size: 50px;
    background-image: url("img/background/Tory Mole.svg");
  }
}

.Mole::-webkit-scrollbar {
  width: 1em round;
  overflow: scroll;
}
.Mole::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px #a92323;
}

.Mole::-webkit-scrollbar-thumb {
  background-color: #a92323;
  outline: 1px solid #a92323;
  width: 1em round;
  border-radius: 10px;
}

.worm {
  margin-top: 20px;
  width: 272px;
  height: 174px;
  cursor: url(img/background/Pointer.svg);
  position: absolute;
  margin-right: -150px;
  z-index: 3;
  border-radius: 4px;
  width: 200px;
  height: 50px;
}

.k img {
  transform: translate(300px, 0px);
  width: 15%;
  height: 15%;
  top: 35%;
  position: absolute;
  z-index: -5;
  animation: walking 12s linear infinite;
}
@keyframes walking {
  0% {
    left: -2%;
    transform: scaleX(-1);
  }

  100% {
    left: 110%;
    transform: scaleX(-1);
  }
}

.m img {
  transform: translate(0px, 300px);
  position: absolute;
  z-index: -5;
  width: 15%;
  height: 15%;
  top: 60%;
  animation: walking1 12s linear infinite;
}
@keyframes walking1 {
  0% {
    left: 120%;
    transform: scaleX(1);
  }

  100% {
    left: -1%;
    transform: scaleX(1);
  }
}
.l img {
  transform: translate(300px, 0px);
  width: 15%;
  height: 15%;
  top: 85%;
  position: absolute;
  z-index: -5;
  animation: walking 12s linear infinite;
}
@keyframes walking {
  0% {
    left: -2%;
    transform: scaleX(-1);
  }

  100% {
    left: 110%;
    transform: scaleX(-1);
  }
}

#moleheader {
  background-color: #a92323;
  height: 30%;
  padding: 3%;
}

#moleheader img {
  top: 100%;
}

.game-container {
  width: 75%;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(3, 160px);
  gap: 10px;
  border: none;
  padding: 20px;
  border-radius: 10px;
}
.game-container {
  width: 100%;
  gap: 0%;
  grid-template-columns: repeat(3, 30%);
}

/*Connections*/

#connavigationbar {
  font-weight: 900;
  background-color: white;
  font-family: Helvetica;
  margin: auto;
  width: 50%;
  padding: 10px;
}

#connavigationbar a {
  color: black;
  font-family: VB;
  font-size: 5dvh;
  text-decoration: none;
  text-align: center;
  padding: 10px;
}

#connavigationbar a:hover {
  font-family: VB;
  text-decoration: none;
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  cursor: url(img/background/Pointer.svg);
}

#connavigationbar :hover {
  cursor: url(img/background/cursors/Pointer.svg);
}

/*Art*/

.content .title_text1 a:hover {
  --underline-width: 100%;
  background-image: url(img/background/Underline%20White.png);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  text-decoration-color: #faa61a;
}

.title_text1 a {
  background: linear-gradient(currentColor 0 0) bottom left/
    var(--underline-width, 0%) 0.1em no-repeat;
  color: #ec1801;
  display: inline-block;
  text-decoration: none;
}

a:hover {
  color: #faa61a;
  --underline-width: 100%;
}

#Sunny {
  text-decoration: none;
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  background-position: bottom;
  font-weight: 100;
}

#gallery1,
#gallery10,
#gallery11,
#gallery12,
#gallery13,
#gallery14,
#gallery15,
#gallery16,
#gallery17,
#gallery2,
#gallery3,
#gallery4,
#gallery5,
#gallery6,
#gallery7,
#gallery8,
#gallery9 {
  width: 65%;
}
#everything {
  background-color: #006548;
  padding: 0;
}
#galleries {
  overflow: hidden;
  position: relative;
  columns: 700px auto;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
  background-color: #006548;
}
#galleries .title_text1 a:hover {
  font-family: Eliot Lord;
  font-size: 3dvh;
  font-weight: 100;
  -webkit-text-fill-color: #e4003b;
}
#gallery1,
#gallery10,
#gallery11,
#gallery12,
#gallery13,
#gallery14,
#gallery15,
#gallery16,
#gallery17,
#gallery2,
#gallery3,
#gallery4,
#gallery5,
#gallery6,
#gallery7,
#gallery8,
#gallery9 {
  padding: 10px;
  float: left;
  -webkit-user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

.slideshowcontainers {
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  background-color: #fff;
  border-bottom: #971b2f 10px;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.sunnavigationbar,
#FArt {
  background-color: #ec1801;
}

.slideshow1container,
.slideshow2container,
.slideshow3container,
.slideshow4container,
.slideshow5container,
.slideshow6container {
  padding-top: 100px;
  display: none;
  position: relative;
  margin: 0;
  height: 800px;
}
.image_slide1,
.image_slide2,
.image_slide3,
.image_slide4,
.image_slide5,
.image_slide6,
.image_slides {
  height: 100%;
  width: 75%;
  overflow: hidden;
  display: none;
  margin: auto;
  text-align: center;
}
.close_button,
.next_button,
.previous_button {
  position: absolute;
  min-width: 50px;
}
.previous_button {
  top: 50%;
  left: 0;
}
.next_button {
  top: 50%;
  right: 0;
}
.close_button {
  top: 10px;
  right: 10px;
}
.close_button:hover {
  filter: brightness(80%);
}
.next_button:hover {
  filter: brightness(80%);
}

.previous_button:hover {
  filter: brightness(80%);
}
#galleries :hover {
  filter: brightness(100%);
}

#galleries :hover {
  font-weight: bolder;
  color: #00bed6;
  text-decoration: none;
}

#galleries .title_text1:hover {
  font-weight: 100;
  color: #3783fc;
  text-decoration: none;
}

#gallery16 {
  width: 40%;
}

#everything .caption_text1,
.galleryimage,
.sunnavigationbar,
.title_text2,
footer,
h2,
nav a,
ul {
  text-align: center;
}

#llama,
#roche1,
.responsive .column,
.socialsa {
  background-color: #ec1801;
}
.activelinkfooter,
.activelinkgallery a:hover,
.headlogo a:hover,
.sunnavigationbar a:hover,
body a:hover,
footer a:hover {
  background-repeat: repeat-x;
  font-weight: 900;
  background-size: 100% 20%;
  background-position: bottom;
}
#roche1 {
  float: right;
  bottom: 100px;
}

#Sunny .logo,
hr,
nav ul li a,
nav ul li a:hover {
  color: #fff;
}

#Sunny a,
#Sunny a:hover {
  color: #fff;
  font-weight: 100;
}

#Sunny a {
  max-width: fit-content;
  margin-inline: auto;
  margin: auto;
  width: 50%;
  padding: 10px;
  font-family: Helvetica;
}
#Sunny {
  background: #ec1801;
  margin-top: 60px;
  bottom: 0;
  user-select: none;
  -webkit-user-drag: none;
  font-family: Helvetica;
}

#llama .logo,
hr,
nav ul li a,
nav ul li a:hover {
  color: #fff;
}

#roche1,
.links,
footer {
  width: 100%;
}

footer a:hover {
  font-weight: 900;
}

#galleries a,
.activelinkgallery a:hover,
.caption_text1,
.headlogo a:hover,
.title_text2 {
  color: #faa61a;
  font-family: Eliot Lord;
  font-weight: 100;
}

#FArt {
  font-family: Arial, Helvetica, sans-serif;
  z-index: 2147483647;
}

nav a {
  margin: auto;
}
nav ul {
  list-style-type: none;
  display: flex;
  margin: 0;
}
nav ul li {
  font-family: Helvetica;
  padding: 10px 12px;
}

@media (max-width: 768px) {
  .caption_text {
    font-size: 26px;
  }
  .title_text,
  .title_text4 {
    font-size: 28px;
  }
  .title_text1 {
    font-weight: 100;
    font-size: 21px;
  }
  .title_text2 {
    font-size: 30px;
  }
}

.wrapper {
  position: relative;
  height: 40vh;
}
.topper {
  padding: 20px;
}

.activelinkgallery a:hover {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  text-decoration: none;
  font-weight: 900;
}

.socialsa {
  bottom: 0;
  left: 0;
  text-decoration: none;
}
.socialsa a:hover {
  font-size: 1dvh;
}

#rhubarb {
  padding: 0;
  margin: 0;
  min-height: 100%;
}

#FArt,
nav {
  position: sticky;
  z-index: 2147483647;
  top: 0;
}

#galleries a,
.activelinkgallery a:hover,
.caption_text1,
.headlogo a:hover,
.title_text2,
font-face {
  font-family: Eliot Lord;
}
.activelinkgallery a:hover {
  background-image: url(img/background/Underlineblack.png);
  background-repeat: repeat-x;
  background-size: 100% 20%;
  text-decoration: none;
  font-weight: 100;
}
#galleries {
  overflow: hidden;
  position: relative;
  columns: 700px auto;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}
#galleries .title_text1 a:hover {
  font-family: Eliot Lord;
  font-size: 3dvh;
  font-weight: 100;
  -webkit-text-fill-color: #faa61a;
}
#gallery1,
#gallery10,
#gallery11,
#gallery12,
#gallery13,
#gallery14,
#gallery15,
#gallery16,
#gallery17,
#gallery2,
#gallery3,
#gallery4,
#gallery5,
#gallery6,
#gallery7,
#gallery8,
#gallery9 {
  max-width: 25%;
}
#gallery1,
#gallery10,
#gallery11,
#gallery12,
#gallery13,
#gallery14,
#gallery15,
#gallery16,
#gallery17,
#gallery2,
#gallery3,
#gallery4,
#gallery5,
#gallery6,
#gallery7,
#gallery8,
#gallery9 {
  padding: 10px;
  float: left;
  -webkit-user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}
.slideshowcontainers {
  position: fixed;
  z-index: 4000000000000000;
  display: none;
  top: 0;
  left: 0;
  background-color: #fff;
  border-bottom: #b50938 10px;
  background-size: cover;
  width: 100%;
  height: 100%;
}
.slideshow10container,
.slideshow11container,
.slideshow12container,
.slideshow13container,
.slideshow14container,
.slideshow15container,
.slideshow16container,
.slideshow17container,
.slideshow1container,
.slideshow2container,
.slideshow3container,
.slideshow4container,
.slideshow5container,
.slideshow6container,
.slideshow7container,
.slideshow8container,
.slideshow9container {
  padding-top: 100px;
  display: none;
  position: relative;
  margin: 0;
  height: 600px;
}
.image_slide1,
.image_slide10,
.image_slide11,
.image_slide12,
.image_slide13,
.image_slide14,
.image_slide15,
.image_slide16,
.image_slide17,
.image_slide2,
.image_slide3,
.image_slide4,
.image_slide5,
.image_slide6,
.image_slide7,
.image_slide8,
.image_slide9,
.image_slides {
  height: 100%;
  width: 75%;
  overflow: hidden;
  display: none;
  margin: auto;
  text-align: center;
}
#gallery16 {
  width: 40%;
}
.Cov {
  animation: none;
}

.Cov:hover {
  animation: rotation 1s infinite linear;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}

#everything,
.caption_text1,
.galleryimage,
.sunnavigationbar,
.title_text2,
footer,
h2,
nav a,
ul {
  text-align: center;
}
.activelinkfooter,
.activelinkgallery a:hover,
.headlogo a:hover,
.sunnavigationbar a:hover,
body a:hover,
footer a:hover {
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: bottom;
}
.sunnavigationbar,
.sunnavigationbar a,
.sunnavigationbar a:hover {
  font-size: 2.6dvw;
  text-decoration: none;
}
#FArt {
  font-family: Arial, Helvetica, sans-serif;
  z-index: 9000000000000;
}
.sunnavigationbar {
  font-family: Helvetica;
  font-weight: 900;
  border-top: 1px solid #fff;
}
.sunnavigationbar a {
  color: #fff;
  padding: 5px;
  display: inline-block;
}
.sunnavigationbar a:hover {
  color: #fff;
  display: inline-block;
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
}

/*Games*/

#navbarno,
.headerlogo,
.ripnav {
  background-color: #a92216;
}

.footerfun a:hover,
.prefooter a:hover,
.ripnav a:hover {
  background-repeat: no-repeat;
  background-size: 100% 20%;
  background-position: bottom;
}
.bottomnav a,
.ripnav a {
  padding: 10px;
  color: #fff;
}

.activelinkfooter,
footer a:hover {
  background-image: url(img/background/Underline%20White.svg);
  background-repeat: repeat-x;
  background-size: 100% 20%;
}
.activelinkfooter {
  font-weight: 900;
  font-family: Helvetica;
  font-size: 3.6dvw;
}
#galleries a:hover,
#everything a:hover {
  color: #faa61a;
}
.title_text2 {
  font-size: 5dvh;
  font-weight: 900;
  color: #000;
}
.caption_text,
.title_text,
.title_text4 {
  font-weight: 100;
}
.headlogo a:hover,
.socials a:hover {
  background-image: url(img/background/empty.png);
  text-decoration: none;
}
li,
nav {
  font-size: 1dvh;
}
.links {
  height: 100%;
}
.headlogo {
  padding-left: 25%;
}
.headlogo a:hover {
  font-weight: 900;
}
header img a:hover {
  text-decoration: none;
}
.caption_text a:hover {
  color: #115da8;
}
.title_text {
  font-size: 2.8dvw;
  z-index: 2147483647;
}
.caption_text {
  font-size: 2.8vw;
  z-index: 2147483647;
}

/*Graundia*/

.main a:hover {
  color: #062962;
}

table {
  width: 75%;
  margin: auto;
}

th {
  font-family: Guardian Heavy;
  font-size: 3vw;
}

td {
  font-family: Guardian;
  font-size: 2.5vw;
}

.topnavgraun :hover {
  color: #ffff66;
}
.topnavgraun {
  background-color: #0b1e47;
  width: 100%;
  top: 0%;
  padding-bottom: 1%;
}
.topnavgraun {
  font-family: Guardian Heavy;
  font-size: 1dvh;
  font-weight: 900;
}
.topnavgraun a {
  color: white;
  text-decoration: none;
  font-size: 2dvh;
}
.topnavgraun a:hover {
  color: #ffff66;
  text-decoration: underline;
  font-size: 2dvh;
}

.topnavbar a {
  color: white;
  font-family: Guardian Heavy;
  font-size: 2.5dvh;
  padding: 2%;
  float: left;
  text-decoration: none;
}

.topnavbar .Home a {
  padding-left: 40px;
}

.topnavbar img {
  float: right;
  padding-right: 2%;
}

.topnavbar a:nth-of-type(1):hover {
  text-decoration: underline;
  text-decoration-color: #e93717;
  text-underline-offset: 78%;
  text-decoration-thickness: 7px;
}

.topnavbar a:nth-of-type(2):hover {
  text-decoration: underline;
  text-decoration-color: #ef8636;
  text-underline-offset: 78%;
  text-decoration-thickness: 7px;
}
.topnavbar a:nth-of-type(3):hover {
  text-decoration: underline;
  text-decoration-color: #389fee;
  text-underline-offset: 78%;
  text-decoration-thickness: 7px;
}
.topnavbar a:nth-of-type(4):hover {
  text-decoration: underline;
  text-decoration-color: rgb(241, 184, 60);
  text-underline-offset: 78%;
  text-decoration-thickness: 7px;
}
.topnavbar a:nth-of-type(5):hover {
  text-decoration: underline;
  text-decoration-color: rgb(78, 172, 12);
  text-underline-offset: 78%;
  text-decoration-thickness: 7px;
}
.topnavbar a:nth-of-type(6):hover {
  text-decoration: underline;
  text-decoration-color: rgb(151, 7, 195);
  text-underline-offset: 78%;
  text-decoration-thickness: 7px;
}

.navbox {
  width: 80%;
  height: 80%;
  border: 10px white;
  font-size: 2.5dvh;
  z-index: 2147483647;
  top: 0;
  right: 0;
  background-color: #062962;
}

.topnavbar {
  background-color: #062962;
  width: 100%;
  height: 150px;
  padding-left: 2%;
}

.underbox {
  padding-top: 3%;
  background-color: #062962;
  padding-bottom: 2%;
  display: inline-block;
  text-decoration-thickness: 3px;
  border: none;
}

.underbox a {
  border-top: 1px white;
  font-family: Arial;
}

.topfoot {
  border-top: white 3px;
  border-left: white 3px;
  border-right: white 3px;
}

#Graun .topfoot a:nth-of-type(1):hover {
  text-decoration: underline;
  text-decoration-color: red;
  text-decoration-thickness: 7px;
}

#Graun .topfoot a:nth-of-type(2):hover {
  text-decoration: underline;
  text-decoration-color: rgb(64, 179, 224);
  text-decoration-thickness: 7px;
}

#Graun .topfoot a:nth-of-type(3):hover {
  text-decoration: underline;
  text-decoration-color: rgb(233, 143, 17);
  text-decoration-thickness: 7px;
}

#Graun .topfoot a:nth-of-type(4):hover {
  text-decoration: underline;
  text-decoration-color: rgb(233, 17, 197);
  text-decoration-thickness: 7px;
}

#Graun .topfoot a:nth-of-type(5):hover {
  text-decoration: underline;
  text-decoration-color: #e5cda5;
  text-decoration-thickness: 7px;
}

#Graun .topfoot a:nth-of-type(6):hover {
  text-decoration: underline;
  text-decoration-color: #f3afd9;
  text-decoration-thickness: 7px;
}

.topnavright {
  top: 100%;
  float: right;
  color: white;
}

@font-face {
  font-family: Guardian;
  src: url(Fonts/Guardian-Egyp-Web-Regular.ttf);
}

@font-face {
  font-family: Guardian Heavy;
  src: url(Fonts/GuardianEgyp-Bold.ttf);
}
.topnavright a {
  -webkit-text-fill-color: white;
}

.topnavright a:hover {
  -webkit-text-fill-color: yellow;
}
.box a {
  padding-right: 2%;
}

.topfoot a:hover {
  text-decoration: none;
}

.topfoot .Mail a:hover {
  color: red;
}

.topfoot h1 a {
  padding-right: 0%;
}

#Graun {
  height: 100%;
  width: 100%;
  bottom: 100%;
  background-color: #062962;
  font-family: Guardian Heavy;
}

#Graun a {
  color: white;
}

#Graun a {
  padding-left: 6%;
  padding-right: 6%;
  text-decoration: none;
}

#Graun:hover {
  text-decoration: none;
}

#Graun a:hover {
  text-decoration: none;
}

#Graun .sass a {
  color: black;
  font-family: Guardian;
}

#Graun .sass a:hover {
  color: #b84f20;
}

.title {
  font-family: Guardian;
  padding-left: 2%;
  color: yellow;
}

#Graun::-moz-selection {
  color: black;
  background: yellow;
}

#Graun::selection {
  user-select: text;
  color: black;
  background: yellow;
}

#Graun header a {
  border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
}

li {
  font-size: 4dvh;
}

.underbox {
  padding-top: 3%;
  background-color: #062962;
  padding-bottom: 2%;
  display: inline-block;
  text-decoration-thickness: 3px;
  border: none;
}

.underbox a {
  border-top: 1px white;
  font-family: Arial;
}

.emoji {
  display: inline-block;
  font-size: 3rem;
}

.shake {
  animation: shake 0.5s linear infinite;
}

@keyframes shake {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-5px);
  }
  50% {
    transform: translateX(5px);
  }
  75% {
    transform: translateX(-3px);
  }
  100% {
    transform: translateX(3px);
  }
}

button {
  font-family: Impact;
}

.wordtitle {
  font-weight: 900;
  text-decoration: underline;
}

/*Retro*/

#Retro img {
  float: left;
  color: white;
}

.Retro {
  padding-left: 20%;
  padding-right: 20%;
}

.Retronav {
  font-family: Corpid;
  background-color: #f1f1f1;
  background-clip: content-box;
}

.Retronav a {
  color: black;
  font-size: 1.5rem;
  text-decoration: none;
}

.Retro::-webkit-scrollbar {
  width: 5em round;
  overflow: scroll;
}

.Retro::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px #0000;
}

.Retro::-webkit-scrollbar-thumb {
  background-color: #f5c342;
  outline: 5px solid #0000;
  width: 1em round;
  border-radius: 10px;
}

.Retro::-webkit-scrollbar-thumb:hover {
  cursor: url("img/background/cursors/Pointer1.svg");
}

.Retronav a:hover {
  background-color: #f5c342;
  color: black;
}
.columns {
  color: black;
  font-family: Corpid Regular;
  padding-bottom: 10%;
  font-size: 2rem;
}

.columns a {
  font-size: 2rem;
}
@media (width<768px) {
  #wrapper {
    columns: 1;
  }
}
#wrapper a {
  color: #1e4cad;
}

#wrapper a:hover {
  color: #bb271a;
}

.Retro .title_text {
  font-size: 1.5rem;
  top: 0;
  float: right;
}
.Retro h1 {
  color: black;
  font-family: Corpid Regular;
}
.Retro h2 {
  color: white;
  font-weight: 900;
  font-family: Corpid Regular;
  padding-bottom: 2%;
}

.Retro footer a {
  color: white;
  font-family: Corpid;
  font-size: 1.5rem;
  text-decoration: none;
}

.Retro footer a:hover {
  color: white;
  text-decoration: underline;
}

.Retro .title_text {
  float: right;
  padding-right: 20%;
  padding-top: 5%;
  size: 0.6rem;
}
.Retro .title_text {
  top: 0;
}

.Retro a {
  color: black;
  text-align: center;
}

.Retro a:hover {
  color: #1e4cad;
}

.Retro .columns {
  columns: 2;
}
.Retro .active {
  background-color: #f5c342;
}

#Retro {
  top: 0;
}
.Retro footer a {
  color: white;
  font-family: Corpid;
  font-size: 1.5rem;
  text-decoration: none;
}

.Retro footer a:hover {
  color: white;
  text-decoration: underline;
}

.Retro .title_text {
  float: right;
  padding-right: 20%;
  padding-top: 5%;
  size: 0.6rem;
}
.Retro .title_text {
  top: 0;
}

.Retro a {
  color: black;
  text-align: center;
}

.Retro a:hover {
  color: #1e4cad;
}

.Retro .columns {
  columns: 2;
}

#Sigh h4 {
  font-family: Helvetica Condensed;
}

.cart {
  font-size: 1.2rem;
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1.5rem;
  padding: 2rem;
}

.product {
  background: white;
  border-radius: 10px;
  padding: 1rem;
  text-align: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.product img {
  width: 100%;
  border-radius: 10px;
}

#toptopnav {
  font-weight: 900;
}

.refo {
  text-decoration: none;
}

.refo a:hover {
  text-decoration: none;
}