/* Kaski production control general style sheet */

html {

	margin: 0;
	width: 100%;
	height: 100%;

}

.center {

	margin-right: auto !important;
	margin-left: auto !important;
	display: block !important;

}

.vertical-align {

  position: relative;
  top: 50%;
  transform: translateY(50%);

}

.margin-top-50 {

	margin-top: 70px;

}

.error {

	color: red;

}

.success {

	color: green;

}

.column-header{

	font-weight: bold;

}

.row div{

	padding-top: 10px;
	padding-bottom: 10px;
	/* background-color: #eee;
	background-color: rgba(86,61,124,.15); */
	border: 1px solid #ddd;
	border: 1px solid rgba(86,61,124,.2);
}

.row-no-border div{

	padding-top: 10px;
	padding-bottom: 10px;
	/* background-color: #eee;
	background-color: rgba(86,61,124,.15); */
	/* border: 1px solid #ddd; */
	/* border: 1px solid rgba(86,61,124,.2); */
}

.row-hover:hover div[class*="col-md-"] {
	background-color: #eee;
}

.btn-hover:hover, .btn-hover:hover *{
	background-color: #ddd !important;
}

.pointer {
	cursor: pointer;
}

.margin-right-0 {
	margin-right: 0px;
}

.fixed-form-controls {
	position: fixed;
	margin-top: 0px;
}

.fixed-rollable > .column:first-child  {
	position: fixed;
	margin-left: 100px;
	margin-top: 20px;
}

.fixed-rollable > .column:last-child  {
	 margin-left: 40%;
}

.no-borders {
	border: none !important;
}

.margin-top-10 {
	margin-top: 10px;
}

.padding-left-15{
	padding-left: 15px;
}

.padding-right-12{
	padding-right: 12px;
}

.padding-right-0 {
	padding-right: 0px !important;
}

.padding-left-0 {
	padding-left: 0px !important;
}

.padding-bottom-15 {
	padding-bottom: 15px;
}

.nav-force-center {
	display: inline-block;
	float: none !important;
}

.highlight {
	background-color: #ddd;
}

.highlight-hover:hover {
	background-color: #ddd;
}

.highlight-ok {
	background-color: green !important;
}

.highlight-interrupt {
	background-color: red !important;
}

/* bootstrap colours */
.green-boots {
	background-color: #5cb85c !important;
}
.red-boots{
	background-color: #d9534f !important;
}
.yellow-boots{
	background-color: #ffbb33 !important;
}



.highlight-interrupt_bootstrap_color_yellow{
	background-color: #FF8800 !important;
}

.highlight-interrupt_bootstrap_color{
	background-color: #d9534f !important;
}

.highlight-danger{
	background-color: red !important;
}

.highlight-default {
	background-color: #ffffff !important;
}
.highlight-success {
	background-color: #449d44 !important;
}
.highlight-warning{
		background-color: #ffbb33 !important;

}
.highlight-lightgreen {
	background-color: lightgreen !important;
}

.highlight-yellow {
	background-color: yellow !important;
}

.error-div {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 30px;
	padding: 5px 15px;
}

@keyframes spinnerRotate
{
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}
@-webkit-keyframes spinnerRotate
{
    from{-webkit-transform:rotate(0deg);}
    to{-webkit-transform:rotate(360deg);}
}
@-moz-keyframes spinnerRotate
{
    from{-moz-transform:rotate(0deg);}
    to{-moz-transform:rotate(360deg);}
}
@-ms-keyframes spinnerRotate
{
    from{-ms-transform:rotate(0deg);}
    to{-ms-transform:rotate(360deg);}
}

.spin {
	animation-name: spinnerRotate;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	-webkit-animation-name: spinnerRotate;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spinnerRotate;
    -moz-animation-duration: 5s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spinnerRotate;
    -ms-animation-duration: 5s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
}

.progress-cursor {
	cursor: progress;
}

.padding-tb-0 {
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

.queue-popup {
	position: fixed;
	margin-top: 500px;
	border: 1px solid #ddd;
	padding: 15px;
}

.delivery-popup {
	position: fixed;
	background-color: lightgrey;
}

.confirm-popup {
	background-color: lightgrey;
	margin-top: -600px;
	border: 1px solid #ddd;
	padding: 15px;
}

.confirm-popup-palletlist {
	background-color: yellow;
	/* margin-top: -950px; */
	position: fixed;
	margin-left: 850px;
	border: 1px solid #ddd;
	padding: 15px;
}

.palletlist-popup {
	position: fixed;
	background-color: lightblue;
}

.monitoring-popup {
	position: fixed;
	background-color: yellow;
	margin-left: 550px;
	margin-top: 600px;
	border: 1px solid #ddd;
	padding: 15px;
}

.framelist-popup {
	position: fixed;
	/* background-color: yellow; */
	margin-left: 50px;
	/* margin-top: 60px; */
	border: 1px solid #ddd;
	padding: 15px;
	text-align: center;
}

.palletinfo-popup {
	position: fixed;
	background-color: yellow;
	margin-left: 500px;
	margin-top: -800px;
	border: 1px solid #ddd;
	padding: 15px;
}

.password-box {
	margin-top: 20px;
	border: 1px solid #ddd;
	padding: 15px;
}

.fixed-height-250 {
	height: 250px;
	overflow: auto;
}

.fixed-height-300 {
	height: 300px;
	overflow: auto;
}

.fixed-height-500 {
	height: 500px;
	overflow: auto;
}

.fixed-height-800 {
	height: 800px;
	overflow: auto;
}

.fixed-height-1000 {
	height: 1000px;
	overflow: auto;
}

.fixed-width-400 {
	width: 400px;
}

.fixed-width-600 {
	width: 600px;
}

.fixed-width-800 {
	width: 800px;
}

input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  transform: scale(2);
  padding: 10px;
}

.biggerRadio
{
	-ms-transform: scale(1.5); /* IE 9 */
    -webkit-transform: scale(1.5); /* Chrome, Safari, Opera */
	transform: scale(1.5);
}

.hide {
  opacity: 0;
  transition: all ease 0.8s;
}

canvas {
	width: 100%;
	/*height: auto;*/
}

.noselect {
	-webkit-touch-callout: none; /* iOS Safari */
	  -webkit-user-select: none; /* Safari */
	   -khtml-user-select: none; /* Konqueror HTML */
		 -moz-user-select: none; /* Firefox */
		  -ms-user-select: none; /* Internet Explorer/Edge */
		   -o-user-select: none;
			  user-select: none; /* Non-prefixed version, currently
									supported by Chrome and Opera */
}


.blocks .btn-oma-ISO
{
    height: 200px;
    width: 380px;
    /*padding: 80px 120px;*/
    margin: 0px;
    border-radius: 0;
    font-size: 50px ! important;
    background-color:whitesmoke;
    justify-content: center;
}
.btn-oma-ISO:hover,
.btn-oma-ISO:focus,
.btn-oma-ISO:active,
.btn-oma-ISO.active,
.open .dropdown-toggle.btn-oma-ISO {
/*  color: #ffffff; */
    color:black;
  background-color: greenyellow;
  border-color: greenyellow;
}


@media (min-width: 768px) {
.my-custom-container{
    width:600px;
}}
@media (min-width: 992px) {
.my-custom-container{
    width:720px;
    padding-left: inherit;
    padding-right: inherit;
}}
@media (min-width: 1200px) {
.my-custom-container{
    width:1150px;
    padding-left: inherit;
    padding-right: inherit;
}}
@media (min-width: 1800px) {
.my-custom-container{
    width:1750px;
        padding-left: inherit;
    padding-right: inherit;
}}

.modal-open {
    overflow: inherit;
}

.modal-header-info {
    color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #5bc0de;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
}

.modal-header-info h3 {
	color: black;
}

.modal-footer-info {
    color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #5bc0de;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
}

.modal-body-lightgrey {
	background-color: lightgrey;
}

.modal-header-danger {
    color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #d9534f;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
}

@media only screen {
	.table-wrapper-2 {
		display: block;
		max-height: 800px;
		overflow-y: auto;
		/* -ms-overflow-style: -ms-autohiding-scrollbar; */
	}
}

@media print {
	.table-wrapper-2 {
		display: block;
		width: auto;
		height: auto;
		overflow-y: visible;
		/* -ms-overflow-style: -ms-autohiding-scrollbar; */
	}
}
.table-wrapper-3 {
    display: block;
		max-height: 1500px;
    overflow-y: auto;
    /* -ms-overflow-style: -ms-autohiding-scrollbar; */
}

 table.scrolling-table th{
	background-color: #b4b4b4;
}

table.scrolling-table td{

	width: 200px;
	height: auto;
	padding-top: 1px !important;
	padding-bottom: 1px !important;
}

table.spaced-table {
	border-collapse: collapse;
}

table.spaced-table td {
	padding: 10px !important;
}

table.spaced-table td a {
    display: block;
    padding: 6px !important;
}

/** for pages that don't load angular but have angular templates in them. **/
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

@keyframes rotate360 {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@-webkit-keyframes rotate360 {
  from { -webkit-transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); }
}

.spinner {
  display:inline-block;
  border-radius: 50px;
  border-style: dotted;
  border-bottom-color: #000000;
  border-top-color: #000000;
  border-left-color: #000000;
  border-right-color: #000000;
  text-align: center;
  vertical-align: middle;
  position: relative;
  animation: rotate360 3s linear infinite;
  -webkit-animation: rotate360 3s linear infinite;

  border-width: 10px;
  width: 100px;
  height: 100px;
}

.small_spinner {
  display:inline-block;
  border-radius: 25px;
  border-style: dotted;
  border-bottom-color: #000000;
  border-top-color: #000000;
  border-left-color: #000000;
  border-right-color: #000000;
  text-align: center;
  vertical-align: middle;
  position: relative;
  animation: rotate360 3s linear infinite;
  -webkit-animation: rotate360 3s linear infinite;

  border-width: 5px;
  width: 50px;
  height: 50px;
}

.topics tr td{
	line-height: 22px;
	border: 1px solid #ddd;
	border: 1px solid rgba(86,61,124,.2);
 }

 .orange {
	background-color:orange;
 }

 .animate-show-hide.ng-hide {
   opacity: 0;
 }

 .animate-show-hide.ng-hide-add,
 .animate-show-hide.ng-hide-remove {
   transition: all linear 0.5s;
 }
.percent {
    position: absolute; width: 300px; height: 14px; z-index: 1; text-align: center; font-size: 0.8em; color: white;
}

.progress-bar {
    width: 300px; height: 14px;
    border-radius: 10px;
    border: 1px solid #CCC;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#6666cc), to(#4b4b95));
    border-image: initial;
}

.uploaded {
    padding: 0;
    height: 14px;
    border-radius: 10px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#66cc00), to(#4b9500));
    border-image: initial;
}

.nopadding {
	padding: 0 !important;
	margin: 0 !important;
 }

.padding_5 {
	padding: 5px !important;
	margin: 0 !important;
 }

 .border-bottom-black {
	 border-bottom: solid 1px black;
 }