/* -------------------------- *\
   -- Dimensions - Do not use both width property and padding/border in the same block for IE to display the site properly
\* -------------------------- */
/* General tag-stylings*/
html, body { border: 0px; padding: 0px; margin: 0px; }
body { padding-top: 10px; padding-bottom: 0px; text-align: center;}
table, tr, td, th { padding: 0px; margin: 0px; border-collapse: collapse; border-spacing: 0px; }
th { text-align: left; vertical-align: middle; }
textarea, input, select, option { padding: 0.25em  }
input { margin: 0px;}
@media only screen and (min-width : 1px) {
	/* Only apply max-width on browsers supporting media queries (not IE7 and lower) */
	textarea, input[type=text], select  { max-width: 100%;  }
	.openAnswerInside table { width: 100% }
}

img, video, audio, iframe, object, embed  { height: auto;max-width: 100%; }

h1, h2, h3, h4, h5, h6, p, ul { margin: 0px; padding: 0px; }

/* Form containers */
#outerContainer {  width: auto;  margin: 0px auto 20px; clear: both;}
#widthContainer, .lastMiddle { max-width: 972px; width: 100%; margin: 0px auto;} /* This is the width of the actual form, excluding border/padding/margin */
#borderPaddingContainer { margin: 0px 2%; padding: 6% 6% 3%; border-width: 0px; text-align: left; 
-webkit-box-shadow: 0px 2px 20px rgba(50, 50, 50, 0.3);
-moz-box-shadow:    0px 2px 20px rgba(50, 50, 50, 0.3);
box-shadow:         0px 2px 20px rgba(50, 50, 50, 0.3);
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
}
#borderPaddingContainerTop, #borderPaddingContainerBottom, #borderPaddingContainer { clear: both; }
 
.topLeft { }
.topRight, .middle { vertical-align: top; }
.lastMiddle, .lastRight, .lastLeft { vertical-align: bottom; }
.bottomLeft { vertical-align: bottom; }
.bottomRight { vertical-align: bottom; }
.topLeft, .topRight, .lastRow, .bottomLeft, .bottomRight { border: 0px solid white; }
#firstRow {margin-bottom: 15px: height: 37px; line-height: 37px; text-align: center;  }
#firstRow.withLogo { float: right; width: auto; margin: 0px 30px; }
#firstRow { display: none }
#supplierLogo { margin: 0px 1em 1.8em 4.7%; float: left;}
#rightLogo { margin: 0px 4.7% 1.8em 1em; float: right;}
#lastRow { clear: both; height: auto; padding: 0px; margin-top: 0px; }
#endRow, #thirdRow { clear: both; }
#verktygsnamn, #projectTitle { text-align: middle; }
#clientLogo { text-align: right; }
#clientLogo img { margin-bottom: 20px; }
#sidnummer, #progressIndicator { text-align: right; vertical-align: botttom; white-space: nowrap; }


/* Form-Item classes for all types of items*/
.tableFormat1, .tableErrorMessage { display: block;  padding-top: 10px; margin: 0px 5% 4% } /* Contains an entire item */
.cellQuestionBody  { clear: both; }
.noBackground { padding-top: 0px; }
.TwoColumnLayout .tableFormat1 { width: 43%; margin-right: 5%; float: left;} /* Divides the content into two columns */
.cellQuestionText1 { display: block; width: 100%;  } /* Contains textQHead*/
.textQHead { display: block; width: 100%; padding: 5px 0 15px} /* Span which contains the item header text*/
.cellQuestionText2 { padding-bottom: 0.4em; width: 100%; } /* Comment fields */
.textSubQText { display: inline-block; width: auto; } /* Question text within  item*/
.textSubQText.title { display: block; }
.textSubQText img,
.textQAnsweralternative img { vertical-align: middle } /* Vertically centered images in grids and AA-s */
.tableErrorMessage, .itemErrorText { padding: 1em; clear: both; text-align: center; margin-top: 0.5em; margin-bottom: 0.5em; }
.itemErrorText, .itemErrorMessage {margin-top: 1em; }
.tableErrorMessage.itemErrorMessage { margin-left: 0px; margin-right: 0px; }
.mediaBox { float: right; margin-bottom: 1em; margin-left: 1em; } /* Used as a container for media */
video, audio, .VIDEO, .AUDIO { margin: auto; }
img, video, audio, .VIDEO, .AUDIO , iframe{ max-width: 100%; height: auto }
.touchVersion video, .touchVersion audio { width: 100%; height: auto;}
.touchVersion img { max-width: 100%; height: auto; }
.cellSurrounding { clear: both; height: 1px; max-height: 1px; visibility: hidden; }


/* Classes for grid type question */
.tableFormatMatrix { width: 100%; margin-top:5px; } /* A grid question */
.tableFormatMatrix table { width: 100%; } /* Grid item header */
.tableFormatMatrix td { padding: 9px 7px; } /* A grid row/cell */
.tableFormatMatrixHeader td, .tableFormatMatrix th { padding: 0px 7px; } /* A grid row/cell */
table.vcTable { clear: both; width: 100%; }
.cellMatrixAnsweralternatives { text-align: center; } /* Grid item answeralternatives */
.cellSubquestionLeft { width: 100%; }
.tableFormatMatrix th.scaleHeaderContainer { padding: 0px;}
.cellMatrixAnsweralternativesHeaderLeft { text-align: left; }
.cellMatrixAnsweralternativesHeaderRight { text-align: right; }
span.cellMatrixAnsweralternativesHeaderLeft { float: left; }
span.cellMatrixAnsweralternativesHeaderRight { float: right; }
.vcCellMatrixalternatives .realInput,
.cellMatrixAnsweralternatives .realInput { margin: auto; }
.tableFormatMatrix .legendSymbol { display: none; }
.verticalMatrix .cellSubquestionLeft { text-align: left; }
.spanningGridText { display: none } /* Grid text above AA:s only used in thinner layouts*/
.simpleQuestionGridHeader { display: block;  }
.simpleQuestionGridItem { margin-bottom: 4%; }
.simpleQuestionGridItem .commentText { margin-top: 0.75em; }



/*.userInputTextCell { width:  100%; }*/

/* Non-grid type question*/
.simpleTextInputColumn { width: 100%; text-align: right;}
.simpleTextColumn { width: 100%; text-align: left;}
td.cellAnsweralternatives { padding: 0.5em 0.1em 0.5em 0.3em; }

.cellAnsweralternatives th { padding-right: 4px; }
.openAnswerAlternative { float: right; margin-left: 0.25em; }

.activeConnection { display: inline }
.passiveConnection { display: none !important; }

/* Other classes*/
.sumRow td { border-top-style: double; border-top-width: 6px; }
.sumDisplayer { float: right; padding: 0.2em 0.5em }

.multipleColumns { width: 100%; }
.inactiveErrorText { display: none; }
#fontsizeChanger { display: none;}
.itemImage { float: right; max-width: 100%; }
.providerLogo, .providerText { text-align: center;}
.horizontalButtons  { margin-top: 0.5em }
.gridButtonRow { margin-top: 0em; text-align: right; }
.gridbuttons .cellSubquestionLeft { width: auto; }

.tableFormatMatrix .header, .header { padding-top: 1.5em; padding-bottom: 0.25em }

.reference, .hiddenItem, .hidden { display: none !important; }
.hidden { height: 0px !important; opacity: 0 !important; }
.TestDialog .reference, .XQTESTRESP .reference, .showClientIds .clientid { display: inline-block !important; margin-right: 0.25em }

.cellQuestionText2 ol  {margin:0.5em ; padding:0; }
.cellQuestionText2 li {margin:0.5em 1.5em; padding:0; }

#borderPaddingContainer { }
#formFooter { text-align: center; }

.slider .cellMatrixAnsweralternatives { min-width: 30px; } 
.slider .bigGrid .cellMatrixAnsweralternatives { min-width: 20px; }
.slider .extraBig .cellMatrixAnsweralternatives { min-width: 12px; }

.centeredSliderHandle table .ui-slider-range { display: none }
/* -------------------------- *\
   Responsive video
\* -------------------------- */
.vimeo-container {
    position: relative;
    padding-bottom: 50.75%;
    padding-top: 30px; height: 0; overflow: hidden;
}
.vimeo-container iframe,
.vimeo-container object,
.vimeo-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* -------------------------- *\
   Custom CSS-classes
\* -------------------------- */
.commentToRight .cellSubquestionLeft { text-align: right }
.commentToRight .rightColumnText { text-align: left; white-space: nowrap; }
.slimTable .rightColumnText,
.expandCells .rightColumnText { white-space: normal; }
.shiftFirstAnswerLeft td:first-child { padding-left: 7px; padding-right: 0px;}
.shiftFirstAnswerLeft .vcTable .cellSubquestionLeft,
.shiftFirstAnswerLeft .vcTable .cbox_list1 { text-align: center; }

.centerCommentary .cellQuestionText2 { text-align: center; }
.centerCommentary .cellQuestionText2 div,
.centerCommentary .cellQuestionText2 img,
.centerCommentary .cellQuestionText2 video,
.centerCommentary .cellQuestionText2 audio { margin: auto; }
.alignRight .horizontalButtons, .alignRight .QuestionTable    { float: right; }

.slimTable .tableFormatMatrix,
.slimTable .vcTable,
.slimTable .tableFormatMatrix .cellSubquestionLeft,
.slimTable .tableFormatMatrix .cbox_list1,
.slimTable .vcTable .cellSubquestionLeft,
.slimTable .vcTable .cbox_list1 { width: auto }

.expandCells .tableFormatMatrix.cellSubquestionLeft,
.expandCells .tableFormatMatrix .cbox_list1,
.expandCells .vcTable .cellSubquestionLeft,
.expandCells .vcTable .cbox_list1 { width: auto }

.boldCommentary .cellQuestionText2,
.commentaryStyle_bold .cellQuestionText2 { font-weight: bold }
.italicCommentary .cellQuestionText2,
.commentaryStyle_italic .cellQuestionText2 { font-style: italic }

.noLine .textQHead { border-bottom-width: 0px; margin-bottom: 0px; }

.subItem  .textQHead {
	border-bottom-width: 0em;
    font-size: 1em;
    margin-bottom: 0.75em;
    line-height: 1.45em;
}

/* -------------------------- *\
   ADP-webreports
\* -------------------------- */
.google-visualization-table-table { border-collapse: separate }

/* -------------------------- *\
   Levels
\* -------------------------- */

.level1, .itemLevel3, .level4, .itemLevel4 { }

#borderPaddingContainer .itemLevel1,
#borderPaddingContainer .level1Big,
#borderPaddingContainer .level1 {  padding: 5% 10%; margin-left: 20px; margin-right: 20px; }
.level1Big .textQHead,
.level1  .textQHead,
.itemLevel1 .textQHead {  width: auto; border-bottom-width: 0px;  background-image: none;
    font-size: 3.1em;
    letter-spacing: -0.05em;
    margin-top: 0.08em;
	margin-bottom: 0.08em;
    text-transform: uppercase;
	padding-bottom: 0.2em;
}
.itemLevel1  .mediaBox,
.itemLevel1  .cellQuestionText2,
.subItem .itemLevel1 .textQHead { font-size: 1.2em; float: none; text-align: center; margin: 5% 0px 0px 0px}
.subItem .itemLevel1 .textQHead {
    letter-spacing: inherit;
    text-transform: inherit;	
}

.itemLevel1 .tableFormatMatrix,
.itemLevel1 .vcTable { text-align: center; }

.level1Big { }
.level1Big .cellQuestionText1, .level1  .cellQuestionText1,
.level1Big .cellQuestionText2, .level1  .cellQuestionText2  { float: right;  width: 45%;  margin: 2% 0px 0px 2%; clear: right;}
.level1Big .mediaBox, .level1  .mediaBox { float: left; width: 45%;  margin: 0px; }
.level1Big .mediaBox img, .level1  .mediaBox img {  margin-left:auto; margin-right:auto; display:block; max-width: 100%}
.level1Big .textQHead { font-size: 2.1em; margin-top: auto; padding-bottom: auto;  }

.itemLevel3 { float:left; width:43%; margin-left: 5%; margin-right: 0px; } /* Responsive calc: 48 * 2 = 96 */

.itemLevel4 { float:left; width:26%; margin-left: 6%; margin-right: 0px; position: relative;}  /* Responsive calc: 32* 3 = 96 */
.itemLevel4 .mediaBox img { width: 32px;}
.itemLevel4 .mediaBox { position: absolute; top:0px; left: -21px; margin: 0px; }
.itemLevel4 .textQHead { text-align: center }
.itemLevel4 .cellQuestionText2 { }
.itemLevel4 .cellQuestionText2 u,
.itemLevel4 .cellQuestionText2 i,
.itemLevel4 .cellQuestionText2 b,
.itemLevel4 .cellQuestionText2 a  { }

/* -------------------------- *\
   -- Unused item classes
\* -------------------------- */
.cellTopLeft {  }
.cellQuestionText2NoItalic {  }
.cellMatrixAnsweralternatives { }


.textFormHeader {  }
.formheadRightCol {  }
.formheadLeftCol {  }
.formheadText {  }
.textFormFooter {  }
.formfooterTable {  }
.cellSubquestionRight {  }

/*.cellAnsweralternatives input[type=text] { max-width: none; }*/