/* ---- Preview / Header ---- */

 .qydynamicform-wrap {

   padding: 8px 1.2% 24px 1.2%;
   border-radius: 6px;

   background-color: var(--colorC1);
}

.dynamicform-preview {
   font-family: Roboto, "Segoe UI", "Helvetica Neue", Arial, -apple-system, system-ui, BlinkMacSystemFont, sans-serif;
   padding: 8px 1.2% 24px 1.2%;
   border-radius: 6px;
   max-width: 1000px;
   margin: auto;
   background-color: white;
}

.dynamicform-header {
   display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
   border-bottom: 4px solid rgba(153, 174, 179, 0.1);
}

.dynamicform-header .textheader {
   font-size: 32px;
   font-weight: 600; 
   text-align: center;
   background-color: white;
}


/* ---- Form ---- */

.qydynamicform-frame {
   /*margin: 0px auto;*/
   /*width: 100%;*/
   flex: 100%;
   display: flex;
   align-items: stretch;
   padding: 2px;
}

.dynamicform-row {
    display: flex;
    flex-direction: row;
    /* margin-top: 16px;*/
    /* align-items: flex-start; */
    justify-content: space-between;
}


.qydynamicform-col {
   display: flex;
   flex-direction: column;
   margin: 2px 4px;
   /*background-color: lightblue;*/
   justify-content: space-between;
}

.dynamicform.preview-row {
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    justify-content: space-between;
    border-radius: 4px;
    border-bottom: 2px solid rgba(153, 174, 179, 0.1);
    margin-bottom: 4px;
 }

 .dynamicform-column._col1 {
    width: auto;
    padding: 2px 2px 2px 2px;
 }

 .dynamicform-column._col2 {
    width: 100%;
    padding: 2px 6px 2px 6px;
 }

 .dynamicform-column._col3 {
    width: 40%;
    padding: 2px 2px 2px 2px;
}

.dynamicform-column._col1 .questionbox {
   font-weight: 600;
   font-size: 1rem;
   display: flex;
   align-items: center;
   /*border: 1px solid #7918ef;*/
}

.dynamicform-column._col3 .valuebox {
   display: flex;
	flex-direction: row;
	justify-content: center;
   
   background-color:  rgba(211, 222, 225, 0.5);
   /*border: 1px solid #7918ef;*/
}

/*not in use*/
.dynamicform-column._col3 .inputbox {
   /*border: 1px solid #7918ef;*/ 
}