body {
background: #404819;
background: linear-gradient(0deg, rgba(64, 72, 25, 1) 0%, rgba(26, 33, 83, 1) 50%, rgba(131, 25, 25, 1) 100%);
color: #E3B18C;
min-height: 100vh; 
}

a {
  color: #E3B18C;
}

h1 {
  font-size: 1em;
}

h2 {
  font-size: 0.75em;
}

p {
  font-size: 0.7em;
}

.item {
  /*border: 1px solid #B4570B;*/
  border-radius: 0.5em;
  height: 100%;
  width: 200px;
  padding: 20px;
  background-color: #B43A0B;
  text-align: center;
  box-shadow: 0 4px 8px 0 rgba(255, 0, 0, 0.2), 0 6px 20px 0 rgba(255, 0, 0, 0.19);
}

.container {
  font: 1.2em sans-serif;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

/*begin 2x2*/
.text {
  display: flex;
  justify-content: center;
  align-items: center;
}

.container_text {
  display: flex;
  flex-wrap: wrap;
}

.container_text > div {
  flex: 50%;
  margin-bottom: 10px;
}
/*end 2x2*/

/* bg rosa */
.ro_bg {
  position: absolute;
  right: 40%;
  top: 30%;
  height: 70%;
 /* max-width: calc(
    100vw - 8px * 2
  ); */
  margin-inline: auto;
  z-index: -1;
}


/* perching rosa */
.ro2 {
  position: relative;
  left: 0px;
  right: 0px;
  bottom: -50px;
  width: 12rem;
  margin-inline: auto;
  z-index: 1;
}

/* bottom right rosa */
.ro3 {
  position: absolute;
  right: 20px;
  bottom: 10px;
  width: 50px;
  z-index: 1;
}

.back {
  position: absolute;
  right: 20px;
  bottom: 0px;
  z-index: 1;
}

/* spinning rosa */

/* stick rosa to bottom
.ro1 {
  position: fixed;
  left: 0px;
  right: 0px;
  bottom: 8px;
  width: 12rem;
  max-width: calc(
    100vw - 8px * 2
  );
  margin-inline: auto;
  z-index: 1;
}
*/


.spin {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 30px;
}


.ro1 {
    position: absolute;
    width: 60px;
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }