:root{
	--color-cod-gray:#CD853F;
	--color-primary:#FFFACD;
	}


body{
	background-color:var(--color-cod-gray);
	font-family:Arial,Helvetica,sans-serif;

}

.tiles{display:flex;flex-direction:column;justify-content:center;left:50%;position:fixed;top:50%;-webkit-transform:translateX(-50%) translateY(-50%) rotate(320deg)}
.tiles__line{-webkit-animation:runner 5s linear infinite;display:flex;transform:translateX(25%)}
.tiles__line:nth-child(2){-webkit-animation-duration:50s}
.tiles__line:nth-child(3){-webkit-animation-duration:50s}
.tiles{display:flex;flex-direction:column;justify-content:center;left:50%;position:fixed;top:50%;-webkit-transform:translateX(-50%) translateY(-50%) rotate(320deg)}
.tiles__line{-webkit-animation:runner 20s linear infinite;display:flex;transform:translateX(25%)}
.tiles__line:nth-child(2){-webkit-animation-duration:32s}
.tiles__line:nth-child(3){-webkit-animation-duration:44s}
.tiles2{top:56%;display:none}
.tiles2 .tiles__line{-webkit-animation:runner 23s linear infinite;display:flex;transform:translateX(25%)}
.tiles2 .tiles__line:nth-child(2){-webkit-animation-duration:8s}
.tiles2 .tiles__line:nth-child(3){-webkit-animation-duration:12s}
.tiles2 .tiles__line-img{--tile-margin:2vw;height:20vh;width:20vh;opacity:.8}
.tiles2 .tiles__line-img--large{height:5vh;width:100vh;opacity:.5}@keyframes runner{to{-webkit-transform:translateX(-25%)}}
.tiles__line-img{--tile-margin:3vw;background-position:50% 50%;background-size:cover;border-radius:3vh;flex:none;height:30vh;margin:var(--tile-margin);width:30vh;background-color:var(--color-primary);opacity:.3}
.tiles__line-img--large{border-radius:3vh;width:100vh;opacity:.3}

  .br2 {
        display: block;
        margin-bottom: 1mm;
  }

.hr2 {
  border: 3px solid #FFFACD;
  border-radius: 3px;
}

.ali1 {
  text-align: center;
  background: #CD853F;
  margin: auto;
}

button{
  position: center;
  border: 2px solid #FFE4B5;
  background: #CD853F;
  font-family: 'Roboto', sans-serif;
  color: #000000;
  width: 250px;
  height: 50px;
  font-size: 25px;
  border-radius: 30px;
  opacity: .8;
  top: 10vh;
  bottom: 0px;
  left: 0px;
  right: 0px;
  margin: 2px;
  transition: .3s;
  cursor: pointer;
}

button:hover{
  border: 2px dotted #104F55;
  background-color: rgba(365,365,365,0.5);
  cursor: pointer;
  color: #104F55;
  opacity: .8;
  transition: .3s;
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}



.linear-wipe {
    text-align: center;
    background: linear-gradient(to right, rgb(218,165,32) 20%, rgb(255,228,181) 40%, rgb(210,105,30) 60%, #fff 80%);
    background-size: 200% auto;
    color: #000;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: BackgrounGradient 10s ease infinite;
    -moz-animation: BackgrounGradient 10s ease infinite;
    animation: BackgrounGradient 10s ease infinite;
}

@-webkit-keyframes BackgrounGradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes BackgrounGradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes BackgrounGradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
  
  @keyframes shine {
    to {
      background-position: 200% center;
    }
  }