@charset "utf-8";
html{ height: 100%;

  overflow-y: scroll; /* Always show vertical scrollbar */
}

.highlight-img {
  outline: 2px solid #ff9800;
  box-shadow: 0 0 8px rgba(255, 152, 0, 0.6);
 /* transition: all 0.3s ease;*/
}
.selected-img {
      border: 3px solid #2563eb !important;
      box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2), 0 4px 12px rgba(0, 0, 0, 0.15) !important;
      outline: none !important;
      position: relative;
      box-sizing: border-box !important;
      display: inline-block;
      max-width: 400px;
      max-height: 400px;
    }
    
    /* Resize handles for selected images */
    .selected-img::before,
    .selected-img::after {
      content: '';
      position: absolute;
      background: #2563eb;
      border: 2px solid white;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    }
    
    /* Corner resize handles */
    .selected-img::before {
      width: 16px;
      height: 16px;
      bottom: -8px;
      right: -8px;
      border-radius: 50%;
      cursor: nwse-resize;
      z-index: 10;
    }
    
    /* Top-left corner handle */
    .selected-img::after {
      width: 16px;
      height: 16px;
      top: -8px;
      left: -8px;
      border-radius: 50%;
      cursor: nwse-resize;
      z-index: 10;
    }
.selected-row {
      border: 2px solid red;
    }
.selected-table {
  outline: 2px solid red;;
  outline-offset: -2px; /* Prevent layout shift */
  box-sizing: border-box;
  transition: outline 0.2s ease;
}

table.selected-table {
  cursor: move;
  position: relative;
}


  #infopop,#alert {
      position: fixed;
      top: 60px;
      right: 20px;
      width: 300px;
      background: #fff;
      border: 1px solid #ccc;
      border-radius: 10px;
      box-shadow: 0 4px 8px rgba(0,0,0,0.2);
      padding: 15px;
font-size:0.9em;
      display: none; /* Hidden by default */
    }

        .close-btn {
      float: right;
      cursor: pointer;
      font-size: 2em;
      color: #666;
     margin-top:-2px;
    }
    .itext{	font-weight: bold;}
  .brk{page-break-after: always;margin:0;padding:0;height:0;}
#hidelg{
width:500px;
border-radius:20px;
  background-color: white;
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 11;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#error{width:90%;height:1em;margin-left:auto;margin-right:auto;text-align: center;
color:red;font-size:1em;}
#inbut{
  background-color: #38b1fb;
   width: 250px;
  margin-right:auto;
  margin-left:auto;
padding:3px;
margin-top:20px;
margin-bottom:20px;
  color: #ffffff;
  text-align: center;
  border: 1px solid #38b1fb;
  border-radius: 15px;
  font-size: 1.1em;
  cursor: pointer;
  box-shadow:2px 2px 4px #CFCFCF;
  transition: all 0.5s; /* add this line */
  display:block;
}
#all{width:40%;display:flex;flex-direction: column; justify-content:center;align-items: center;margin-top:22px;}
#inbut:hover{
  background-color: #ffffff;color:#38b1fb
}
form{
margin-top:5px;width:90%;
margin-left:auto;
margin-right:auto;
}
label{font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 400;
	font-size:1.1em;
	margin-top:10px;
	margin-bottom:10px;
	}
input[type=text], input[type=password] {
	background:transparent;
  width: 90%;
  padding: 12px 30px;
  margin-left:5%;
  display: inline-block;
    box-sizing: border-box;
	border-radius:8px;
	margin-bottom:5px;
	font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 200;
	font-size:1em;
	color:#000000;
	border:2px solid #e5e7eb;

}

input[type="password"]:focus{
    outline:0;
    }


input::placeholder {
  	font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 350;
	font-size:1em;
	color:#000000;
	opacity:40%;
}

body {
  background: rgb(218,218,218);
	font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 110, "wght" 350;
 height: auto;
display:flex;
align-items: flex-start;
  visibility: hidden;}

#sd{width:100%;
display:flex;
justify-content: flex-end;
margin:0;
padding:0;
padding-right:5%;}

#sd a{display:block;
		font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 110, "wght" 350;
font-size:1em;
border-radius:15px;
background:#754096;
color:#ffffff;
padding:5px;
margin-top:10px;
text-decoration:none;
}

#sd a:hover{
background:#ffffff;
color:#004072;
transition:0.3s ease;
box-shadow:2px 2px 4px #cfcfcf;}
page {

  background: #ffffff;
  display: block;
  margin: 0 auto;
  padding:0;
  box-shadow: 0 0 0.5cm rgba(0,0,0,0.5);
margin-top:70px;


}

page[size="A4"] {
  width: 29.7cm;
  height: 21cm;
}
page[size="A4"][layout="landscape"] {
  width: 29.7cm;
  height: 21cm;
   max-width: 100vw;
  max-height: 100vh;
  object-fit: contain;


}

#title,#titlea{font-size:1.8em;
  		  padding-left:0px;
		  margin-left:10px;
font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 200;
    padding-top:0px;
margin-top:0;
display:block;
padding-top:2px;

}
/** Setting margins */
.title {
    display: inline-flex;
			padding-left:15px;
	padding-right:15px;
	margin-top:0px;
		align-items: center;
	justify-content: flex-start;
    height: 1.8cm;
    margin-top:5px;
	gap: 12px;

}
p{margin:0;padding:0;}
.title img{
   height:40px;
	width:40px;
	display:inline-flex;
	margin-left:20px;
  align-self: center;
  margin-right: 12px;
}
.aim{width:80px;height:auto;}

.title h2{font-size:1.7em;
  		  padding-left:0px;
font-family: 'Roboto', sans-serif;
font-style: normal;
font-weight: 400;

   display:inline-flex;
   justify-content:center;
	margin-right:300px;
	margin-left:auto;

}
#hding,#hdinga{font-size:2em;
 font-family: 'Roboto', sans-serif;
font-style: normal;
font-weight: 600;
margin-left:30px;
letter-spacing: -0.5px;}

#hding strong, #hdinga strong {
    font-weight: 600;
}
#name{font-size:1.4em;
  		  padding-left:50px;
		 font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 180;
    padding-top:0px;
   display:inline-flex;
}
#tans{font-size:1.4em;
  		  padding-left:50px;
		 font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 180;
    padding-top:0px;
   display:inline-flex;
   color:red;}
#answers{font-size:1.4em;
  		  padding-left:0px;
		color:red;
font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 110, "wght" 200;
    margin-top:25px;
   display:inline-flex;
	margin-left:auto;
	margin-right:35px;
  justify-content: flex-end;

}

h5{font-size:1em;
  		 font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 110, "wght" 600;
    margin-top:2px;


}


    * {
        box-sizing: border-box;
      }
/* Style the Image Used to Trigger the Modal */
.grid-container {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
	  grid-template-rows:1fr 1fr;
	height:17.3cm;
max-height:17.3cm;
margin-left:auto;
	margin-right:auto;
	margin-top:5px;
	width:95%;
 /*border-width:thin;
border-color:#808080;
border-style: solid;
	border-radius:20px; */
	padding:0;

}

.grid-item {
      border-width:thin;
	border-color:#808080;
border-style: solid;
overflow: visible;
padding: 8px;
box-sizing: border-box;
min-width: 0;
	}

.grid-item .row{
   	height:96%;}



/* grid */


.qim{height:100px;
width:auto;}


#ga1,#ga2,#ga3,#ga4,#ga5,#ga6,#ga7,#ga8,#ga9,#ga10,#ga11,#ga12,#ga13,#ga14,#ga15,#ga16,#ga17,#ga18,#ga19,#ga20{display:flex;
flex-direction: column;
height:100%;}

 .page-main{
  display: flex;
  flex-direction: column;
	 align-content: center;
	 margin:0;
	 padding:0;
	 width:100%;
	 margin-left:auto;
	 margin-right:auto;

}
#anspage{display:none;}
.row{

padding:0;
	margin:0;
	margin-bottom:5px;
}

    .bot{
	display:inline-flex;
		width:100%;
		padding-top:2px;
		text-align:center;
		justify-content:flex-end;
		padding-bottom:0;

}

 h3{width:33.3%;
	font-family: acumin-variable, sans-serif;
font-style: normal;
font-weight:normal;
	font-size:11px;
	text-align: center;

}

.question,.questiona{
width:97%;
margin-left:2%;
margin-right:auto;
height:100%;
min-width: 0;
max-width: 100%;
box-sizing: border-box;

}

.grid-item > .question{
  max-height: 100%;
}
  .grid-item > .questiona{
  max-height: 100%;
}



[id^="qq"],[id^="aq"] {
    color: #000000;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    font-size: 16px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    margin-left: 0;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
    text-indent: -1.1em;
    padding-left: 1.1em;
    border:none !important;
    cursor:pointer;
    line-height: 1.5;
    overflow-wrap: anywhere;
    word-wrap: break-word;
}

/* f156e: discrete data list must wrap inside wsheet grid cells (wsheet does not load tarsia2.css) */
[id^="qq"] .t2-wp2-richq--f156e,
[id^="aq"] .t2-wp2-richq--f156e {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

[id^="qq"] .t2-wp2-richq--f156e .t2-wp2-richq-top,
[id^="aq"] .t2-wp2-richq--f156e .t2-wp2-richq-top,
[id^="qq"] .t2-wp2-richq--f156e .t2-wp2-stem,
[id^="aq"] .t2-wp2-richq--f156e .t2-wp2-stem {
  display: block;
}

[id^="qq"] .t2-wp2-f156e-data,
[id^="aq"] .t2-wp2-f156e-data {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0.35em 0;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
  word-wrap: break-word;
}

[id^="qn"]{
font-size:12px;
padding-left:4px;
padding-top:5px;
}

[id^="aa"] {
color:red;
font-size:20px;
font-family: 'Open Sans', sans-serif;
font-weight: 600;
text-align: right;
padding:1px 12px 0 4px;
display:inline-block;
bottom:3px;
right:4px;
left:auto;
position:absolute;
width:auto;
max-width:100%;
background:#ffffff;
z-index:10070;
box-sizing:border-box;
white-space:normal;
overflow-wrap:anywhere;
word-break:break-word;
-webkit-print-color-adjust:exact;
print-color-adjust:exact;
}

/* Answer sheet: mark-scheme text above duplicated stem diagrams (e.g. f149e / f2201) */
#grd1 [id^="aa"] {
  z-index: 10070 !important;
  background:#ffffff;
}




h2{font-size: 1.2em;

	font-weight:500;
	  display:inline-block;

	text-align:left;

	color:#000000;

}

.container {display:flex;
flex-direction: column;
height:100%;}

#popupForm1 button,#popupForm2 button{
	margin-top:30px;
background: #007bff;
color: #fff;
border-radius: 8px;
box-shadow: 5px 5px 5px #eee;
text-shadow: none;
	padding:10px;
}
 #popupForm1 button:hover,#popupForm2 button:hover  {
background: #cccccc;
color: #fff;
border-radius: 20px;
box-shadow: 5px 5px 5px #eee;
text-shadow: none;
}

#popupForm1 button:active,#popupForm2 button:active  {
background: #ffffff;
color: #000000;
border: 1px solid #eee;
border-radius: 20px;
box-shadow: 5px 5px 5px #eee;
text-shadow: none;
}

#popupForm1 h2{color:#000000;
 font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 200;
font-size:0.9em;
width:100%;text-align: center;}


#popupForm1,#popupForm2{
top:50px;
    position: absolute;
    float:right;
right:5vw;
    min-height:150px;
    width:350px;
    background:#ffffff;
    border:0.5px solid #D8D8D8;
    border-radius:20px;
    box-shadow:1px 1px 1px 1px #D8D8D8;
      display: none;
     padding:20px;
   font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 200;
font-size: 0.9em;
color:#000000;
text-align: center;
z-index: 1000;}

#popupForm1 .closebtn,#popupForm2 .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 24px;
	color:#000000;
}

#popupForm1 .closebtn:hover,#popupForm2 .closebtn:hover {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 24px;
	color:#EFEFF0;
	font-weight:600;
	text-shadow: 2px 2px 1px #ffffff;

}
#popupForm1 h1{
font-size:1em;
color:red;
font-family: acumin-variable, sans-serif;
font-style: normal;
font-variation-settings: "slnt" 0, "wdth" 100, "wght" 400;
text-align: center;
width:100%;

}
.main-contentm {
 /* Ensures it takes up remaining space */
  padding: 20px;
  padding-top:0;
  margin-top:0;
    margin-left:auto;margin-right:auto;

height:auto;
  width: 100%;
max-width: 29.7cm;
margin-left:auto;margin-right:auto;
}

#hding.selected-text,#qq1.selected-text,#qq2.selected-text,#qq3.selected-text,#qq4.selected-text,#qq5.selected-text,#qq6.selected-text,#qq7.selected-text,#qq8.selected-text,#qq9.selected-text,#qq10.selected-text,#qq11.selected-text,#qq12.selected-text,#qq13.selected-text,#qq14.selected-text,#qq15.selected-text,#qq16.selected-text,#qq17.selected-text,#qq18.selected-text,#qq19.selected-text,#qq20.selected-text {
      color: red;
    }

/*.containerm{
  display: flex;
flex-direction: row;
       width:100vw;
    justify-content:center;
    align-items:flex-start;
    box-sizing:content-box;
max-height:calc(100vh - 80px)
}




*/


[class^="imgr"] {
  min-width: 100px;
  position: absolute;
  cursor: grab;
  margin: 0;
  margin-top: 0 !important;
  padding: 0;
  z-index: 100;
  transition: transform 0.1s ease, box-shadow 0.2s ease;
  user-select: none;
  box-sizing: border-box;
}

[class^="imgr"]:hover:not(.selected-img) {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  transform: scale(1.02);
}

.question,.questiona{
  position:relative;
  overflow: visible;
}

/* Answer text #aa is z-index 10001 (10060 on #grd1); diagrams at 10050 for drag on question page */
#grd1 .questiona img[class*="imgr"],
#grd1 .questiona img[id^="imgr"],
#grd1 .questiona img[id^="imgid"],
#grd1 .questiona img[class*="imgrida"] {
  z-index: 10050 !important;
  pointer-events: auto;
}

[class^="imgr"].dragging {
 cursor: grabbing !important;
  opacity: 0.9;
  transform: scale(1.05);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  z-index: 500 !important;
}
@media (max-width: 1100px) {


}
@media (max-width: 910px) {


}

@media print {
  html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    zoom: 100%; /* Ensures scaling stays at 100% */
  }

  /* Optional: Force page size to A4 or US Letter */
.header{display:none !important;}
#info-btn{display:none;}

  /* Optional: Prevent overflow or layout bleed */
  * {
    box-sizing: border-box;
  }

@page {size: landscape;
	margin: 0mm 0mm 0mm 0mm;
  width: 29.7cm;
  height: 21cm; }
 page{box-shadow:none;
padding-top:0px;
	 margin-top:0px;
	 margin-left:auto;
	 margin-right:auto;
   height:21cm;
   width: 29.7cm;
   margin-left:auto;margin-right:auto;
}
.page-main {  height:21cm !important;
   width: 29.7cm !important;}

    #popupForm1{display:none;}
     #popupForm2{display:none;}

	.main-contentm {
 /* Ensures it takes up remaining space */
  padding: 0px;
margin:0;

}
#header,#headers{display:none;}
.containerm{
  padding: 0px;
margin:0;
}

/* Reset question number margin in print to prevent shifting */
[id^="qq"],[id^="aq"] {
  margin-left: 0 !important;
}

/* Ensure questions are properly positioned in print */
.question,.questiona {
  margin-left: 2% !important;
}
}