@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");

body {
  background-color: rgb(10, 0, 37);
  font-family: "Montserrat", sans-serif;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  color: white;
}

.page1 {
  color: white;
  text-transform: uppercase;
  margin: 150px 0;
}
.buttons button {
  margin: 0 50px;
}
button,
input[type="submit"] {
  --clr-font-main: hsla(0 0% 20% / 100);
  --btn-bg-1: hsla(194 100% 69% / 1);
  --btn-bg-2: hsla(217 100% 56% / 1);
  --btn-bg-color: hsla(360 100% 100% / 1);
  --radii: 0.5em;
  cursor: pointer;
  padding: 0.9em 1.4em;
  min-width: 120px;
  min-height: 44px;
  font-size: var(--size, 1rem);
  font-family: "Segoe UI", system-ui, sans-serif;
  font-weight: 500;
  transition: 0.8s;
  background-size: 280% auto;
  background-image: linear-gradient(
    325deg,
    var(--btn-bg-2) 0%,
    var(--btn-bg-1) 55%,
    var(--btn-bg-2) 90%
  );
  border: none;
  border-radius: var(--radii);
  color: var(--btn-bg-color);
  box-shadow: 0px 0px 20px rgba(71, 184, 255, 0.5),
    0px 5px 5px -1px rgba(58, 125, 233, 0.25),
    inset 4px 4px 8px rgba(175, 230, 255, 0.5),
    inset -4px -4px 8px rgba(19, 95, 216, 0.35);
  transition: 0.3s ease-in-out;
}

button:hover,
input[type="submit"]:hover {
  background-position: right top;
  scale: 1.1;
}

button:is(:focus, :focus-visible, :active),
input[type="submit"]:is(:focus, :focus-visible, :active) {
  outline: none;
  box-shadow: 0 0 0 3px var(--btn-bg-color), 0 0 0 6px var(--btn-bg-2);
}

@media (prefers-reduced-motion: reduce) {
  button,
  input[type="submit"] {
    transition: linear;
  }
}

.buttons {
  display: flex;
  margin: 50px 0;
}

input[type="text"],
input[type="email"],
input[type="password"] {
  background-color: #eee;
  border: none;
  padding: 1rem;
  font-size: 1rem;
  border-radius: 1rem;
  color: rgb(17, 50, 243);
  box-shadow: 0 0.4rem #dfd9d9;
  cursor: pointer;
  transition: 0.2s ease-in-out;
}

input[type="text"]:hover {
  box-shadow: 0 0.4rem #00ffea;
}
input[type="password"]:hover {
  box-shadow: 0 0.4rem #001aff;
}
input[type="email"]:hover {
  box-shadow: 0 0.4rem #001aff;
}
.contain {
  width: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.inscri {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.search input {
  width: 900px;
  margin: 75px 0;
}
.tweet,
.tweet_account {
  padding: 30px;
  margin: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  border-radius: 30px;
  width: 60%;
  background-color: white;
}
.user_tweet,
.text_tweet {
  color: black;
}
a {
  text-decoration: none;
}

.déco button {
  background: #ed213a; /* fallback for old browsers */
  background: -webkit-linear-gradient(
    to right,
    #93291e,
    #ed213a
  ); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #93291e, #ed213a);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

  box-shadow: 0px 0px 20px #ed213a, 0px 5px 5px -1px #93291e,
    inset 4px 4px 8px #ed213a, inset -4px -4px 8px #93291e;
}
.row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.column {
  display: flex;
  flex-direction: column;
}
.full_w {
  width: 100%;
  justify-content: center;
}
.row.full_w button {
  margin: 0 200px;
}
.center {
  text-align: center;
}
textarea {
  text-indent: 0;
}

.Cherche {
  font-size: 1.8em;
}
