@CHARSET "UTF-8";

/************/
/*** page ***/
/************/

body {
	font-family: Open Sans, sans-serif !important;
}

*:focus {
	outline: none !important;
}

/*****************/
/*** scrollbar ***/
/*****************/

::-webkit-scrollbar {
	width: 6px;
	height: 6px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
	border-radius: 5px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
	border-radius: 5px;
	-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
	background-color: #555;
}

/************/
/*** card ***/
/************/

.card {
	background: #FFFFFF;
	border: 1px solid #e5e5e5 !important;
	border-radius: 8px;
	transition: box-shadow 0.3s ease-in-out;
}

.card:hover {
	box-shadow: 0px 3px 6px #00000029;
}

.cardAction, .cardActionImage {
	padding: 3px;
    border-radius: 8px;
	background-color: #FFFFFF;
}

.cardAction {
	opacity: 0 !important;
}

.card:hover .cardAction, .actionTd div.dropdown a:hover .cardAction {
	opacity: 1 !important;
}

.card:hover .cardAction.cardActionDisabled, .actionTd div.dropdown a:hover .cardAction.cardActionDisabled {
	opacity: .5 !important;
    pointer-events: none;
}

/**************/
/*** button ***/
/**************/

button, input[type=button], input[type=submit], .tkmButton, .ajax-file-upload, .ajax-file-upload-cancel {
	font-weight: bold;
    cursor: pointer;
    vertical-align: middle;
    height: 40px;
    background-color: #0091dd;
    color: white;
    border: none;
    margin: .5em;
    border-radius: 8px;
    box-shadow: none;
    transition: box-shadow 0.3s ease-in-out;
}

.scdTkmBUtton {
	background-color: transparent !important;
	color: #0091dd !important;
	border: 1px solid #0091dd !important;
}

button:hover, input[type=button]:hover, input[type=submit]:hover, .tkmButton:hover, .ajax-file-upload:hover, .ajax-file-upload-cancel:hover {
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15);
}

/**************/
/*** inputs ***/
/**************/

input, select, textarea {
	border: 1px solid #EEEEEE;
	border-radius: 8px;
	padding: 8px;
	font-size: 11px !important;
	font-family: Open Sans, sans-serif !important;
	background-color: #FFFFFF;
}

textarea {
	border-radius: 10px;
	padding: 10px;
}

input[type='checkbox'], input[type='radio'] {
	vertical-align: sub;
}

/**************/
/*** toggle ***/
/**************/

.switch {
	position: relative;
	display: inline-block;
	width: 43px;
	height: 16px;
}

.switch input { 
	opacity: 0;
	width: 0;
	height: 0;
}

.switch .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #777;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 34px;
}

.switch .slider:before {
	position: absolute;
	content: "";
	height: 12px;
	width: 12px;
	left: 2px;
	bottom: 2px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 50%;
}

.switch input:checked + .slider {
	background-color: #2196F3;
}

.switch input:focus + .slider {
	box-shadow: 0 0 1px #777;
}

.switch input:checked + .slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

/****************/
/***** color ****/
/****************/

/********** blue **********/

/* light */
.bk-lg-blue { background-color: #47A8FE; }
.cl-lg-blue { color: #47A8FE; }
.bd-lg-blue { border-color: #47A8FE !important; }
/* medium */
.bk-md-blue { background-color: #0091DD; }
.cl-md-blue { color: #0091DD !important; }
.bd-md-blue { border-color: #0091DD !important; }
/* dark */
.bk-dk-blue { background-color: #006ED6; }
.cl-dk-blue { color: #006ED6; }
.bd-dk-blue { border-color: #006ED6 !important; }

/********** green **********/

/* light */
.bk-lg-green { background-color: #B7DF50; }
.cl-lg-green { color: #B7DF50; }
.bd-lg-green { border-color: #B7DF50 !important; }
/* medium */
.bk-md-green { background-color: #94DF00; }
.cl-md-green { color: #94DF00; }
.bd-md-green { border-color: #94DF00 !important; }
/* dark */
.bk-dk-green { background-color: #63A800; }
.cl-dk-green { color: #63A800; }
.bd-dk-green { border-color: #63A800 !important; }

/********** orange **********/

/* light */
.bk-lg-orange { background-color: #FF9D28; }
.cl-lg-orange { color: #FF9D28; }
.bd-lg-orange { border-color: #FF9D28 !important; }
/* medium */
.bk-md-orange { background-color: #FF8100; }
.cl-md-orange { color: #FF8100; }
.bd-md-orange { border-color: #FF8100 !important; }
/* dark */
.bk-dk-orange { background-color: #DD6400; }
.cl-dk-orange { color: #DD6400; }
.bd-dk-orange { border-color: #DD6400 !important; }

/********** violet **********/

/* light */
.bk-lg-violet { background-color: #A56FD8; }
.cl-lg-violet { color: #A56FD8; }
.bd-lg-violet { border-color: #A56FD8 !important; }
/* medium */
.bk-md-violet { background-color: #8456D3; }
.cl-md-violet { color: #8456D3; }
.bd-md-violet { border-color: #8456D3 !important; }
/* dark */
.bk-dk-violet { background-color: #5D2D92; }
.cl-dk-violet { color: #5D2D92; }
.bd-dk-violet { border-color: #5D2D92 !important; }

/********** bleuvert **********/

/* medium */
.bk-md-bleuvert { background-color: #04A197; }
.cl-md-bleuvert { color: #04A197; }
.bd-md-bleuvert { border-color: #04A197 !important; }
/* dark */
.bk-dk-bleuvert { background-color: #006E67; }
.cl-dk-bleuvert { color: #006E67; }
.bd-dk-bleuvert { border-color: #006E67 !important; }

/********** red **********/

/* light */
.bk-lg-red { background-color: #EE6053; }
.cl-lg-red { color: #EE6053; }
.bd-lg-red { border-color: #EE6053 !important; }
/* medium */
.bk-md-red { background-color: #F1340D; }
.cl-md-red { color: #F1340D; }
.bd-md-red { border-color: #F1340D !important; }

/****************/
/*** fieldset ***/
/****************/

fieldset {
    border: none; /*2px solid #EEEEEE;*/
    padding-block-start: 0.625em;
    width: 95%;
    padding: 1em 1em 1.2em;
}

legend {
    font-size: 1.2em; /*small;*/
    font-weight: bold;
}

/****************/
/* icon action **/
/****************/

.iconAction {
	width: calc(100% - 16px);
    display: inline-block;
    text-align: right;
	border-radius: 8px;
	padding: 8px;
}

.iconAction i {
    float: right;
    cursor: pointer;
    padding: 5px;
    margin: 0 2px;
    color: #FFFFFF;
	border-radius: 4px;
}

.dataTable-iconActions-i {
	padding: .5em;
	border-radius: 4px;
	opacity: 1;
    color: #777;
    cursor: pointer !important;
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

.dataTable-iconActions-i[disabled] {
	opacity: .38;
}

.dataTable-iconActions-i:hover {
	background-color: #e5e5e5;
	color: #333333;
}

.dataTable-iconActions-i:hover[disabled] {
	background-color: transparent;
	color: #777;
}

.dataTable-group-iconActions-i {
	display: inline-block;
    float: right;
}

/*****************/
/*** dataTable ***/
/*****************/

table.dataTable tbody tr,
table.dataTable tfoot tr,
table.dataTable thead tr,
table.dataTable thead th,
table.dataTable tfoot th,
table.dataTable tfoot td,
table.dataTable.display tbody tr:hover > .sorting_3,
table.dataTable.display tbody tr.odd:hover > .sorting_3,
table.dataTable.display tbody tr.even:hover > .sorting_3,
table.dataTable.order-column.hover tbody tr:hover > .sorting_3,
table.dataTable.order-column.hover tbody tr.odd:hover > .sorting_3,
table.dataTable.order-column.hover tbody tr.even:hover > .sorting_3 {
	background-color: #FFFFFF !important;
}

table.dataTable,
table.dataTable th,
table.dataTable td,
table.dataTable.row-border tbody th,
table.dataTable.row-border tbody td,
table.dataTable.display tbody th,
table.dataTable.display tbody td {
	border-spacing: 0 1em !important;
}

table.dataTable th,
table.dataTable td, 
table.dataTable.row-border tbody th,
table.dataTable.row-border tbody td,
table.dataTable.display tbody th,
table.dataTable.display tbody td {
	border: 1px solid #EEEEEE !important;
	border-right: none !important;
	border-left: none !important;
}

table.dataTable tbody th,
table.dataTable tbody td {
	padding: 1em !important;
}

.dataTables_wrapper {
	width: 100% !important;
}

table.dataTable tr th:first-child,
table.dataTable tr td:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	border: 1px solid #EEEEEE !important;
	border-right: none !important;
}

table.dataTable tr th:last-child,
table.dataTable tr td:last-child {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	border: 1px solid #EEEEEE !important;
	border-left: none !important;
}

table.dataTable tr th:only-child,
table.dataTable tr td:only-child {
	border-radius: 8px;
	border: 1px solid #EEEEEE !important;
}

table.dataTable tr:hover td {
	border: 1px solid #0091dd !important;
	border-right: none !important;
	border-left: none !important;
}

table.dataTable tr:hover td:first-child {
	border: 1px solid #0091dd !important;
	border-right: none !important;
}

table.dataTable tr:hover td:last-child {
	border: 1px solid #0091dd !important;
	border-left: none !important;
}

table.dataTable tr:hover td:only-child {
	border: 1px solid #0091dd !important;
}

table.dataTable thead .sorting_asc {
  background-position: left center !important;
}
table.dataTable thead .sorting_desc {
  background-position: left center !important;
}
table.dataTable thead .sorting {
  background-position: left center !important;
}

/* menu actions */

table.dataTable thead .actionTr {
	height: 49px;
	background-color: transparent !important;
}

table.dataTable thead .actionTr td {
	background-color: transparent !important;
	border: 1px solid transparent !important;
	border-radius: 0;
	color: #333333 !important;
	padding: 0 1.2em !important;
	font-size: 1.1em;
	font-weight: bold;
}

table.dataTable thead .actionTr:hover td, table.dataTable thead .actionTr:hover td:first-child, table.dataTable thead .actionTr:hover td:last-child, table.dataTable thead .actionTr:hover td:only-child {
	border-color: transparent !important;
}

table.dataTable thead .actionTr .actionTd div.dropdown {
	font-size: 14px;
    font-weight: normal;
}

table.dataTable thead .actionTr .actionTd div.dropdown a, table.dataTable thead .actionTr .actionTd .dropbtn, table.dataTable thead .actionTr .actionTd .dropdown-sub-content div {
	text-align: left;
	text-decoration: none;
	cursor:pointer;
	vertical-align: middle;
}

table.dataTable thead .actionTr .actionTd div.dropdown a, table.dataTable thead .actionTr .actionTd .dropdown-sub-content div {
	color: #777;
}

table.dataTable thead .actionTr .actionTd .dropbtn {
	padding: .25em 12px;
	color: #007bff !important;
}

table.dataTable thead .actionTr .actionTd div.dropdown a:hover, table.dataTable thead .actionTr .actionTd .dropdown:hover .dropbtn {
	color: #23527c !important;
}

table.dataTable thead .actionTr .actionTd .dropdown:hover .dropbtn {
	background-color: transparent !important;
}

table.dataTable thead .actionTr .actionTd div.dropdown a:hover {
	background-color: #e5e5e5;
}

table.dataTable thead .actionTr .actionTd .dropdown-content, table.dataTable thead .actionTr .actionTd .dropdown-sub-content {
	padding: 5px 0;
}

table.dataTable tbody .actionTd .dropdown-above .fa-angle-left {
	float: left;
    position: relative;
    top: 2px;
    padding-right: 1em;
}

table.dataTable tbody .actionTd .dropdown-sub-content {
	left: -98%;
}

table.dataTable tbody .actionTd .dropdown-sub-content .dropdown-sub-content-action {
	left: 128.5px !important;
    bottom: 4.5px !important;
}

table.dataTable thead .actionTr .actionTd .dataTable-actions-i {
	color: #777;
    position: relative;
    float: right;
    cursor: pointer;
}

table.dataTable thead .actionTr .actionTd .dataTable-actions-i:hover, #fileuploaderTemplate:hover .dataTable-actions-i, #fileuploaderFromFiles:hover .dataTable-actions-i {
	color: #23527c;
}

table.dataTable .dataTable-iconActions-i {
	margin: 0 .2em;
}

table.dataTable .dataTable-group-iconActions-i {
    position: relative;
    top: 17px;
}

/*****************/
/**** spinner ****/
/*****************/

.blockUI.blockMsg.blockPage {
	border: none !important;
    padding: 15px !important;
    background-color: transparent !important;
}

.blockUI.blockOverlay {
	background-color: white !important;
    opacity: 0.9 !important;
}

.progressBar {
	animation:spin 1s infinite linear;
	border:solid 2vmin transparent;
	border-radius:50%;
	border-right-color:#006ED6;
	border-top-color:#006ED6;
	box-sizing:border-box;
	height:20vmin;
	left:calc(50% - 10vmin);
	position:fixed;
	top:calc(50% - 10vmin);
	width:20vmin;
	z-index:1;
}

.progressBar:before {
    animation:spin 2s infinite linear;
    border:solid 2vmin transparent;
    border-radius:50%;
    border-right-color:#0091DD;
    border-top-color:#0091DD;
    box-sizing:border-box;
    content:"";
    height:16vmin;
    left:0;
    position:absolute;
    top:0;
    width:16vmin;
}

.progressBar:after {
    animation:spin 3s infinite linear;
    border:solid 2vmin transparent;
    border-radius:50%;
    border-right-color:#47A8FE;
    border-top-color:#47A8FE;
    box-sizing:border-box;
    content:"";
    height:12vmin;
    left:2vmin;
    position:absolute;
    top:2vmin;
    width:12vmin;
}

@keyframes spin {
  100% {
    transform:rotate(360deg);
  }
}

/***************/
/**** tags *****/
/***************/

.tagResult{
    color: white;
    display: inline-block;
    position: relative;
    margin: 3px;
    text-decoration: none;
    padding: 6px 10px;
    text-align: center;
    font-weight: bold;
    border-radius: 15px;
    width: auto;
    min-width: 20px;
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

/*****************************/
/**** doc Status & Action ****/
/*****************************/

.docStatusResult, .docActionResult {
    border-radius: 4px !important;
    display: inline-block;
    position: relative;
    margin: 3px !important;
    padding: 6px 10px;
    width: 140px !important;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/***********************/
/**** print message ****/
/***********************/

.commonMessage {
	border-radius:3px;
	font-size:200%;
	width:80%;
	padding:50px;
	margin:auto;
	margin-bottom:20px;
	margin-top:20px;
	font-weight:bold;
	text-align:center;
}

/******************/
/**** spectrum ****/
/******************/

.sp-replacer {
	margin-right: 5px !important;
    margin-top: 2px !important;
    width: 23px !important;
    height: 23px !important;
    border-radius: 50%;
    border: solid 1px #f5f5f5;
}

.sp-preview {
    width: 30px !important;
    height: 30px !important;
    border: none !important;
}