:root {
	--my-success: #198754;
	--my-danger: rgb(185, 25, 25);
	--my-warning : rgb(255, 170, 0);
	--my-secondary : gray;
	--my-primary : rgb(43, 144, 245);
	--my-info : #5cd1e9;
}



td {
  	word-wrap:break-word;
  	word-break:break-word;
}

.table-responsive {
    font-size : 12px;
}


select.trano{
	font-size : 14px;
}

.table > tbody > tr > td {
    vertical-align: middle;
}

.table > thead > tr > th {
    vertical-align: middle;
}

@font-face { font-family: Bradley; src: url('BRADHITC.TTF'); } 

@font-face {
	font-family: "roboto";
	src: url("webfont/Roboto-Regular.ttf");
}

body {
	font-family: "roboto", serif;
}

label.titlos{
	font-size : 50px;
	padding-left : 40px;
	color : gray;
}

.breadcrumb > li + li:before {
    color: #ccc;
    content: "/ ";
    padding: 0 0px;
	margin : 0 0px;
}

.breadcrumb {
	margin-top : 0 0px;
	padding-left : 80px;
}

.navbar{
	margin : 0 0px;
	padding : 0 0px;
}

/*
Theme Name: jqueryui-com
Template: jquery
*/

a,
.title {
	color: #b24926;
}

#content a:hover {
	color: #333;
}

#banner-secondary p.intro {
	padding: 0;
	float: left;
	width: 50%;
}

#banner-secondary .download-box {
	border: 1px solid #aaa;
	background: #333;
	background: -webkit-linear-gradient(left, #333 0%, #444 100%);
	background: linear-gradient(to right, #333 0%, #444 100%);
	float: right;
	width: 40%;
	text-align: center;
	font-size: 20px;
	padding: 10px;
	border-radius: 5px;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.8);
}

#banner-secondary .download-box h2 {
	color: #71d1ff;
	font-size: 26px;
}

#banner-secondary .download-box .button {
	float: none;
	display: block;
	margin-top: 15px;
}

#banner-secondary .download-box p {
	margin: 15px 0 5px;
}

#banner-secondary .download-option {
	width: 45%;
	float: left;
	font-size: 16px;
}

#banner-secondary .download-legacy {
	float: right;
}

#banner-secondary .download-option span {
	display: block;
	font-size: 14px;
	color: #71d1ff;
}

#content .dev-links {
	float: right;
	width: 30%;
	margin: -15px -25px .5em 1em;
	padding: 1em;
	border: 1px solid #666;
	border-width: 0 0 1px 1px;
	border-radius: 0 0 0 5px;
	box-shadow: -2px 2px 10px -2px #666;
}

#content .dev-links ul {
	margin: 0;
}

#content .dev-links li {
	padding: 0;
	margin: .25em 0 .25em 1em;
	background-image: none;
}

.demo-list {
	float: right;
	width: 25%;
}

.demo-list h2 {
	font-weight: normal;
	margin-bottom: 0;
}

#content .demo-list ul {
	width: 100%;
	border-top: 1px solid #ccc;
	margin: 0;
}

#content .demo-list li {
	border-bottom: 1px solid #ccc;
	margin: 0;
	padding: 0;
	background: #eee;
}

#content .demo-list .active {
	background: #fff;
}

#content .demo-list a {
	text-decoration: none;
	display: block;
	font-weight: bold;
	font-size: 13px;
	color: #3f3f3f;
	text-shadow: 1px 1px #fff;
	padding: 2% 4%;
}

.demo-frame {
	width: 70%;
	height: 420px;
}

.view-source a {
	cursor: pointer;
}

.view-source > div {
	overflow: hidden;
	display: none;
}

@media all and (max-width: 600px) {
	#banner-secondary p.intro,
	#banner-secondary .download-box {
		float: none;
		width: auto;
	}

	#banner-secondary .download-box {
		overflow: auto;
	}
}

@media only screen and (max-width: 480px) {
	#content .dev-links {
		width: 55%;
		margin: -15px -29px .5em 1em;
		overflow: hidden;
	}
}

.dropdownMenuDiv{
	display : flex;
	flex-direction : row;
	justify-content : flex-start;
	align-items:center;
	gap : 0.2em;
}

@media print {
	.ektos {display:none};
}

#loading {
	display:none;
	position:absolute;
	left:0;
	top:0;
	z-index:1000;
	width:100%;
	height:100%;
	min-height:100%;
	background:white;
	opacity:0.8;
	text-align:center;
	color:#fff;
}
#loader {
	display:none;
	position:absolute;
	left:0;
	top:0;
	z-index:1000;
	width:100%;
	height:100%;
	min-height:100%;
	background:white;
	opacity:0.8;
	text-align:center;
	color:#fff;
}
#signing {
	display:none;
	position:absolute;
	left:0;
	top:0;
	z-index:1000;
	width:100%;
	height:100%;
	min-height:100%;
	background:white;
	opacity:0.8;
	text-align:center;
	color:#fff;
}
#rejecting {
	display:none;
	position:absolute;
	left:0;
	top:0;
	z-index:1000;
	width:100%;
	height:100%;
	min-height:100%;
	background:white;
	opacity:0.8;
	text-align:center;
	color:#fff;
}

#canceling {
	display:none;
	position:absolute;
	left:0;
	top:0;
	z-index:1000;
	width:100%;
	height:100%;
	min-height:100%;
	background:white;
	opacity:0.8;
	text-align:center;
	color:#fff;
}

#inboxHeaderRow>div{
	flex-grow: 1;
}

.col1{
	flex-basis: 5%;
}

.col2{
	flex-basis: 5%;
}
.col3{
	flex-basis: 20%;
}
.col4{
	flex-basis: 25%;
}
.col5{
	flex-basis: 20%;
}
.col6{
	flex-basis: 20%;
}
.col7{
	flex-basis: 5%;
}

.messageRow{
	border-bottom: rgba(95, 95,95, 0.2) solid 1px;
}


.isButton{
	background-color: var(--my-secondary);
	font-family: var(--bs-body-font-family);
	color : white;
	border-radius:5px;
	border-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-color: #4f4a4a;
	padding : 0.25rem 0.5rem;
	cursor : pointer;
	font-size: 1em;
	cursor : pointer!important;
	min-width : 2.5rem;
}

.isGreen{
	background-color : #198754;
}

.outline{
	background-color: rgba(255,255,255,0.6);
	color: black;
	border: 2px solid RGBA(0,0,0,0.2);
}

.small{
	font-size: 0.875rem;
}

.extraSmall{
	font-size: 0.75rem;
}

.active{
	background-color: var(--my-success);
}

.dismiss{
	background-color: var(--my-danger);
}

.warning{
	background-color: var(--my-warning);
	color: black;
}

.secondary{
	background-color: var(--my-secondary);
}

.primary{
	background-color: var(--my-primary);
}

.info{
	background-color: var(--my-info);
	color: black;
}

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

.rotate{
	animation:spin 2s linear infinite;
}

.emailMsgSubject{
	color: rgb(57, 57, 243);
	font-weight: 700;
}

a.emailMsgSubject:visited{
	color:rgb(16, 153, 177);
	font-weight: 300;
}

.flexHorizontal{
	display : flex;	
	flex-flow: row nowrap;
	gap : 0.2em;
	background-color : lightgray;
	border-radius : 5px;
	align-items : stretch;
	flex-basis : auto;
}

.customDialog::backdrop{
	background-color: rgba(0, 0, 0, 0.8);

}

.customDialogContent{
	display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    border-radius: 15px;
}

.customDialogContentTitle{
	display: flex;
	justify-content: space-between;
    gap: 10px;
    border-radius: 15px;
	margin-bottom:10px;
	align-items: flex-start;
}

.report{
	background-color:lightgreen;
	font-weight: normal;
	font-style : italic; 
	color:gray;
}

.seen{
	font-style : italic; 
	color:gray;
	font-weight: normal;
	
}

.protocol{
	background-color:#F5F5DC;
	font-weight: normal;
}

.hide{
	display: none!important;
}