/** pim.css **/

.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths,
.col-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-5ths {
    width: 20%;
    float: left;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}

/* permit scroll if virtual keyboard over */
.modal-content {
	margin-bottom: 500px;
}

/*
.color-32ch {
  font-family: monospace;
  font-weight: bold;
  background: -webkit-linear-gradient(to right, rgba(0, 160, 23, 0.8) 33ch, #495057 10%);
  background:         linear-gradient(to right, rgba(0, 160, 23, 0.8) 33ch, #495057 10%);
  padding-left: 1ch;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
*/

.view_main_modal_reorderdest .modal-body {
	background-color: #eee;
}

.view_main_modal_reorderdest .modal-body .thumbnail {
	background-color: #fff;
}

.view_main_modal_reorderdest .modal-body .thumbnail.trait-canon-0 {
    background-color: #ccc;
}

.view_main_modal_reorderdest .thumbnail-sortable .thumbnail img {
	cursor: grab;
	margin: 0;
}

.view_main_modal_reorderdest .thumbnail-sortable .thumbnail p {
	min-height: 44px;
}

.view_main_modal_reorderdest .thumbnail-sortable .thumbnail h4 {
	cursor: crosshair;
	margin: 0;
}
.view_main_modal_reorderdest .thumbnail-selectable .selected { 
	background-color: #333; 
	color: #fff; 
}
.view_main_modal_reorderdest .thumbnail-selectable .disabled { 
	background-color: #999;
}

.view_main_modal_reorderdest a.remove-prod {
	float: right;
}
.view_main_modal_reorderdest div.removable div.thumbnail {
	background-color: #f88;
}

table.table img.thumb_small {
	max-width: 64px;
}

body.wait *, body.wait {
    cursor: progress !important;
}

@media (max-height: 480px) {
	.navbar-collapse.collapse.show {
	  max-height: 450px;
	  overflow-y: auto;
	}
}
@media (max-height: 450px) {
	.navbar-collapse.collapse.show {
	  max-height: 420px;
	  overflow-y: auto;
	}
}
@media (max-height: 430px) {
	.navbar-collapse.collapse.show {
	  max-height: 400px;
	  overflow-y: auto;
	}
}
@media (max-height: 400px) {
	.navbar-collapse.collapse.show {
	  max-height: 370px;
	  overflow-y: auto;
	}
}
@media (max-height: 380px) {
	.navbar-collapse.collapse.show {
	  max-height: 350px;
	  overflow-y: auto;
	}
}
@media (max-height: 360px) {
	.navbar-collapse.collapse.show {
	  max-height: 330px;
	  overflow-y: auto;
	}
}
@media (max-height: 330px) {
	.navbar-collapse.collapse.show {
	  max-height: 300px;
	  overflow-y: auto;
	}
}


#toTopBtn {
	display: none;
	position: fixed;
	bottom: 50px;
	right: 0px;
	z-index: 98;
	padding: 10px;
	font-weight: bold;
	text-decoration: none;
	border: #999 1px dotted;
	cursor: pointer;
	background-color: #ffffff77;
}
#toBotBtn {
	display: inline;
	position: fixed;
	bottom: 2px;
	right: 0px;
	z-index: 98;
	padding: 10px;
	font-weight: bold;
	text-decoration: none;
	border: #999 1px dotted;
	cursor: pointer;
	background-color: #ffffff77;
}

@media (max-width: 768px) {
	#toTopBtn, #toBotBtn {
       padding: 5px 2px;
    }
}



/** /pim.css **/