/* BASIC STYLINGS
============================================================================= */
/* body { 
	padding-top:20px; 
	color:#333; 
	font-family: "Lato","Helvetica Neue",Helvetica,Arial,sans-serif !important; 
} */

/* pre                             { margin-bottom:20px; } */

.questionnaire-section h3, .questionnaire-section h4, .questionnaire-section h5 {
	font-weight: bold !important;
}

/* form styling */
#checklist-form-container                { background:#FFF; margin-bottom:20px;
	border-radius:5px; }
#checklist-form-container h1               { text-align: center;}
	
#checklist-form-container .page-header   { background:#a81010; margin:0; padding:20px; 
    border-top-left-radius:5px; border-top-right-radius:5px; }

/* numbered buttons */
#checklist-status-buttons                 {  }
#checklist-status-buttons a               { color:#FFF; display:inline-block; font-size:12px; margin-right:10px; margin-bottom: 3px; text-align:center; text-transform:uppercase; padding:5px; }
#checklist-status-buttons a:hover         { text-decoration:none; }
/*#checklist-status-buttons span            { background:#080808; display:block; height:30px; margin:0 auto 10px; padding-top:5px; width:30px; 
    border-radius:50%; }*/

.iso-navigation-button{
	background-image: none !important;
	text-shadow: none !important;
	/* background-color: transparent !important; */
}

.iso-submit-confirmation {
	text-align: left;
	width: 600px;
}

.checklist-form-control        {
	border-bottom-style: dotted;
	border-radius: 0px;
	border-bottom-width: 1px;
	/* border-bottom-color: #c8c8c8 !important; */
	padding-bottom: 0px;
	margin-bottom: 10px;
}

.checklist-form-group input[type="text"] {
	background-color: white !important;
}

.questionnaire-section-question-field {
	background-color: white !important;
}

.checklist-form-group {
	margin-bottom: 25px !important;
}
.checklist-question-label {
	/* font-size: 15px !important; */
	margin-bottom: 10px !important;
}
.checklist-question-item {
	margin-bottom: 10px !important;
}
.checklist-question-item-indent {
	padding-left: 20px;
}
.checklist-form-group.flag-required .checklist-question-label:after {
	content:" *";
	color:red;
}

.checklist-alert {
	padding: 5px 15px 5px 15px;
	margin-top: 5px;
	margin-bottom: 5px;
	border: 1px solid transparent;
	border-radius: 4px;
}

.checklist-alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.checklist-alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.checklist-alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.checklist-alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

/* active buttons */
#checklist-status-buttons a.active   { background:#2f2f2f; }

.checklist-btn-primary{
	background-color: rgb(140, 47, 47) !important;
	border-color: rgba(140, 47, 47, 0.9);
	color: white;
	padding: 20px 15px;
}

.checklist-btn-primary:hover{
	background-color: #428bca !important;
}

.checklist-btn-info			{
	background-color: transparent !important;
	border-color: transparent !important;
	color: #000;
}
.iso-navigation-button:hover			{
	background-color: #2f2f2f !important;
	color: #FFF !important;
	/* border-color: #AD8A34 !important; */
}

.questionnaire-section {
	margin-bottom: 20px;
} 

.questionnaire-section-clause {
	margin: 10px 0px 30px;
}

.questionnaire-section-clause-1 {
	margin-bottom: 30px;
	font-weight: bold !important;
	font-size: 18px;
	margin-bottom: 10px;
}

.questionnaire-section-clause-2 {
	margin-bottom: 30px;
	font-weight: bold !important;
	font-size: 16px;
	margin-bottom: 10px;
}

.questionnaire-section-clause-3 {
	margin-bottom: 30px;
	font-weight: bold !important;
	font-size: 14px;
	margin-bottom: 10px;
}

.questionnaire-section-clause-4 {
	margin-bottom: 30px;
	font-weight: bold !important;
	font-size: 12px;
	margin-bottom: 10px;
}

.questionnaire-section-question {
	margin-bottom: 25px;
}

.questionnaire-section-question-left {

}

.questionnaire-section-question-right {
}

.questionnaire-section-question-auditevidence-label {
	/*padding-left: 15px;*/
	margin-bottom: 0px;
	font-size: 14px !important;
}

.questionnaire-section-question-field {
	padding-top: 0px;
	height: 40px;
}

select:invalid {
	color: gray;
}

option {
	color: black;
}

#assessmentDate:invalid {
	color: gray;
}
/* ANIMATION STYLINGS
============================================================================= */
#isofrm { 
	position: relative;
	min-height: 300px;
	overflow: hidden;
	padding: 5px 30px 5px 30px;
}

/* basic styling for entering and leaving */
/* left and right added to ensure full width */
#form-views.ng-enter,
#form-views.ng-leave      { position:absolute; left:30px; right:30px;
    transition:0.5s all ease; -moz-transition:0.5s all ease; -webkit-transition:0.5s all ease; 
}
    
/* enter animation */
#form-views.ng-enter            { 
    -webkit-animation:slideInRight 0.5s both ease;
	-moz-animation:slideInRight 0.5s both ease;
	animation:slideInRight 0.5s both ease; 
}

/* leave animation */
#form-views.ng-leave            { 
    -webkit-animation:slideOutLeft 0.5s both ease;
	-moz-animation:slideOutLeft 0.5s both ease;
	animation:slideOutLeft 0.5s both ease;   
}

	

/* ANIMATIONS
============================================================================= */
/* slide out to the left */
@keyframes slideOutLeft {
	to 		{ transform: translateX(-200%); }
}
@-moz-keyframes slideOutLeft {	
	to 		{ -moz-transform: translateX(-200%); }
}
@-webkit-keyframes slideOutLeft {
	to 		{ -webkit-transform: translateX(-200%); }
}

/* slide in from the right */
@keyframes slideInRight {
	from 	{ transform:translateX(200%); }
	to 		{ transform: translateX(0); }
}
@-moz-keyframes slideInRight {
	from 	{ -moz-transform:translateX(200%); }
	to 		{ -moz-transform: translateX(0); }
}
@-webkit-keyframes slideInRight {
	from 	{ -webkit-transform:translateX(200%); }
	to 		{ -webkit-transform: translateX(0); }
}

/* compliance level selector */
.checklist-radio-button-box {
	width: 100%;
	max-width:250px;
	/* margin: 2rem auto; */
	background: white !important;
	border: 1px solid white !important;
	border-radius: 3px;
	text-align: left;
}

.checklist-radio-button-box input[type=radio] {
	display: none;
}

/**
 * How it should look when hovered
 */
 .checklist-radio-button-box .active-label, .checklist-radio-button-box label:focus, .checklist-radio-button-box label:hover, .checklist-radio-button-box label:active, .checklist-radio-button-box input:checked + label {
	color: #a81010;
  }
  .checklist-radio-button-box .active-label:before, .checklist-radio-button-box label:focus:before, .checklist-radio-button-box label:hover:before, .checklist-radio-button-box label:active:before, .checklist-radio-button-box input:checked + label:before {
	background: white;
	border-color: #a81010;
  }

  /**
 * Make those labels sexy
 */
 .checklist-radio-button-box label {
	font-size: 1rem;
	font-weight: bold;
	line-height: 1;
	cursor: pointer;
	display: block;
	padding: 1rem 1rem 1rem 3rem;
	position: relative;
	border-top: 1px solid rgba(0, 0, 0, .1);
	background: white;
	whitespace: no-wrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: all 0.15s ease;
	/**
	 * This is the radio fake dot basically
	 */
  }
  .checklist-radio-button-box label:first-of-type {
	border: 0;
  }
  .checklist-radio-button-box label:before {
	content: "";
	position: absolute;
	left: 1rem;
	top: 1rem;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 0.2rem solid #ccc;
  }
  /**
   * How it should look when checked
   */
   .checklist-radio-button-box input:checked + label:before {
	border-color: white;
	border: none;
	background: #a81010;
  }

.iga-progress-bar-container {
	  padding: 10px;
	  height: 40px;
  }

.checklist-progress {
	  height: 20px!important;
	  background-color: #d4d4d4!important;
  }

.checklist-progress-bar {
	background-color: #a81010!important;
}
