/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

/* MAIN */

body {
  max-width: 1366px;
  padding: .5em;
  background-color: #0F000F;
  color: #FF7FFF;
  font-family: verdana;
  text-align: center
}

header {
    border: 1px;
    border-style: dashed;
    padding: 5px;
    margin-left: 25px;
    margin-right: 25px;
}

.main {
    text-align: center;
    overflow: auto;
    margin-left: 5%;
    margin-right: 5%;
    padding-bottom: 15px;
    display: flex;
    justify-content: flex-start;
}

.alert {
  text-align: center;
  background-color: #FF7FFF;
  color: #000000;
  font-weight: bold;
  border-style: ridge;
  border-width: 1px;
  border-color: #FF00FF;
  padding: 5px;
  margin-left: 25px;
  margin-right: 25px;
}

.alertError {
  text-align: center;
  background-color: #FF007F;
  color: #FFFFFF;
  font-weight: bold;
  border-style: ridge;
  border-width: 1px;
  border-color: #FF0000;
  padding: 5px;
  margin-left: 25px;
  margin-right: 25px;
}

.aboutlyx {
  width: 30%;
  max-width: 300px;
  border: 1px;
  border-style: solid;
  padding: 15px;
  margin-left: 5%;
  margin-right: 5%
}

.rand {
  border: 1px;
  border-style: dashed;
  width: 70%;
  height: 45%;
  padding-top: 15px;
  padding-bottom: 15px;
  margin-left: 0;
  margin-right: 5%;
}

/* TEXT */

h1 {
  border-style: double;
  margin-left: 50px;
  margin-right: 50px;
}

hr {
  height: 1px;
  background-color: #3f003f;
  border: none;
  margin-left: 50px;
  margin-right: 50px;
}

/* <p> */
  .dotted {border-style: dotted;}
  .dashed {border-style: dashed;}
  .dashed2 {border: 1px; border-style: dashed; padding: 5px; margin-left: 100px; margin-right: 100px;}
  .solid {border-style: solid;}
  .double {border-style: double;}
  .groove {border-style: groove;}
  .ridge {border-style: ridge;}
  .inset {border-style: inset;}
  .outset {border-style: outset;}
  .none {border-style: none;}
  .hidden {border-style: hidden;}
  .mix {border-style: dotted dashed solid double;}
/*-----*/

/* LINKS */

a:link {
  color: #FF00FF;
  text-decoration: double;
  font-weight: bold
}

a:visited {
  color: #FF00FF;
  text-decoration: double;
  font-weight: bold
}

a:hover {
  color: #FFEFFF;
  text-decoration: double;
  font-weight: bold
}

/* SCRIPTS */

#hromi {
    border: 1px;
    border-style: solid;
    padding: .5em;
    margin-left: 5px;
    margin-right: 5px;
}
#hromi-username {
    margin-bottom: .5em;
    font-weight: bold
}
#hromi-content {
    margin: 0 1em 0.5em 1em;
}

#statuscafe {
    border: 1px;
    border-style: solid;
    padding: .5em;
    margin-left: 5px;
    margin-right: 5px;
}
#statuscafe-username {
    margin-bottom: .5em;
    font-weight: bold
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
}

