Advertisement
Hye_Ri_Codes

Mind your own business

Oct 17th, 2019
601
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.04 KB | None | 0 0
  1. <div class="MYOB"><div class="mind">Mind Your <span>Own Business</span><img src="https://i.imgur.com/gZiMu8u.png"/></div><ul class="business">
  2.  
  3. <li><div class="busim"><img src="https://i.imgur.com/17E0Fqq.png"/><div class="busrel"><span>Nombre MUY largo</span></div></div><div class="busrel1"><span class="th th-broken-heart"></span></div> </li>
  4.  
  5. <li> <div class="busim"> <img src="https://i.imgur.com/QgziWSD.png"/><div class="busrel"><span>Nombre MUY largo</span></div> </div><div class="busrel1"><span class="th th-bubble-heart"></span></div></li>
  6.    
  7. <li><div class="busim"> <img src="https://i.imgur.com/uZM9Uvm.png"/> <div class="busrel"><span>Nombre MUY largo</span> </div> </div> <div class="busrel1"><span class="th th-briefcase"></span></div> </li>
  8.  
  9. <li><div class="busim">  <img src="https://i.imgur.com/2raphRr.png"/><div class="busrel">  <span>Nombre MUY largo</span> </div> </div> <div class="busrel1"><span class="th th-broken-heart"></span></div></li>
  10.  
  11. <li><div class="busim"> <img src="https://i.imgur.com/FLqQsdx.png"/><div class="busrel">   <span>Nombre MUY largo</span></div> </div><div class="busrel1"><span class="th th-bubble-heart"></span></div>   </li>
  12.    
  13.  <li> <div class="busim"> <img src="https://i.imgur.com/Ffij7iv.jpg"/><div class="busrel"><span>Nombre MUY largo</span> </div> </div><div class="busrel1"><span class="th th-briefcase"></span></div></li>
  14.    
  15. </ul></div><div class="busleg"><div class="busleg1"><span class="th th-briefcase"></span> TRABAJO </div>  <div class="busleg1"> <span class="th th-bubble-heart"></span> BUENA RELACIÓN </div> <div class="busleg1"><span class="th th-broken-heart"></span> MALA RELACIÓN</div></div> <a href="https://hyeri-code.tumblr.com/" class="HRcreds">HYE RI</a><link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  16.  
  17. <style>.MYOB{ width: 400px; padding: 0px 0px 20px 0px; background: #fff; outline: #F34C50 1px solid; margin: 20px auto 0px;}.MYOB br{display: none}.mind{ background: #F34C50; padding: 40px; font-family: calibri; text-align: right; font-size: 10px; text-transform: uppercase; letter-spacing: 2px; color: #fff; text-shadow: #9c3033 2px 2px 0px;}.mind span{ font-weight: 900; border-bottom: 2px solid #fff;}.mind img{ float: left; border: #F34C50 5px solid; padding: 0px;}ul.business{ margin: 60px 0px 10px 30px; list-style: none; display: flex; flex-wrap: wrap;}.business li{ width: 110px; height: 110px; margin: 0px 5px 5px 0px;}.busim img{ border-radius: 100%; transform: rotate(-25deg);}.busim { border-top: #F34C50 2px solid; border-bottom: #F34C50 2px solid; border-left: #FFF 2px solid; border-right: #FFF 2px solid; border-radius: 90px; width: 90px; height: 90px; padding: 5px; transform: rotate(25deg); position: relative;}.busrel{ background: rgba(255,255,255,0.4); width: 90px; height: 90px; position: relative; top: -90px; left: 0px; border-radius: 90px; margin-bottom: -90px; display: flex; align-items: center; justify-content: center; transition: 0.5s; opacity: 0; transform: scale(0) rotate(-25deg);}.busim:hover .busrel{ transform: scale(1) rotate(-25deg); transition: 0.5s; opacity: 1;}.busrel span{ background: #fafafa; padding: 4px; font-family: calibri; font-size: 8px; text-transform: uppercase; max-width: 50px; text-align: center; position: relative;}.busrel1{ display: flex; justify-items: flex-end; background: #F34C50; width: 20px; height: 20px; padding: 5px; border-radius: 100%; color: #fff; font-size: 14px; position: relative; left: 70px; top: -30px;}.busrel1 span{ padding: 3px;}.busleg{ margin: 0 auto; width: 390px; background: #F34C50; padding: 5px; outline: #F34C50 1px solid; color: #fff; font-family: calibri; font-size: 8px; text-transform: uppercase; display: flex; justify-content: center;}.busleg1 span{ padding: 5px; border-radius: 100%; color: #F34C50; background: #fff; margin: 0px 10px;}a.HRcreds{ display: block; width: 380px; margin: 0 auto; font-size: 8px; font-family: calibri; text-align: right; color: #fff; text-decoration: none; position: relative; padding: 0px; top: -20px; z-index: 3;}.mind img{ width: 70px;}.busim img{ width: 90px;}</style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement