/* q.css */
/*----------------------------------------------------------------------------*/

.q_left_container {
    padding-left: 20px;
    padding-right: 20px;    
    width:100% !important;
    float:left;
    clear:right;
}

.q_right_container {
    width:100%;
    float:left;
    padding-left: 20px;
    padding-right: 20px;    
}

.a_container {
    display: block;
}

.q_container {
    display: block;
}


@media screen and (max-width: 1024px) {

    .q_left_container {
        width:100% !important;
        padding-left: 8px;
        padding-right: 8px;    
        
    }
    
    .q_right_container {
        width:100%;
    }

}

.score_grid_container {
  display: grid;
  width:100%;
  grid-template-columns: auto auto auto;
  background-color: none;
  /* padding: 5px; */
  border: none;
}

.score_grid_item {
  background-color: none;
  border: 1px solid grey;
  padding: 5px;
  margin-top: auto;
}

.q_grid_container {
  display: grid;
  width:100%;
  grid-template-columns: 20px 30px auto;
  padding: 5px;
  border: none;
  margin-left: 0;  
  margin-top: 2px;
}

.q_grid_item {
    /* display: grid; */
    border: none;
    padding: 2px;
    margin-top: 2px; 

}

/******************************************************************************/
@media screen and (max-width: 1024px) {

    .q_grid_container {
      grid-template-columns: 40px 40px auto;
    }

    
}    
/******************************************************************************/
.q_radio {
    border: 0px;
    height: 1.5rem !important; 
    margin-top: 12px !important;
    transform: scale(1.7);    
}



/*******
input[type=radio]:disabled, radio[disabled], radio_button[disabled]{
  border: 1px solid #999999;
  background-color: #cccccc;
  color: #666666;
}
*******/
.ok_mark {
    color: darkgreen !important;
    text-align: right;
    font-size: 1.5rem;
    font-style:bold;
}

.ko_mark {
    color: red !important;
    text-align: right;
    font-size: 1.5rem;
    font-style:bold;
}

.q_text {
    margin-left: 20px;
    margin-right: 20px;    
    margin-top: 10px;
}

.q_number, .q_text, .a_text, .x_text {
    font-family: qtext_font, times, serif;     
    font-size: 1.5rem;
    color: black !important;
}

.score_text {
    margin-left: 0px;
    font-family: qtext_font, times, serif;    
    /* font-family: sans-serif; */
    font-size: 1.3rem;    
}

.score_title {
    font-family: sans-serif;
    font-size: 1.5rem;    
    font-weight:bold;
    text-align: left;
    color : var(--theme_color);
   margin-bottom: 1rem;    
}

.q_image {
    /* width:500px; */
    width:350px;
}

@media screen and (max-width: 1024px) {
    .q_image {
        width:90%;
    }    
}

/****** fractions ******/

fz, nz, dz, fzsmall {
    display: inline-block;
    vertical-align: middle;
    margin-left: 2px; margin-right: 2px; 
}

fz, fzsmall {
    display: inline-block;
    text-align: center;    
}
 
dz {
    border-top: 1px solid;
    display: block; /* Creates new line */
}

fzsmall > nz {
    font-size: 75%;
}

fzsmall > dz {
    font-size: 75%;
}


/******************************************************************************/
/*****************************************************************/

top_line {
    text-decoration: 1px solid black overline;
}

top_arrow_left {
    padding-top: 4px;
    display: inline-block;
    position: relative;
}

top_arrow_left:before {
position:absolute;
top:0;
left: 0; right: 0;
height:9px;
vertical-align: top;
line-height: 9px;
text-align: center;
content: "\25c4";
font-size: 0.4em;

}

top_arrow_right {
    padding-top: 4px;
    display: inline-block;
    position: relative;
}

top_arrow_right:before {
position:absolute;
top:0;
left: 0; right: 0;
height:9px;
vertical-align: top;
line-height: 9px;
text-align: center;
content: "\25ba";
font-size: 0.4em;

}


/*****************************************************************/