* { margin: 0; padding: 0; } .about { width: 100%; height: 100%; overflow: hidden; } .about_bgc { width: 100% } .about_tit { position: absolute; top: 280px; left: 0; right: 0; font-size: 28px; font-weight: 550; bottom: 0; width: 800px; margin: auto; text-align: center; } .ribbon { display: flex; justify-content: center; position: absolute; right: 300px; top: 50px; margin: auto; } .ribbon:after, .ribbon:before { margin-top: 0.5em; content: ""; display: flex; ; border: 1.5em solid #fff; } .ribbon:after { border-right-color: transparent; } .ribbon:before { border-left-color: transparent; } .ribbon a:link, .ribbon a:visited { color: #000; text-decoration: none; height: 3.5em; overflow: hidden; } .ribbon span { background: #fff; display: inline-block; line-height: 3em; padding: 0 1.5em; margin-top: 0.5em; position: relative; -webkit-transition: background-color 0.2s, margin-top 0.2s; /* Saf3.2+, Chrome */ -moz-transition: background-color 0.2s, margin-top 0.2s; /* FF4+ */ -ms-transition: background-color 0.2s, margin-top 0.2s; /* IE10 */ -o-transition: background-color 0.2s, margin-top 0.2s; /* Opera 10.5+ */ transition: background-color 0.2s, margin-top 0.2s; } .ribbon a:hover span { background: #FFD204; margin-top: 0; } .ribbon span:before { content: ""; position: absolute; top: 3em; left: 0; border-right: 0.5em solid #9B8651; border-bottom: 0.5em solid #fff; } .ribbon span:after { content: ""; position: absolute; top: 3em; right: 0; border-left: 0.5em solid #9B8651; border-bottom: 0.5em solid #fff; } .me { display: flex; justify-content: center; margin-top: 60px; overflow: hidden; } .me_tit { width: 600px; line-height: 36px; font-size: 18px; margin-left: 100px; margin-top: 50px; } .me_img { width: 800px; height: 600px; } .animate { padding-left: 20px; width: 500px; font-size: 16px; color: #000; animation: 10s wordsLoop linear infinite normal; } @keyframes wordsLoop { 0% { transform: translateY(100px); -webkit-transform: translateY(100px); } 100% { transform: translateY(-100%); -webkit-transform: translateY(-100%); } } .videos { display: flex; margin-top: 60px; padding-bottom: 80px; } .videos span { width: 400px; margin-right: 100px; margin-left: 300px; color: #FFD204 }