html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

/* Kleuren
#FFD800 (back)
#434343 (text)
#FFE97D (text back)
*/

img {
  max-width: 100%;
}

/* Default kleuren */
body {
  background-color: #FFD800;
  color: #434343;
}

/* Voor de zijbalk, deze zijn sticky zodat het altijd zichtbaar is */
.Sidebar {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: sticky;
  top: 10px;
  min-height: 10%;
}

/* Geen background of border op de button. en zorgen dat als je muis op de button is dat het een pointer wordt */
button {
  background: none;
  border: none;
}

button:hover {
  cursor: pointer;
}

.Menu {
  gap: 50px;
  padding: 5px;
}

.Box {
  background-color: #A28700;
  border-radius: 5px;
  box-shadow: 15px 15px 0px rgba(0, 0, 0, 0.25);
  border: 5px solid #A28700;
  padding: 20px;
}

.CenteredItems {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 1rem;
}

.Column{
display: flex;
  flex-direction: column;
  gap: 1rem;
}

.RowItems{
  display: flex;
  flex-direction: row;
  gap: 1%;
}

.Inline{
  display: inline;
}

.Attachment{
  width: 50%;
}

.BoldText{
  font-weight: bold;
}

.Hidden{
  display: none;
}

.TitleText {
  font-family: ChauPhilomeneOne;
}

.SmallTitleText {
  font-family: Anton;
}

.ShortBox{
  min-height: 12%;
}

.SmallBox {
  width: 12%;
  padding: 20px;
}

.WideBox {
  width: 40%;
  padding: 20px;
}

.WiderBox {
  width: 60%;
  padding: 20px;
}

.VeryWideBox {
  width: 120%;
  padding: 20px;
}

.LeftAlign {
  align-self: flex-start;
}

.ForgotPassword {
  font-family: Anton;
  color: #4343434b;
}

.PostLink {
  font-family: ComicReliefRegular;
  color: black;
}

.FitWidth {
  width: 100%;
}

.FitHeight {
  min-height: 100%;
}

select {
  background-color: #434343;
  color: white;
  border-radius: 15px;
}

.LogoutCard {
  position: absolute;
  left: 70px;
  bottom: 50px;
  z-index: 1;
}

.Inactive {
  display: none;
}
.ProfilePic {
  position: relative;
  border-radius: 50%;
  object-fit: cover;
}

.LongBox {
  min-height: 2.5rem;
}

.PositiveButton {
  background-color: #FFE97D;
  border-radius: 10px;
}

input[type="file"] {
  display: none;
}

.file-upload {
  border: 3px solid black;
  border-radius: 15px;
  background-color: #434343;
  display: flex;
  padding: 6px 12px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
}

textarea {
  background-color: #FFE97D;
  resize: none;
  font-family: ComicReliefRegular;
  border-radius: 10px;
}

.Tweet {
  background-color: #FFE97D;
  border-radius: 5px;
  min-height: 25%;
  color: #434343;
  text-decoration: none;
}

a.PostContent:link {
  color: #434343;
  text-decoration: none;
}

a.PostContent:visited {
  color: #434343;
  text-decoration: none;
}

a.PostContent:hover {
  color: #434343;
  text-decoration: none;
}

a.PostContent:active {
  color: #434343;
  text-decoration: none;
}


.TweetText {
  font-family: ComicReliefRegular;

}

.Tweets {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.MainView {
  display: flex;
  align-items: start;
  justify-content: center;
  gap: 10%;
  max-width: 2160px;
}

.MainViewLogin{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10%;
  max-width: 2160px;
}