Format the Media Query rule so the copy / paste behaves in a way that…

… is usable. Copy / paste function strips the media query rules.

css/stylesheet.css

@@ -437,4 +437,8 @@ left: auto;
 color:black;
 }
 #save { color: white;
-border-color: white; }
+border-color: white; }
+
+#mq {
+	top: -16px;
+}

index.html

@@ -328,16 +328,11 @@ <h1>
 
 <div id="media_query" class="rule_wrapper">
   <pre class="rule comment">/*                           <a class="cb">[to clipboard]</a><!-- <a class="off">[toggle rule off]</a>--> <span class="endcomment">*/</span></pre>
-  <pre class="rule">
-@media screen and (max-width: 510px) {
-  #sandboxwrap {
-    position: static;
-    left: 25px;
-  }
-  #sandbox {
-    width: 100%;
-  }
-}</pre>
+  <pre class="rule" id="mq"><span class="declaration-block">
+@media all and ( max-width: <b g="0">480px</b> ) {
+  #sandboxwrap { position: static; left: 25px; }
+  #sandbox { width: 100%; }
+}</span></pre>
   <!--  <pre class="rule comment commentclose"><span class="comment">/* */</span></pre> -->
 </div>
 

javascript/javascript.js

@@ -379,10 +379,11 @@ function copypasta(){
 	    	zc.addEventListener( 'mouseDown', (function(){
 	    	    return function(client) {
 	    	      var text = elem.closest("pre")
-	    	      				 .nextAll('pre.rule').eq(0).find('.declaration-block').text();
+	    	      				 .nextAll('pre.rule').eq(0).find('.declaration-block').eq(0).text();
 	    	      text = text.replace(/ \/\*.*?\*\//g,''); // strip comments
-	    		    zc.setText( text );
-	    		    $(elem).fadeOut(50).fadeIn(300)
+	    	      text = text.replace(/ \#sandbox.*?\}/g, '') // strip declarations from mq
+	    		  zc.setText( text );
+	    		  $(elem).fadeOut(50).fadeIn(300)
 	    		}
 	    	})());
 		});