title: How to scale border on a div?
body: <p>I used borders to make 4 right triangles in the corners of the screen on divs. This is the link that I used to make this. <a href="http://www.howtocreate.co.uk/tutorials/css/slopes" rel="nofollow noreferrer">http://www.howtocreate.co.uk/tutorials/css/slopes</a></p>
  
  <p>How can I scale this border based on window size? For example I want each triangle to take up 33% of the width and 25% of the height of the browser.</p>
  
  <p>Would prefer if there is a solution in CSS or jQuery.</p>
  
  <p>This is the link to a simplified version of my HTML and CSS. I shrunk the triangle to make them fit (on my site the triangles are 350px by 250px, so they need to be scaled down when window is resized). <a href="https://jsfiddle.net/9L5fkohr/" rel="nofollow noreferrer">https://jsfiddle.net/9L5fkohr/</a><code>enter code here</code></p>