<div class="banner-placeholder">
  
  <div class="bannerfield">
    <a href="https://www.datanomics.ru/sokraschenie-vozvratov-skoroport/">
      <div class="logo"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 232.7 116.7" enable-background="new 0 0 232.7 116.7" xml:space="preserve">
<g>
	<path fill="#7E7E7E" d="M21.2,87.3c-0.8,0-1.5,0.3-1.9,0.9c-0.4,0.6-0.7,1.4-0.7,2.5v8c-1-1.1-2.1-1.9-3.2-2.5
		c-1.1-0.5-2.4-0.8-4-0.8c-2.7,0-4.9,1-6.6,2.9c-1.7,1.9-2.5,4.6-2.5,8c0,1.6,0.2,3.1,0.6,4.5c0.4,1.4,1,2.6,1.8,3.6
		c0.8,1,1.8,1.8,2.9,2.4c1.1,0.6,2.3,0.8,3.6,0.8c1,0,1.9-0.1,2.7-0.4c0.8-0.3,1.6-0.7,2.3-1.2c0.7-0.5,1.4-1.2,2.2-2v0.5
		c0,1,0.2,1.8,0.7,2.3c0.5,0.5,1.1,0.8,1.8,0.8c0.8,0,1.4-0.3,1.9-0.8c0.5-0.5,0.7-1.3,0.7-2.3v-24c0-1-0.2-1.8-0.7-2.3
		C22.7,87.5,22.1,87.3,21.2,87.3z M17.7,110.3c-0.5,1-1.1,1.8-1.9,2.3c-0.8,0.5-1.7,0.7-2.6,0.7c-0.9,0-1.8-0.3-2.6-0.8
		c-0.8-0.5-1.4-1.3-1.9-2.3c-0.5-1-0.7-2.3-0.7-3.8c0-1.4,0.2-2.6,0.6-3.7c0.4-1.1,1-1.9,1.8-2.4c0.8-0.6,1.7-0.8,2.7-0.8
		c1,0,1.8,0.3,2.6,0.8c0.8,0.6,1.4,1.4,1.9,2.4c0.5,1,0.7,2.3,0.7,3.7C18.4,107.9,18.1,109.2,17.7,110.3z"/>
	<path fill="#7E7E7E" d="M48,109.9c0-1.1,0-2.1,0-3c0-0.9,0-2,0-3.3c0-2-0.3-3.6-0.8-4.9c-0.6-1.2-1.5-2.1-2.9-2.7
		c-1.4-0.6-3.3-0.8-5.6-0.8c-2.1,0-3.9,0.3-5.4,0.9c-1.4,0.6-2.5,1.3-3.2,2.2c-0.7,0.9-1,1.8-1,2.8c0,0.6,0.2,1.1,0.7,1.5
		c0.4,0.4,1,0.6,1.6,0.6c0.7,0,1.1-0.1,1.3-0.4c0.2-0.2,0.6-0.8,1.1-1.5c0.5-0.8,1.1-1.3,1.8-1.7c0.7-0.4,1.7-0.6,3.1-0.6
		c1.6,0,2.7,0.3,3.2,1c0.5,0.7,0.8,1.7,0.9,3.2c-1.1,0.3-2.2,0.6-3.2,0.8c-1,0.2-2.2,0.5-3.5,0.8c-1.4,0.3-2.2,0.5-2.6,0.5
		c-1.6,0.4-2.9,1.1-3.9,2.1c-0.9,1.1-1.4,2.3-1.4,3.8c0,1.1,0.3,2.1,0.9,3.1c0.6,0.9,1.4,1.7,2.4,2.2c1.1,0.6,2.3,0.8,3.7,0.8
		c1.5,0,2.9-0.3,4.1-0.8c1.2-0.5,2.5-1.3,3.8-2.3c0.6,1,1.2,1.8,1.7,2.3c0.5,0.5,1.1,0.8,1.7,0.8c0.7,0,1.3-0.2,1.8-0.7
		c0.5-0.5,0.8-1,0.8-1.5c0-0.3-0.2-1-0.5-2.1C48.2,112,48,111,48,109.9z M42.7,107.3c0,1.9-0.2,3.2-0.7,4.1c-0.4,0.7-1.1,1.4-2,1.8
		c-0.9,0.5-1.9,0.7-3,0.7c-1,0-1.8-0.3-2.5-0.9c-0.6-0.6-0.9-1.3-0.9-2.1c0-0.8,0.3-1.4,0.8-1.9c0.5-0.4,1.1-0.7,1.7-0.9
		c0.6-0.2,1.6-0.4,3.2-0.7c1.5-0.3,2.7-0.6,3.5-0.9V107.3z"/>
	<path fill="#7E7E7E" d="M63.3,113c-0.3,0-0.7,0.1-1.3,0.2c-0.5,0.1-1,0.2-1.3,0.2c-0.6,0-1-0.1-1.3-0.4c-0.3-0.3-0.4-0.7-0.5-1.1
		c-0.1-0.5-0.1-1.1-0.1-2v-10h1c1.1,0,1.9-0.1,2.5-0.4c0.6-0.3,0.9-0.8,0.9-1.5c0-0.6-0.2-1-0.6-1.4c-0.4-0.4-1-0.5-1.8-0.5h-2v-3.7
		c0-0.9,0-1.6-0.2-2.1c-0.1-0.5-0.3-0.9-0.7-1.3c-0.6-0.5-1.2-0.8-1.9-0.8c-0.5,0-0.9,0.1-1.3,0.3c-0.4,0.2-0.7,0.5-0.9,0.9
		c-0.2,0.4-0.3,0.8-0.4,1.3c0,0.5-0.1,1.2-0.1,2.1v3.3h-0.6c-0.8,0-1.5,0.2-1.9,0.5c-0.4,0.4-0.6,0.8-0.6,1.4c0,0.6,0.2,1,0.6,1.4
		c0.4,0.4,1,0.6,1.8,0.6h0.7v10.5c0,1.7,0.1,3,0.4,4c0.3,1,0.8,1.8,1.7,2.4c0.9,0.6,2.2,0.9,3.9,0.9c1.8,0,3.2-0.2,4.1-0.7
		c1-0.5,1.4-1.1,1.4-2c0-0.5-0.2-1-0.5-1.3C64.1,113.1,63.7,113,63.3,113z"/>
	<path fill="#7E7E7E" d="M85.7,109.9c0-1.1,0-2.1,0-3c0-0.9,0-2,0-3.3c0-2-0.3-3.6-0.8-4.9c-0.6-1.2-1.5-2.1-2.9-2.7
		c-1.4-0.6-3.3-0.8-5.6-0.8c-2.1,0-3.9,0.3-5.4,0.9c-1.4,0.6-2.5,1.3-3.2,2.2c-0.7,0.9-1,1.8-1,2.8c0,0.6,0.2,1.1,0.7,1.5
		c0.4,0.4,1,0.6,1.6,0.6c0.7,0,1.1-0.1,1.3-0.4c0.2-0.2,0.6-0.8,1.1-1.5c0.5-0.8,1.1-1.3,1.8-1.7c0.7-0.4,1.7-0.6,3.1-0.6
		c1.6,0,2.7,0.3,3.2,1c0.5,0.7,0.8,1.7,0.9,3.2c-1.1,0.3-2.2,0.6-3.2,0.8c-1,0.2-2.2,0.5-3.5,0.8c-1.4,0.3-2.2,0.5-2.6,0.5
		c-1.6,0.4-2.9,1.1-3.9,2.1c-0.9,1.1-1.4,2.3-1.4,3.8c0,1.1,0.3,2.1,0.9,3.1c0.6,0.9,1.4,1.7,2.4,2.2c1.1,0.6,2.3,0.8,3.7,0.8
		c1.5,0,2.9-0.3,4.1-0.8c1.2-0.5,2.5-1.3,3.8-2.3c0.6,1,1.2,1.8,1.7,2.3c0.5,0.5,1.1,0.8,1.7,0.8c0.7,0,1.3-0.2,1.8-0.7
		c0.5-0.5,0.8-1,0.8-1.5c0-0.3-0.2-1-0.5-2.1C85.9,112,85.7,111,85.7,109.9z M80.4,107.3c0,1.9-0.2,3.2-0.7,4.1
		c-0.4,0.7-1.1,1.4-2,1.8c-0.9,0.5-1.9,0.7-3,0.7c-1,0-1.8-0.3-2.5-0.9c-0.6-0.6-0.9-1.3-0.9-2.1c0-0.8,0.3-1.4,0.8-1.9
		c0.5-0.4,1.1-0.7,1.7-0.9c0.6-0.2,1.6-0.4,3.2-0.7c1.5-0.3,2.7-0.6,3.5-0.9V107.3z"/>
	<path fill="#7E7E7E" d="M109.7,99c-0.6-1.1-1.4-2-2.5-2.7c-1.1-0.6-2.4-0.9-3.8-0.9c-1.5,0-2.8,0.3-3.9,0.9
		c-1.1,0.6-2.2,1.5-3.1,2.8v-0.7c0-0.7-0.1-1.2-0.3-1.7c-0.2-0.5-0.5-0.8-0.9-1c-0.4-0.2-0.8-0.3-1.3-0.3c-0.8,0-1.4,0.3-1.9,0.8
		c-0.5,0.5-0.7,1.3-0.7,2.3v15.7c0,1.1,0.3,1.9,0.8,2.5c0.5,0.6,1.2,0.9,1.9,0.9c0.8,0,1.5-0.3,2-0.8c0.5-0.6,0.8-1.4,0.8-2.5v-6.8
		c0-2.2,0.1-3.7,0.4-4.5c0.4-1,1-1.8,1.8-2.4c0.8-0.6,1.7-0.9,2.7-0.9c1.5,0,2.5,0.5,3,1.4c0.5,1,0.7,2.3,0.7,4.1v9.1
		c0,1.1,0.3,1.9,0.8,2.5c0.5,0.6,1.2,0.9,2,0.9c0.8,0,1.4-0.3,1.9-0.8c0.5-0.6,0.7-1.4,0.7-2.5v-10.1c0-1.2-0.1-2.2-0.2-3
		C110.3,100.3,110,99.6,109.7,99z"/>
	<path fill="#7E7E7E" d="M133.4,98.4c-1-1-2.1-1.7-3.5-2.3c-1.3-0.5-2.8-0.8-4.5-0.8c-1.6,0-3.1,0.3-4.4,0.8
		c-1.3,0.5-2.5,1.3-3.4,2.2c-0.9,1-1.7,2.1-2.2,3.5c-0.5,1.4-0.8,2.9-0.8,4.5c0,1.6,0.2,3.1,0.7,4.5c0.5,1.3,1.2,2.5,2.2,3.5
		c1,1,2.1,1.8,3.4,2.3c1.3,0.5,2.8,0.8,4.4,0.8c1.7,0,3.2-0.3,4.5-0.8c1.3-0.5,2.5-1.3,3.4-2.3c1-1,1.7-2.2,2.2-3.5
		c0.5-1.4,0.8-2.9,0.8-4.5c0-1.6-0.2-3.1-0.7-4.5C135.1,100.6,134.4,99.4,133.4,98.4z M129.4,111.6c-1,1.2-2.3,1.9-3.9,1.9
		c-1.1,0-2-0.3-2.8-0.8c-0.8-0.6-1.4-1.4-1.9-2.4c-0.4-1.1-0.6-2.3-0.6-3.7c0-1.4,0.2-2.7,0.7-3.8c0.4-1.1,1.1-1.9,1.9-2.4
		c0.8-0.6,1.7-0.8,2.8-0.8c1.6,0,3,0.6,3.9,1.9c1,1.2,1.5,3,1.5,5.2C130.9,108.6,130.4,110.4,129.4,111.6z"/>
	<path fill="#7E7E7E" d="M168.4,96.3c-1.1-0.6-2.4-0.9-3.8-0.9c-1.3,0-2.4,0.3-3.5,0.8c-1.1,0.5-2,1.4-3,2.5
		c-0.6-1.1-1.4-1.9-2.4-2.5c-1-0.5-2.2-0.8-3.5-0.8c-1.3,0-2.5,0.3-3.6,0.8c-1.1,0.5-2.1,1.4-3,2.5v-0.5c0-0.9-0.2-1.6-0.7-2.1
		c-0.5-0.5-1.1-0.7-1.9-0.7c-0.8,0-1.4,0.3-1.9,0.8c-0.5,0.5-0.7,1.3-0.7,2.3v15.6c0,1.1,0.3,2,0.8,2.6c0.5,0.6,1.2,0.9,2,0.9
		c0.8,0,1.5-0.3,2-0.9c0.5-0.6,0.8-1.4,0.8-2.6v-7.4c0-2.3,0.3-4,0.8-5.3c0.6-1.2,1.7-1.8,3.5-1.8c0.9,0,1.5,0.2,2,0.7
		c0.4,0.5,0.7,1.1,0.8,1.9c0.1,0.8,0.1,1.8,0.1,3.2v8.7c0,1.1,0.3,2,0.8,2.6c0.5,0.6,1.2,0.9,2,0.9c0.9,0,1.5-0.3,2.1-0.9
		c0.5-0.6,0.8-1.4,0.8-2.6v-7.2c0-2.3,0.2-3.9,0.6-4.9c0.4-0.7,0.9-1.3,1.5-1.7c0.6-0.4,1.3-0.6,2-0.6c0.9,0,1.6,0.2,2,0.7
		c0.4,0.5,0.7,1.1,0.8,1.8c0.1,0.7,0.1,1.6,0.1,2.8v9.2c0,1.1,0.3,2,0.8,2.6c0.5,0.6,1.2,0.9,2,0.9c0.9,0,1.5-0.3,2.1-0.9
		c0.5-0.6,0.8-1.4,0.8-2.6v-10.6c0-2.1-0.2-3.7-0.7-4.6C170.2,97.7,169.4,96.9,168.4,96.3z"/>
	<path fill="#7E7E7E" d="M204.5,108.4c-0.6,0-1,0.2-1.4,0.5c-0.4,0.3-0.7,0.8-1.1,1.4c-0.6,1-1.3,1.8-2.1,2.3
		c-0.8,0.5-1.7,0.8-2.8,0.8c-0.8,0-1.6-0.2-2.2-0.5c-0.7-0.3-1.3-0.8-1.7-1.4c-0.5-0.6-0.8-1.3-1.1-2.2c-0.3-0.9-0.4-1.8-0.4-2.8
		c0-2.2,0.5-3.9,1.5-5.2c1-1.3,2.3-1.9,3.9-1.9c1.1,0,2,0.3,2.8,0.8c0.7,0.5,1.4,1.3,2.1,2.3c0.4,0.5,0.7,0.9,1,1.1
		c0.3,0.2,0.7,0.3,1.1,0.3c0.7,0,1.3-0.2,1.8-0.7c0.5-0.5,0.7-1,0.7-1.7c0-0.6-0.2-1.3-0.6-2.1c-0.4-0.7-1.1-1.4-1.9-2.1
		c-0.8-0.7-1.8-1.2-3-1.6c-1.2-0.4-2.5-0.6-3.9-0.6c-2.3,0-4.2,0.5-5.9,1.4c-1.6,0.9-2.9,2.3-3.8,4c-0.9,1.7-1.3,3.7-1.3,5.9
		c0,3.3,0.9,5.9,2.8,7.9c1.9,2,4.5,2.9,7.9,2.9c1.6,0,3-0.2,4.3-0.6c1.3-0.4,2.3-1,3.1-1.7c0.8-0.7,1.4-1.4,1.9-2.2
		c0.4-0.8,0.6-1.5,0.6-2.2c0-0.6-0.2-1.1-0.7-1.6C205.7,108.6,205.2,108.4,204.5,108.4z"/>
	<path fill="#7E7E7E" d="M225.8,105.7c-1.1-0.6-2.5-1.1-4.1-1.5c-1.4-0.3-2.5-0.6-3.4-0.9c-0.8-0.2-1.5-0.5-1.9-0.9
		c-0.5-0.4-0.7-0.8-0.7-1.4c0-0.6,0.3-1.1,1-1.6c0.7-0.4,1.5-0.6,2.5-0.6c1,0,1.7,0.2,2.3,0.5c0.6,0.3,1,0.7,1.5,1.3
		c0.5,0.6,1,1.1,1.3,1.4c0.4,0.3,0.9,0.5,1.4,0.5c0.8,0,1.4-0.2,1.8-0.6c0.4-0.4,0.6-0.9,0.6-1.5c0-0.6-0.2-1.2-0.6-1.8
		c-0.4-0.6-1-1.1-1.7-1.6c-0.8-0.5-1.7-0.9-2.8-1.2c-1.1-0.3-2.4-0.4-3.8-0.4c-1.8,0-3.3,0.3-4.6,0.9c-1.3,0.6-2.2,1.4-2.9,2.3
		c-0.7,1-1,2-1,3.1c0,1.2,0.4,2.3,1.1,3.1c0.7,0.8,1.6,1.5,2.8,2c1.2,0.5,2.7,1,4.6,1.5c1.7,0.4,2.9,0.8,3.6,1.3
		c0.7,0.4,1.1,1.1,1.1,2.1c0,0.6-0.3,1.2-1,1.7c-0.7,0.5-1.6,0.7-2.7,0.7c-1.3,0-2.4-0.2-3.2-0.7c-0.8-0.5-1.4-1.2-2-2.2
		c-0.3-0.5-0.6-0.9-0.9-1.2c-0.3-0.3-0.7-0.4-1.3-0.4c-0.7,0-1.2,0.2-1.6,0.6c-0.4,0.4-0.6,0.9-0.6,1.5c0,0.9,0.3,1.8,1,2.7
		c0.7,0.9,1.7,1.6,3.1,2.2c1.4,0.6,3.1,0.9,5,0.9c2,0,3.8-0.3,5.2-0.8c1.4-0.6,2.5-1.4,3.2-2.4c0.7-1.1,1.1-2.4,1.1-3.9
		c0-1-0.3-1.9-0.8-2.7C227.7,106.9,226.9,106.3,225.8,105.7z"/>
	<path fill="#7E7E7E" d="M140.6,58.6c5.3-3.3,6.9-10.2,3.6-15.4c-3.3-5.3-10.2-6.9-15.4-3.6c-2.5,1.6-4.3,4-5,7
		c-0.7,2.9-0.2,5.9,1.4,8.5c1.5,2.5,3.9,4.1,6.5,4.9v13.1H3c-1.7,0-3,1.3-3,3c0,1.7,1.3,3,3,3h134.6V59.9
		C138.7,59.6,139.7,59.2,140.6,58.6L140.6,58.6z M137.5,53.5c-2.4,1.5-5.7,0.8-7.2-1.7c-0.7-1.2-1-2.6-0.6-3.9
		c0.3-1.4,1.1-2.5,2.3-3.2c0.9-0.5,1.8-0.8,2.7-0.8c1.7,0,3.5,0.9,4.4,2.5C140.7,48.7,139.9,52,137.5,53.5z"/>
	<path fill="#7E7E7E" d="M157.4,80.2c1.7,0,3-1.3,3-3v-34c1-0.3,2-0.7,2.9-1.3c2.5-1.6,4.3-4,5-7c0.7-2.9,0.2-5.9-1.4-8.5
		c-1.6-2.5-4-4.3-7-5c-2.9-0.7-5.9-0.2-8.5,1.4c-5.3,3.3-6.9,10.2-3.6,15.4c1.5,2.4,3.8,4.1,6.5,4.9v34.1
		C154.4,78.9,155.8,80.2,157.4,80.2z M153,35.1c-0.7-1.2-1-2.6-0.6-3.9c0.3-1.4,1.1-2.5,2.3-3.2c0.8-0.5,1.8-0.8,2.7-0.8
		c0.4,0,0.8,0,1.2,0.1c1.4,0.3,2.5,1.1,3.2,2.3c0.7,1.2,1,2.6,0.6,3.9c-0.3,1.4-1.1,2.5-2.3,3.2v0c-1.2,0.7-2.6,1-3.9,0.6
		C154.9,37.1,153.7,36.3,153,35.1z"/>
	<path fill="#7E7E7E" d="M189,47.5c-1.6-2.5-4-4.3-7-5c-2.9-0.7-5.9-0.2-8.5,1.4c-2.5,1.6-4.3,4-5,7c-0.7,2.9-0.2,5.9,1.4,8.5
		c1.5,2.5,3.8,4.1,6.4,4.9v11.7l0,38.9c0,1.7,1.3,3,3,3c0,0,0,0,0,0c1.6,0,3-1.3,3-3l0-39V64.2c1-0.3,2.1-0.7,3-1.3v0
		C190.7,59.7,192.3,52.8,189,47.5z M182.2,57.8c-2.4,1.5-5.7,0.8-7.2-1.7c-0.7-1.2-1-2.6-0.6-3.9c0.3-1.4,1.1-2.5,2.3-3.2
		c0.8-0.5,1.8-0.8,2.7-0.8c0.4,0,0.8,0,1.2,0.1c1.4,0.3,2.5,1.1,3.2,2.3C185.4,53.1,184.7,56.3,182.2,57.8z"/>
	<path fill="#7E7E7E" d="M227.8,40.2c-7-11.5-19.7-12.8-24.7-12.8c0,0,0,0,0,0C199.7,20.9,186.5,0,157.8,0
		c-48.9,0-55.4,46.6-55.5,47.1c-0.2,1.6,1,3.1,2.6,3.4c1.7,0.2,3.1-0.9,3.4-2.6c0.2-1.7,6-41.9,49.5-41.9
		c29.8,0,40.3,24.6,40.7,25.6l0.8,2.1l2.2-0.2c0.6-0.1,14.4-1.2,21.1,9.8c6.3,10.4,3.7,18.2,1.6,21.9c-2.7,4.8-7.1,7.7-9.9,7.7
		l-23.6,0v6l23.6,0c5.4,0,11.6-4.4,15.1-10.7C232.2,63.3,235.7,53.2,227.8,40.2z"/>
</g>
</svg>
        <div class="bn-sq">
          <div class="bn-sq1"></div>
          <div class="bn-sq2"></div>
          <div class="bn-sq3"></div>
        </div>
        
</div>
      <div class="slides">
        <div class="slide"><span>Убытки из-за возвратов продукции?</span></div>
        <div class="slide"><span>Мы знаем, как помочь!</span></div>

 </div>
      <div class="bn-plus"></div>
      <div class="bn-qst">?</div>
      <div class="bn-qst bn-qst2">?</div>
      </a>
      </div>
      

    
  </div>
  
body {
  background: #efefef;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.banner-placeholder {
  width: 1160px;
  height: 75px; 
  margin: 4rem auto 0 auto;
  background: #fff;
}


$corner: rgba(255,255,255, .5);

.bannerfield  {
  width: 1160px;
  height: 75px;
  display: block;
  position: relative;
  overflow: hidden;  
  box-sizing: border-box;
}

a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  .bn-sq {
       transform: translateX(0px) !important;
       transition: all .25s ease-out;
    }
  svg {
    transition: all .25s ease-out;
    path {
      transition: all .25s ease-out;
    }
  }
  &:hover {
    .slides {
      background: #2EC679; 
    }
    .bn-sq {
      transform: translateX(50px) !important;
      
      
    }
    svg {
      transform: scale(0.95) translateX(12px);
    path {
      fill: #f29400 !important;
    }
  }
    .bn-plus {
      &:before {
        left: 8px;
        top: 8px;
      }
      &:after {
        right: 8px;
        bottom: 8px;
      }
    }
  }
  
}

.logo {
  float: left;
  width: 20%;
  height: 100%;
  box-sizing: border-box;
  position: relative;
  display: block;
  text-align: center;
  border: 1px #ccc solid;
  border-right: none;
  svg {
    height: 60px;
    display: inline-block;
    margin: 7px 24px 0 0;
    transform: scale(1) translateX(0);
  }

  .bn-sq1 {
    background: #E2F1EA;
    width: 9px;
    height: 9px;
    bottom: 18px;
    right: 36px;
    position: absolute;
    animation: bn-an1 5s infinite ease-in-out;
  }
  .bn-sq2 {
    background: #9BD8B9;
    width: 18px;
    height: 18px;
    bottom: 0;
    right: 18px;
    position: absolute;
    animation: bn-an2 5s infinite ease-in-out;
  }
  .bn-sq3 {
    background: #CAE9D9;
    width: 18px;
    height: 18px;
    bottom: 18px;
    right: 0;
    position: absolute;  
    animation: bn-an3 5s infinite ease-in-out;
    
  }
}

.slides {
  float: left;
  width: 80%;
  box-sizing: border-box;
  background: #0EA659;
  position: relative;
  animation: moveslides 8s infinite;
  padding: 75px 0; 
  overflow: hidden;
  transition: all .25s;
}

.bn-qst {  
  position: absolute;
  top: -40px;
  right: 30px;
  font-size: 120px;
  color: rgba(255,255,255,0.25);
  animation: bn-qst-an 8s infinite ease-in-out;
}
.bn-qst2 {
  top: 10px;
  right: 0px;
  font-size: 90px;
}
.bn-plus {
  
  width: 80%;
  height: 75px;
  position: absolute;
  top: 0;
  right: 0;
  &:before {
    display: block;
    position: absolute;
    top: 12px;
    left: 12px;
    content:"";
    color: $corner;
    width: 16px;
    height: 16px;
    line-height: 16px;
    padding-left: 4px;
    border-top: 1px $corner solid;
    border-left: 1px $corner solid;
    transition: all .25s ease-out;
  }
  &:after {
    display: block;
    position: absolute;
    bottom: 12px;
    right: 12px;
    content: "";
    font-size: 12px;
    text-align: center;
    color: $corner;
    width: 16px;
    height: 16px;
    line-height: 16px;
    padding-left: 4px;
    border-bottom: 1px $corner solid;
    border-right: 1px $corner solid;
    transition: all .25s ease-out;
    
  }
}

.slide {
  height: 75px;
  text-align: center;
  color: #fff;
  
  position: relative;
  width: 100%;
  font-size: 30px;
}

span {
  position: absolute;
  width: 90%;
  max-height: 75px;
  top: 48%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes moveslides {
  0% {transform: translateY(-30px);}
  5% {transform: translateY(-75px);}
  45% {transform: translateY(-75px);}
  55% {transform: translateY(-150px);}
  95% {transform: translateY(-150px);}
  
  100% {transform: translateY(-200px);}
  
}

@keyframes bn-qst-an {
  0% {transform: translate(-35px, 0); opacity: 0;}
  5% {transform: translate(-35px, 0); opacity: 1;}
  50% {transform: translate(-65px, 0); opacity: 1;}
  70% {transform: translate(0, -300px); opacity: 0;}
  100% {transform: translate(0, -300px); opacity: 0;}
}



@keyframes bn-an3 {
  0% {transform: translateY(0);}
  70% {transform: translateY(18px);}
  100% {transform: translateY(0px);}
}

@keyframes bn-an2 {
  0% {transform: translateY(0);}
  30% {transform: translateY(-18px);}
  100% {transform: translateY(0px);}
}

@keyframes bn-an1 {
  0% {transform: translateY(0);}
  50% {transform: translateY(18px);}
  100% {transform: translateY(0px);}
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.