@CHARSET "UTF-8";

* { font-size: 13px !important; }	
 
.w-45 { width: 45% !important; } 
  
.b { font-weight: bold; }          

.a-left   {text-align: left;}
.a-right  {text-align: right;}
.a-center {text-align: center;}
.a-justify {text-align: justify;}

.red   { color: #b80000; }
.blue  { color: #38409e; }
.white { color: #ffffff; }
.green { color: #2e7034; }   
.black { color: #000000; }
.transp { opacity: 0.0; }
.half-transp { opacity: 0.5; }
.violet { color: #dbd7fd; }

.mt-3px { margin-top:    3px; }
.mr-3px { margin-right:  3px; }
.mb-3px { margin-bottom: 3px; }
.ml-3px { margin-left:   3px; }

.mt-5px { margin-top:    5px; }
.mr-5px { margin-right:  5px; }
.mb-5px { margin-bottom: 5px; }
.ml-5px { margin-left:   5px; }

.mt-7px { margin-top:    7px; }

.mt-8px { margin-top:    8px; }
.mr-8px { margin-right:  8px; }
.mb-8px { margin-bottom: 8px; }
.ml-8px { margin-left:   8px; }

.mt-10px { margin-top:    10px; }
.mr-10px { margin-right:  10px; }
.mb-10px { margin-bottom: 10px; }
.ml-10px { margin-left:   10px; }

.mt-20px { margin-top:    20px; }
.mr-20px { margin-right:  20px; }
.mb-20px { margin-bottom: 20px; }
.ml-20px { margin-left:   20px; }
    
.b-r-5px { border-radius: 5px; }

.b-sh { box-shadow: 2px 2px 4px #777777; }                    
.b-sh2 { box-shadow: 2px 2px 3px #333333; }
.b-sh3 { box-shadow: 3px 3px 4px #777777; }

table {
   border-collapse: separate;
   table-layout: fixed;
   background-color: #c1c9df;
   border-spacing: 1px;
   }
   
table td {
   height: 30px;
   padding: 0 10px;
   font-size: 12px;
   text-align: left;
   background: #ffffff;
   overflow: hidden;
   }
   
table td.td-d-block-fix { padding: 5px 10px 0 10px !important; }    
   
table tr.dark td,
table tr td.dark { background: #f0f0f0; }    	   
   
table tr.header td,
table tr td.header {
   color: #38409e;
   background: #e6ecff;
   }

a:hover {
    text-decoration: none !important;    
}
    	   
a.red:hover   { color: #b80000; }
a.blue:hover  { color: #38409e; }
a.green:hover { color: #2e7034; }
a.black:hover { color: #000000; }
   
.btn {
	font-weight: bold;
}   
   
.btn-top {
	background: #ffffff;
    -webkit-filter: grayscale(50%);
    filter: grayscale(50%);
    padding: 15px;		
}   

.btn-top:hover {
	background: #ffffff;
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
    padding: 15px;	
}

div.counter { 
	color: #ffffff;
	border-radius: 5px;
	padding: 1px;
	font-weight: bold;
	float: left;
	background: #b80000;
	margin-left: 3px;
	font-size: 11px !important;
	min-width: 20px !important;
	text-align: center;
	}
	
div.counter.new       { background: #545495; color: #ffffff; }	
div.counter.started   { background: #8787c2; color: #ffffff; }	
div.counter.completed { background: #b6b6e3; color: #333333; }	
div.counter.rejected  { background: #bbbbbb; color: #333333; }

div.counter.total { 
	/* background: #ffc107; */
	background: #d3d3fb; 
	color: #54501a;
	top: 35px; 
	}		
	
div.counter.total.y-axis-filter-free-media { 
	top: 229px !important; 
	}	
	
div.counter.total.y-axis-filter-trainings { 
	top: 146px !important; 
	}
	
.b-w {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

.b-w-50 {
    -webkit-filter: grayscale(50%);
    filter: grayscale(50%);
}

/* -----------------------*/
/* TOP NAVIGATION BUTTONS */
/* -----------------------*/
.nav-top {
	font-weight: bold;
	background: #ffffff;
	background: rgb(189,189,189);
	background: linear-gradient(180deg, rgba(189,189,189,1) 0%, rgba(221,221,221,1) 31%, rgba(255,255,255,1) 100%);
    padding: 18px 15px 0 15px;
    border-radius: 0;
    margin: 0 1px 0 0;
    float: left;
    cursor: pointer;
    text-decoration: none !important;
    width: 110px;
    height: 58px;
}

.nav-top img {
    -webkit-filter: grayscale(50%);
    filter: grayscale(50%);	
}

.nav-top.left { border-radius: 5px 0 0 5px; }
.nav-top.right { border-radius: 0 5px 5px 0; }

.nav-top:hover {
    background: #ffffff;
}

.nav-top.active {
	background: #ffffff;    
}

.nav-top.active img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}

.mq-button { background: #b0beff; }

.btn-warning { background: #b0beff; border-color: #606eaf; box-shadow: 2px 2px 3px #333333 !important; }

.btn-warning:hover, 
.btn-warning:active,
.btn-warning:focus, 
.btn-warning:target { background: #808ecf !important; border-color: #606eaf !important; color: #ffffff !important; box-shadow: 2px 2px 3px #333333 !important; }