margins

carddeck1/cards.html

@@ -18,18 +18,18 @@
     
 
     <div class="card">
-        <h2>RESISTANCE</h2>
+        <h2>REACH OUT AND TOUCH ME</h2>
         <p class = 'image'><img src='./images/resistance.png'></p>
         <p class = 'text'></p>
     </div>
     
     <div class="card">
-        <h2>IDENTIFY ME</h2>
+        <h2>THE HUMA</h2>
         <p class = 'image'><img src='./images/identify.png'></p>
         <p class = 'text'></p>
     </div>
     <div class="card">
-        <h2>DARLING, DARLING</h2>
+        <h2>THE ASHIK</h2>
         <p class = 'image'><img src='./images/darling.png'></p>
         <p class = 'text'></p>
     </div>
@@ -67,6 +67,8 @@
         <p class = 'image'><img src='./images/heretics.png'></p>
         <p class = 'text'></p>
     </div>
+    <br>
+    <br>
 
 
 
@@ -74,7 +76,7 @@
     <div class="card">
         <h2></h2> 
               
-        <p class = 'text'>Where somebody could find the witch in here?</p>
+        <p class = 'text'>Where would the witch be in here?</p>
     </div>
     
 
@@ -85,30 +87,99 @@
     
     <div class="card">
         <h2></h2>        
-        <p class = 'text'>What kind of tools/weapons would a witch use here?</p>
+        <p class = 'text'>What kind of weapons/creatures would a witch use here?</p>
     </div>
+
     <div class="card">
         <h2></h2>        
-        <p class = 'text'>Who would be witch's frineds here?</p>
+        <p class = 'text'>What would a witch destroy here?</p>
+    </div>
+
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'>Describe a witch's ritual here?</p>
+    </div>
+    
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'>What would a witch's shelter look like here?</p>
+    </div>
+    
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'>If you had a witch friend, what would you do together in here?</p>
     </div>
+
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'>Think of a background song that would fit in this place / what is the song about or what are the lyrics?</p>
+    </div>
+    
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'>What would a witch dream about in her sleep here?</p>
+    </div>
+    
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'>What is the first thing a witch would explore in here?</p>
+    </div>
+    
+
+    <div class="card">
+        <h2></h2> 
+              
+        <p class = 'text'></p>
+    </div>
+    
+
     <div class="card">
         <h2></h2>        
-        <p class = 'text'>What the witch would destroy here?</p>
+        <p class = 'text'></p>
+    </div>
+    
+    <div class="card">
+        <h2></h2>        
+        <p class = 'text'></p>
     </div>
 
+    <div class="card">
+        <h2></h2>        
+        <p class = 'text'></p>
+    </div>
+
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'></p>
+    </div>
+    
     <div class="card">
         <h2></h2>
-        <p class = 'text'>Can you describe a witch's ritual here?</p>
+        <p class = 'text'></p>
     </div>
     
     <div class="card">
         <h2></h2>
-        <p class = 'text'>What would be a witch's shelter here?</p>
+        <p class = 'text'></p>
+    </div>
+
+    <div class="card">
+        <h2></h2>
+        <p class = 'text'></p>
     </div>
     
     <div class="card">
         <h2></h2>
-        <p class = 'text'>What would you do with your witch friend here?</p>
+        <p class = 'text'></p>
+    </div>
+    
+    <div class="card">
+        <h2>DICE CODING FOR BRAVE PLAYERS</h2>
+        <p class = 'que'>
+            WHITE<br>  write a sentence<br><br>
+            BLUE<br> write a haiku poem<br><br>
+            ORANGE<br> draw<br><br>
+            GREEN<br> write a word</p>
     </div>
     
     

carddeck1/cards.json

@@ -25,7 +25,7 @@
 		"image": "monitors.png"
 	},
 	{
-		"name" : "RESISTANCE",
+		"name" : "REACH OUT AND TOUCH ME",
 		"text" : "",
 		"image": "resistance.png"
 	},
@@ -35,12 +35,12 @@
 		"image": "SHAHMARAN.png"
 	},
 	{
-		"name" : "IDENTIFY ME",
+		"name" : "THE HUMA",
 		"text" : "",
 		"image": "identify.png"
 	},
 	{
-		"name" : "DARLING, DARLING",
+		"name" : "THE ASHIK",
 		"text" : "",
 		"image": "darling.png"
 	},

carddeck1/stylesheet.css

@@ -7,17 +7,20 @@ body {
     font-family: Consolation;
     text-transform: uppercase;
     letter-spacing: 1.5;
+    padding: 0,5cm;
+    margin-top: 3mm;
+    margin-left: 1cm;
 }
 .card
 {
     width: 7.5cm;
     height: 11.5cm;
-    border: solid 3px black;
+    border: solid 0.3px black;
     border-radius: 0.5cm;
     float: left;
     position: relative;
-    margin: 1mm;
-    break-inside: avoid;
+    margin: 2mm;
+    page-break-inside: avoid;
 }
 .card > p.image > img {
    width: 7.5cm;
@@ -26,7 +29,8 @@ body {
    top: 10mm; 
    border-radius: 10px;
    z-index: -1;
-   display: none;
+   break-inside: avoid;
+   /* display: none; */
 }
 .card > h2{
     top: 5mm;
@@ -36,7 +40,11 @@ body {
     padding-top: 3mm;
     font-size: 13px;
     font-family:monospace;
-    display: none;
+    font-family: Consolation;
+    text-transform: uppercase;
+    letter-spacing: 1.5;
+    break-inside: avoid;
+    /* display: none; */
 }
 .card > p.text {
     width: 50mm;
@@ -46,7 +54,8 @@ body {
     left: 10mm;
     text-align: center; 
     margin: 0;
-    display: none;
+    break-inside: avoid;
+    /* display: none; */
  }
  .card > p.textnoimage {
     width: 60mm;
@@ -57,5 +66,27 @@ body {
     right: 5mm;
     text-align: center;
     font-size: 6.5;
-    display: none; 
+    font-family: Consolation;
+    text-transform: uppercase;
+    letter-spacing: 1.5;
+ 
+    /* display: none;  */
+ }
+
+ .card > p.que {
+    width: 50mm;
+    height: 50mm;
+    position: absolute;
+    top: 20mm;
+    left: 10mm;
+    text-align: left; 
+
  }
+
+ @page {
+    size: auto;
+    margin-top: 10mm;
+    margin-left: 5mm;
+    margin-right: 5mm;
+    
+     }