AAAAAAAAidia

.diagonal{ width: 100%; height :300px; padding: 10px; position:absolute; transform:rotate(-10deg); bottom: 0px; } .diagonal2{ width: 100%; height :300px; padding: 10px; position:absolute; transform:rotate(+10deg); bottom: 0px; } .diagonal2 p{ position: absolute; bottom: 0px; left: 40px; color: #1e90ff; font-weight: none ; font-size: 25px; transform: rotate(-10deg); } .diagonal p{ position: absolute; bottom: 0px; left: 40px; color: #1e90ff; font-weight: none ; font-size: 25px; transform: rotate(-10deg); } .marquee { height: 15px; overflow: hidden; position: relative; background: transparent; color: #333; border:none; } .marquee p { position: relative; width: 100%; height: 100%; margin: 0; line-height: 25px; transform:rotate(-15deg); color:#c2d6d6; font-family: "gay"; -moz-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); -moz-animation: scroll-left 2s linear infinite; -webkit-animation: scroll-left 2s linear infinite; animation: scroll-left 20s linear infinite; } @-moz-keyframes scroll-left { 0% { -moz-transform: translateX(100%); } 100% { -moz-transform: translateX(-100%); } } @-webkit-keyframes scroll-left { 0% { -webkit-transform: translateX(100%); } 100% { -webkit-transform: translateX(-100%); } } @keyframes scroll-left { 0% { -moz-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); } 100% { -moz-transform: translateX(-100%); -webkit-transform: translateX(-100%); transform: translateX(-100%); } }