/*-------------------------Marquee------------------------*/
.marquee {
    align-self: flex-end;
    border-top: 5px solid #3a3a3a !important;
    border-bottom: 5px solid #3a3a3a !important;
    box-sizing: content-box;
    font-family: 'Platypi', serif;
    height:50px;
    position:relative;
    overflow: hidden;
    width:100%;
    background-color:white;
  }

.marquee .mar {
    height:50px;
    text-align:center;
    position:absolute;
    width:150%;
    height:40px;
    left:150%;
    display:flex;
    justify-content: space-around;
  }
.marquee-0 {
    left:0;
}
.mar b {
    font-size:30px;
    line-height:60px;
    color:#E8B96D;
}
.mar h4 {
    line-height:45px;
    font-size:14px;
}

.marquee .marquee-0{
    animation: marquee0 50s linear;
}
.marquee .marquee-1{
    animation: marquee 100s linear infinite;
}
.marquee .marquee-2{
    animation: marquee 100s linear 50s infinite;
}
@keyframes marquee0 {
    0% { left: 0; }
    100% {left: -150%;}
}
@keyframes marquee {
    0% { left: 150%; }
    100% {left: -150%;}
}

@media (min-width: 770px) {
    .mar b  {
        font-size: 70px;
        line-height:72px;
    }
    .mar h4 {
         font-size:27px;
    }
}