/*
 * INDEX
 * 
 * - HTML
 * - BODY
 * - CUSTOM STYLES
 */


/* We use it at enlarge Modal window */    
.modal-dialog {
    width: 60vw;
}


/*
 * MANSONRY
 */
.masonry-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0px;
}

.masonry-item {
    background-color: #f0f0f0;
    padding: 20px;
    border: none;
}


.masonry-item {
    width: 18%; /* Default για μεγάλες οθόνες */
}

@media (max-width: 1280px) {
    .masonry-item {
        width: 23%; /* Για μεσαιες οθόνες */
    }
}

@media (max-width: 1024px) {
    .masonry-item {
        width: 33%; /* Για παλιες οθόνες */
    }
}

@media (max-width: 768px) {
    .masonry-item {
        width: 50%; /* Για tablet */
    }
}

@media (max-width: 480px) {
    .masonry-item {
        width: 100%; /* Για κινητά */
    }
}
/* END MANSONRY */



/* Make the login box a little bigger */
@media (min-width: 1405px) {
  .container {
    width: 1280px;
  }
}
#extr-page #main {
    padding-top: 0px; 
}

							  

#external-events{ width: 100%; min-height: 7em; padding: 1%;  }

#external-events > li > :first-child:after {
  color: #ffffff;
  color: rgba(255, 255, 255, 0.7);
  content: attr(data-description);
  font-size: 10px;
  font-weight: 400;
  display: block;
  line-height: 0px;
  margin: 10px 0 5px 0;
  text-transform: none !important;
}
   
.internal-events > li {
  margin: 6px 4px 6px 0;
  display: inline-block;
  word-wrap:break-word;
}
.internal-events > li > :first-child {
  padding: 5px 10px 10px;
  cursor: move;
  display: block;
}
.internal-events > li > :first-child:after {

  content: attr(data-description);
  font-size: 10px;
  font-weight: 400;
  display: block;
  line-height: 0px;
  margin: 10px 0 5px 0;
  text-transform: none !important;
}


#chat-container {
height: 315px;
}

#chat-container .chat-list-body {
  height:auto;
  background: #ffffff;
}

.chat-body {
  height:auto;
}

.fixed-navigation nav {
	overflow-x: hidden;
	height: auto;
	padding-bottom: 5px; /* not necessary =P */
}


/* grayLight theme */
.jarviswidget-color-grayLight > header {
  border-color: #92a2a8 !important;
  background: #dddddd;
  color: #92a2a8;
}
.jarviswidget-color-grayLight  > header  > .jarviswidget-ctrls a,
.jarviswidget-color-grayLight .nav-tabs li:not(.active) a {
  color: #92a2a8 !important;
}
.jarviswidget-color-grayLight .nav-tabs li a:hover {
  color: #92a2a8 !important;
} 

.bg-color-grayLight {
  background-color: #eeeeee !important;
}

.txt-color-grayLight {
  color: #eeeeee !important;
}

/* grayDark theme */
.jarviswidget-color-grayDark > header {
  border-color: #92a2a8 !important;
  background: #d6d6d6;
  color: #92a2a8;
}
.jarviswidget-color-grayDark  > header  > .jarviswidget-ctrls a,
.jarviswidget-color-grayDark .nav-tabs li:not(.active) a {
  color: #92a2a8 !important;
}
.jarviswidget-color-grayDark .nav-tabs li a:hover {
  color: #92a2a8 !important;
} 

.bg-color-grayDark {
  background-color: #394338 !important;
}


/* only for jQgrid plugin for first rowcolumn */ 
.ui-jqgrid td.jqgrid-rownum {
  background-color: #eee;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2f2f2), to(#fafafa));
  background-image: -webkit-linear-gradient(top, #f2f2f2 0, #fafafa 100%);
  background-image: -moz-linear-gradient(top, #f2f2f2 0, #fafafa 100%);
  background-image: -ms-linear-gradient(top, #f2f2f2 0, #fafafa 100%);
  background-image: -o-linear-gradient(top, #f2f2f2 0, #fafafa 100%);
  background-image: -linear-gradient(top, #f2f2f2 0, #fafafa 100%);
  font-size: 12px;
  border-right-width: 1px;
  border-right-color: #dddddd;
  border-right-style: solid;  
}

.ui-jqgrid .ui-state-hover td{
    color: #000000!important;
    background-color: #eef7fc!important;
    border-color: #bce8f1!important;
}

.ui-state-hover{
    color: #999999!important;
}

.ui-jqgrid .ui-state-highlight td {
    color: #3a87ad!important;
    background-color: #f9f9cf!important;
    border-color: #dbf1fc!important;
}

/* We use it at to WRAP TEXT at jqgrid */
.ui-jqgrid tr.jqgrow td {
        white-space: normal !important;
    }
 
 /* navbar */   
.navbar-inverse {
  background-color: #3a3633 !important;
}

/* only for x-editable checklist if is very big */
.editable-checklist {
	max-height: 300px;
	overflow-y: auto;
	overflow-x: hidden;
}

/* We use it at datatables for buttons excel-copy */
.padding-6 {
  padding: 6px 8px !important;
}

.table-hover>tbody>tr:hover {
	background-color: #fcf9e9 !important;	
}
 
 /* We use it at WIZARD to control % the steps if more than 4
 .bootstrapWizard li {
  width: 20%  !important;
}
*/

 /* We use it at DATATABLEW SHOW-HIDE COLUMNS */
ul.ColVis_collection {
  width: 250px  !important;
}


/* We use it to enlarge input for x-editable */  
.zzz_edp_input{
   width: 250px !important;
}


/* We use it to show tooltip for jquery slider */
#slider_politikes .ui-slider-tip {
    visibility: visible !important;
    opacity: 1;
		top: -30px; 
}
#slider_apostasi .ui-slider-tip {
    visibility: visible !important;
    opacity: 1;
		top: -30px; 
}


/********************************************************************* Skin-0 *************************************************************/
body.smart-style-0 {
  font-family: "Open Sans",Arial,Helvetica,Sans-Serif !important;
}

/* LEFT PANEL */
.smart-style-0 .bg-color-bigBlue {
  background-color: #394338 !important;
}

/* LEFT PANEL */
.smart-style-0 aside {
  background: #232e30 !important;
}
.smart-style-0 aside .minifyme {
  background: #394338 !important;
  color: #e8efe7;
}
.smart-style-0 aside .minifyme:hover {
  background: #8fb489 !important;
  color: #ffffff;
}
.smart-style-0:not(.menu-on-top) nav ul li.active:not(.open) > a:before,
.smart-style-0:not(.menu-on-top) nav > ul > li.active:not(.open) > a:before {
 /*   
  content: "";
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAqBAMAAAAt0TTmAAAAHlBMVEUAAAD///////////////////////////////////8kfJuVAAAACnRSTlMABQMJDRIBFhofGayHogAAAOFJREFUKM+F070RgzAMBeBU6QkbuKDnlA1INoCjpWIDzmyA2QC2zVMC6IfcIbrvnjC2xe1v3XuUs4AqoN6gBjMuYOcNqINElHskLqDuflY/fKjgC1VRCZTgu/6isaZpoByU5nYAIqgtRiRhJZp3HKc4AInUynOKQNs8LwlWc3MoNluXNEWsYmxNabdwGDefbRp4YW2rmM1dv8+ue/4+v49MLB37lTMYQdxKclbq/ELfbdaCEOPX2ftA7HRviMHU/SIl1yazUdrZ2MjMUA7gaSn8/IE6ZSHD42Y3oGQH+l+4qg+S/XPD6LV6iwAAAABJRU5ErkJggg==);
  background-repeat: no-repeat;
  background-position: left;
  border-left: 4px solid #e8efe7;
  left: 0px;
  height: 37px;
  top: 0px;
 */ 

  content: "\f0d9";
  font-family: FontAwesome;
  display: block;
  height: 27px;
  line-height: normal;
  width: 27px;
  position: absolute;
  right: -21px;
  font-size: 20px;
  color: #eeeeee;
   
}

.smart-style-0 nav ul li a {
  color: #ced3e2;
  -webkit-transition: background-color 0.2s ease-in-out 0s;
  transition: background-color 0.2s ease-in-out 0s;
  font-size: 13px;
  padding-top: 6px;
  padding-bottom: 9px;
}
.smart-style-0 nav > ul > li > a {
  padding-top: 6px;
  padding-bottom: 9px;
}
.smart-style-0 nav > ul > li > a b {
  top: 6px;
  font-size: 13px;
}
.smart-style-0 nav > ul ul li a {
  padding-top: 6px;
  padding-bottom: 9px;
}
.smart-style-0:not(.minified) nav ul ul li > a {
  padding-left: 35px;
}
.smart-style-0:not(.minified) nav ul ul ul li a {
  padding-left: 30px;
}
.smart-style-0:not(.minified) nav ul ul ul ul li a {
  padding-left: 69px;
}
.smart-style-0:not(.minified) nav ul ul ul ul ul li a {
  padding-left: 92px;
}
.smart-style-0:not(.minified) nav ul ul ul ul ul ul li a {
  padding-left: 115px;
}
.smart-style-0:not(.minified) nav > ul > li > a > i {
  margin-right: 9px;
}
.smart-style-0:not(.menu-on-top) nav ul li a:hover {
  background: #394338;
  color: #ffffff;
  font-size: 13px;
}
.smart-style-0 nav ul li a:active {
  background: #292d39;
  color: #ffffff;
  font-size: 13px;
}
.smart-style-0 nav ul ul,
.smart-style-0 nav ul li.open > a,
.smart-style-0.minified nav ul ul,
.smart-style-0.minified nav li li {
  background: #2c393b;
}
.smart-style-0 nav > ul > li > ul:before,
.smart-style-0 nav > ul ul li:before {
  border: none;
  border-left: 1px solid #7A7A7A;
}
/* Second level: UL */
.smart-style-0 nav > ul > li > ul::before {
  border-left: 1px solid #7A7A7A;
}
/* Second level: UL LI */
.smart-style-0 nav > ul ul li::before {
  border-top: 1px solid #7A7A7A;
  z-index: 1;
}
/* Third level: UL LI */
.smart-style-0 nav > ul ul ul li::before {
  border-top: 1px solid transparent;
}
.smart-style-0 #content > .row:first-child {
  background-color: #f7f7f9;
  margin-top: -10px;
  padding-top: 6px;
  margin-bottom: 13px;
  padding-bottom: 7px;
  border-bottom: 1px solid #d9dbe4;
}
/*
 * RIBBON
 */
.smart-style-0 #ribbon {
  background: #232e30 !important;
}
/*
 * LOGIN
 */
.smart-style-0 .login-info a {
    color: #ced3e2;
}

.bigBox .bigboxicon {
    display: none !important;
}