html - how to hide the overflow coming from my corner ribbon div? -

on line 11 of codepen (link) have following

body{overflow:hidden;} 

that last attempt hide overflow of content right side of body...

a div called ".talk" positioned absolute corner ribbon & "call action"

 .talk{height:50px; width:370px; position:absolute; right:0; top:0; transform:rotate(40deg); margin-right:-100px;}  

however

body{overflow:hidden;} 

hides lot of content below first pink icon ... how can hide ribbons overflow without affecting layout of page?

http://codepen.io/gebrutommy/pen/tlhfh?editors=0100

do change

in css remove body{overflow:hidden;}

add .text{position: relative; overflow: hidden; }

then move talk div child of text

 <div class="text">     <div class="mix-text">       <h1>gitter</h1>       <h2>where developers come talk</h2>     </div>       <div class="talk"><a href="https://gitter.im/tommygebru">let's chat</a></div>   </div> 

then add

.talk { overflow: hidden;} 

done.

here live example : http://codepen.io/mhadaily/pen/ygwpzk