#dimensions_panel {
	display: block;
	position: fixed;
	top: 200px;
	left: 0;
	padding: 10px;
	height: 40px;
	line-height: 20px;
	background: green;
	color: white;
	z-index: 1000;
	box-shadow: 2px 2px 10px 2px grey;
}

/*navy #001F3F */ 
body { color: #404040; } 

/***********************************************************************************/
/*************    Print stuff, also look custom_print.css          *****************/
/***********************************************************************************/
#print_logo { display:none; }

.hide_all_images > img { display:none; }


/***************************************************************************/
/*************      Missing in  essentials.css             *****************/
/***************************************************************************/

.no-bg { background:none !important; }
 
.elipsis-with-wrap { 
	overflow:hidden; 
	text-overflow:ellipsis; 
	white-space: wrap; 
}

.text-align-center, .txt-center	{ text-align: center; 		}

.centered     { display: block; margin: 0 auto; padding-bottom:10px;  }
.centered img { max-width: 100%; }

/* button colors */
.btn-gray 			{ background-color: #666; color: #FFF !important; }
.fullwidth.btn-gray:hover	{ background-color: #999; color: #FFF !important; }

.w-21		{ width:21px !important; }
.w-22		{ width:22px !important; }
.w-23		{ width:23px !important; }
.w-24		{ width:24px !important; }
.w-25		{ width:25px !important; } 
.w-155		{ width:155px !important; }
.w-160		{ width:160px !important; }
.w-165		{ width:165px !important; }
.w-170		{ width:170px !important; }


.w-50p		{ width:50% !important; } 

/* max-width */
.maw-50        { max-width: 50px !important;  }
.maw-100       { max-width: 100px !important;  }
.maw-150       { max-width: 150px !important;  }
.maw-200       { max-width: 200px !important;  }
.maw-250       { max-width: 250px !important;  }
.maw-300       { max-width: 300px !important;  }
.maw-350       { max-width: 350px !important;  }




/* min-height */
.minh-auto       { min-height: auto  !important;  }
/* min-height pixel */
.mh-30         { min-height: 30px  !important;  }
.mh-40         { min-height: 40px  !important;  }
.mh-50         { min-height: 50px  !important;  }
.mh-55         { min-height: 55px  !important;  }
.mh-60         { min-height: 60px  !important;  }
.mh-100        { min-height: 100px !important;  }
.mh-150        { min-height: 150px !important;  }
.mh-200        { min-height: 200px !important;  }
.mh-250        { min-height: 250px !important;  }
.mh-300        { min-height: 300px !important;  }
.mh-350        { min-height: 350px !important;  }
.mh-400        { min-height: 400px !important;  }
.mh-450        { min-height: 450px !important;  }
.mh-460        { min-height: 460px !important;  }
.mh-470        { min-height: 470px !important;  }
.mh-480        { min-height: 480px !important;  }
.mh-500        { min-height: 500px !important;  }
.mh-510        { min-height: 510px !important;  }
.mh-520        { min-height: 520px !important;  }
.mh-530        { min-height: 530px !important;  }
.mh-540        { min-height: 540px !important;  }


/* min-height percent */
.mh-90p        { min-height: 90vh !important;  }
.mh-85p        { min-height: 85vh !important;  }
.mh-80p        { min-height: 80vh !important;  }
.mh-75p        { min-height: 75vh !important;  }
.mh-65p        { min-height: 65vh !important;  }
.mh-60p        { min-height: 60vh !important;  }
.mh-50p        { min-height: 50vh !important;  }
.mh-45p        { min-height: 45vh !important;  }
.mh-40p        { min-height: 40vh !important;  }
.mh-35p        { min-height: 35vh !important;  }
.mh-30p        { min-height: 30vh !important;  }
.mh-25p        { min-height: 25vh !important;  }

.mw-100		{ min-width:100px !important; }
.mw-150		{ min-width:150px !important; }
.mw-200		{ min-width:200px !important; }
.mw-250		{ min-width:250px !important; }

/* height real percent */
h-100per	{ height:100%; }
h-75per		{ height: 75%; }
h-50per		{ height: 50%; }
h-25per		{ height: 25%; }

.line-height-5		{ line-height:5 !important; 	}
.line-height-15		{ line-height:15px !important; 	}
.line-height-25		{ line-height:25px !important; 	}
.line-height-35		{ line-height:35px !important; 	}
.line-height-45		{ line-height:45px !important; 	}
.line-height-55		{ line-height:55px !important; 	}
.line-height-65		{ line-height:65px !important; 	}
.line-height-75		{ line-height:75px !important; 	}
.line-height-85		{ line-height:85px !important; 	}
.line-height-95		{ line-height:95px !important; 	}
.line-height-105	{ line-height:105px !important; }

.line-height-100p	{ line-height:1    !important; 	}
.line-height-150p	{ line-height:1.5  !important; 	}
.line-height-175p	{ line-height:1.75 !important; 	}
.line-height-200p	{ line-height:2    !important; 	}



/* font size in points*/
.fs-10pt { font-size: 10pt !important; }
.fs-11pt { font-size: 11pt !important; }
.fs-12pt { font-size: 12pt !important; }
.fs-13pt { font-size: 13pt !important; }
.fs-14pt { font-size: 14pt !important; }
.fs-15pt { font-size: 15pt !important; }
.fs-16pt { font-size: 16pt !important; }
.fs-17pt { font-size: 17pt !important; }
.fs-18pt { font-size: 18pt !important; }
.fs-19pt { font-size: 19pt !important; }
.fs-20pt { font-size: 20pt !important; }
.fs-21pt { font-size: 21pt !important; }
.fs-22pt { font-size: 22pt !important; }
.fs-23pt { font-size: 23pt !important; }
.fs-24pt { font-size: 24pt !important; }
.fs-25pt { font-size: 25pt !important; }
.fs-30pt { font-size: 30pt !important; }
.fs-35pt { font-size: 35pt !important; }
.fs-40pt { font-size: 40pt !important; }
.fs-45pt { font-size: 45pt !important; }
.fs-50pt { font-size: 50pt !important; }
.fs-55pt { font-size: 55pt !important; }
.fs-60pt { font-size: 60pt !important; }
.fs-65pt { font-size: 65pt !important; }
.fs-70pt { font-size: 70pt !important; }
.fs-75pt { font-size: 75pt !important; }
.fs-80pt { font-size: 80pt !important; }
.fs-90pt { font-size: 90pt !important; }
.fs-100pt { font-size: 100pt !important; }
.fs-120pt { font-size: 120pt !important; }
.fs-130pt { font-size: 130pt !important; }
.fs-140pt { font-size: 140pt !important; }
.fs-150pt { font-size: 150pt !important; }
.fs-200pt { font-size: 200pt !important; }



/* letter spacing */
.letter-spacing-n1 {
	letter-spacing: -0.1em !important;
}
.letter-spacing-n2 {
	letter-spacing: -0.2em !important;
}

/* button colors */
.btn-yellow2 { background-color: #F7CC1F; color: #333 !important; }
.btn-red2    { background-color: #C00000; color: #FFF !important; }
.btn-gray    { background-color: #222222; color: #FFF !important; }


.bg-light-yellow { background-color: #FEFFCB !important;  }

/* disable mw for small screens */
@media only screen and (max-width: 992px) {
	.mw-100, .mw-150, .mw-200, .mw-250 { min-width: auto !important; }
}

.w-auto		{ width:auto !important; }
.h-auto		{ height:auto !important; }

.text-nowrap { white-space: nowrap; }

.text-white { color:#fff !important; }
.text-black { color:#111 !important; }

.vertical-align-top { vertical-align:top !important; }
.vertical-align-bottom { vertical-align:bottom !important; }

/* image-backgrounds */ 
.bg-image-wall	{ background:url('../images/wall2.jpg');  }

/* for tables */
.table-noborders, 
.table-noborders th, 
.table-noborders td 	{ border:0px !important; }

.table-all-cells-valign-top th, 
.table-all-cells-valign-top td { vertical-align:top !important; }

.addhover:hover {  background-color: rgba(0, 0, 0, 0.075); }

.fs-1 { font-size: 1px !important; }

.box-light {
	color:#000;
	background-color:#efefef !important;
}

.text-poster-yellow 	{ color: #FCBD12 !important; }
.text-bright-yellow 	{ color: #FFF811 !important; }
.text-kstn-red		{ color: #CF2528 !important; }
.bg-kstn-red		{ background: #CF2528 !important; }

a.lnk_white:link,
a.lnk_white:visited	{ color: #fff; }
a.lnk_white:hover	{ color: #ccc; }

/***************************************************************************/
/*****************      Fix form elements	            ****************/
/***************************************************************************/
/* it messes with the click on the combo boxes **/
.fancy-form-select:before { display:none; }
.fancy-form-select select { height:40px  !important; }
.fancy-form-select option { padding-top:5px !important; height:30px  !important; } /* this does not work for chrome though.. */

/***************************************************************************/
/*****************      Fix images in cards	            ****************/
/***************************************************************************/

.card img { width: auto; max-width: 100%; }

/***************************************************************************/
/*****************      Fixes		 	            ****************/
/***************************************************************************/
.heading-arrow-bottom, .heading-arrow-top	{ z-index:11; }

/* when updated to smarty v2.2.1, bootstrap v4.0.0 messes with border-top in bootstrap.min.css*/
#topBar.dark > .border-top { border-top-color: rgba(255,255,255,0.2) !important; }


input.form-control { height: 30px !important; }

/*.tooltip { pointer-events: none; }*/

/***************************************************************************/
/*****************      Overide sto layout.css             *****************/
/***************************************************************************/
section.light.page-header	{ background-color: #fff; } 

#page-menu	{ height:auto; min-height:44px;}

/*
#toTop		{ background-color: #FCBD12;}
#toTop:hover	{ background-color: #B6830A;}
*/
#toTop		{ background-color: maroon;}
#toTop:hover	{ background-color: red;}

.timeline .timeline-item {
    min-height: 50px;
}


/*section.page-header .breadcrumb {
	top:100%;
}*/


/* Smaller shadow, so it does not mess with breadcrumbs */
#header.shadow-after-3:before {
	height:30px;
	bottom:-30px;
}

/* Use arrow insted of • for breadcrumbs */	
section.page-header .breadcrumb>li+li:before { content:"\00ab"; }

      /* Bigger title for active page */	
      section.page-header .breadcrumb li a.active { font-size:26px; line-height:18px; font-family: 'Open Sans',Arial,Helvetica,sans-serif; font-weight:300;}
      
      /* Active page stays on top and sitch to mobile view @ 992px, just like the page-menu*/	
@media only screen and (max-width: 992px) {		
	section.page-header .breadcrumb li:first-child { display:block; margin-bottom:10px; }
	section.page-header {
		text-align:center;
	}
	section.page-header .breadcrumb {
		position:relative;
		display:block;
		margin:0;
	}
	section.page-header .container.text-right,
	section.page-header .container.text-left {
		text-align:center;
	}
}

/* page-menu on mobile must have ...  for large titles at small screens*/
@media only screen and (max-width: 992px) {
	#page-menu ul {
		display:none;
		position:absolute;
		min-width:200px;
	}
	
	#page-menu ul>li>a {
		white-space: nowrap;
		overflow:hidden; 
		text-overflow: ellipsis;
		max-width:600px;
	}
}
@media only screen and (max-width: 620px) {
	#page-menu ul>li>a {
		max-width:300px;
	}
}


#slider div.slider-featured-text h1 {
	font-size:50px;
	line-height:60px;
	font-family:Arial,Helvetica,sans-serif;
}
#slider div.slider-featured-text h2 {
	margin-top:30px;
	font-size:20px;
	line-height:30px;
}

/*******************
@media only screen and (max-width: 1100px) {
	#header #topNav a.logo>img {
		max-height:40px !important;
	}
}

@media only screen and (max-width: 320px) {
	#header #topNav a.logo>img {
		max-width:100px !important;
	}
}
**********************/


#topBar.dark ul.top-links>li>a:hover {
	color:yellow !important;
}


/* HS: Min mou bgazete ta matia */
.sky-form	   { font-family: Arial !important; }
.sky-form header   { font-size:18px; border-color: #C0C0C0;}
input.form-control { border-color: #C0C0C0; }
.sky-form.boxed    { border-color: #C0C0C0; }
.custom-select     { border-color: #C0C0C0; }

#footer>.container {
	padding-top:20px;
	margin-bottom:20px;
} 

.text-hs-black          { color: #000000; }

.text-hs-darkgray       { color: #606060; }
.text-hs-gray           { color: #808080; }
.text-hs-lightgray      { color: #C0C0C0; }

.text-hs-darkslategray  { color: #2F4F4F; }
.text-hs-slategray      { color: #708090; }
.text-hs-lightslategray { color: #8798A9; }


/***********************************************************************************/
/*************      Add to layout.css                              *****************/
/***********************************************************************************/

.box-static.box-border-bottom {
    border-color: #1980B6;
}
.box-static.box-border-bottom {
    border-bottom: #1980B6 3px solid;
        border-bottom-color: #1980B6;
}

.box-static.box-border-top-bottom {
    border-color: #b92c28;
}
.box-static.box-border-top-bottom {
    border-bottom: #b92c28 3px solid;
        border-bottom-color: #b92c28;
}


/***********************************************************************************/
/*************      Custom classes for keystone stuff             *****************/
/***********************************************************************************/

#codeUser	{ max-width:100px; display:inline-block; }
#codeImg	{ background:#C00000; padding:7px 7px 7px 11px; margin-bottom:2px; border-radius:2px; }

a.company_link 		{color: #000080;}
a.company_link:hover	{color: #212121;}

.input-readonly { background-color: #D5DAE3 !important; }


/* ********************************* */


.box-static-hover-stuff:hover h5,
.box-static-hover-stuff:hover h4 { color:yellow !important;  }
.box-static-hover-stuff:hover .box-shadow-6 {
	-webkit-box-shadow:0 1px 4px rgba(255, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	   -moz-box-shadow:0 1px 4px rgba(255, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
			box-shadow:0 1px 4px rgba(255, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
 
	 
}


@media only screen and (min-width: 751px) and (max-width: 1200px) {

	.box-static-hover-stuff h4 { font-size:14px !important; white-space:nowrap;}
	.box-static-hover-stuff h5 { font-size:13px !important;}
}


/* ********************************* */

a.callout_stats:hover h3 { text-shadow: 2px 2px 8px #333; color:#FEFEFE;}
a.callout_stats:hover p  { text-shadow: 2px 2px 8px #333;  }
a.callout_stats:hover section	{
	-webkit-box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.5) inset;
	   -moz-box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.5) inset;
		box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.5) inset;
}

a.callout_printed_material h3 	    { 
	text-shadow: 2px 2px 2px #000; 
	background:#C00000; 
	display:inline-block; 
	padding:10px 20px 10px 20px; 
	-webkit-border-radius: 1% !important;
	   -moz-border-radius: 1% !important;
			border-radius: 1% !important;
	box-shadow: 2px 2px 8px #000; 
	
	}
a.callout_printed_material:hover h3 { color:#FEFEFE;}
a.callout_printed_material:hover p  { text-shadow: 2px 2px 8px #333;  }
a.callout_printed_material:hover section	{
	-webkit-box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.5) inset;
	   -moz-box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.5) inset;
		box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.5) inset;
}

.stats_slider_hover_comment:hover { background: #0F6673 !important; }

section.callout_download span	{ color:white; }
section.callout_download:hover      {
	-webkit-box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.2) inset;
	   -moz-box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.2) inset;
		box-shadow: 40px 140px 140px rgba(255, 255, 255, 0.2) inset;
	
}
section.callout_download a:link,
section.callout_download a:visited { color: #FFF811; text-decoration:underline; } 
section.callout_download a:hover { color: #FF0000; text-decoration:underline; }


/***********************************************************************************/
/*************      taken from  layout-shop.css	                   *****************/
/***********************************************************************************/

/* summary */

div.shop-item:hover h2	{ color:#c00000; } 

div.shop-item-summary {
	padding:15px 8px;

	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
			border-radius: 3px;
}
div.shop-item-summary h2 {
	font-size:13px;
	color:#222;
	margin:0 0 4px 0;
}

div.shop-item-rating-line {
	display:block;
	position:relative;
}
div.shop-item-rating-line:before {
	left: 0 !important;
	right: 50%;
	margin-right: 50px;
	content: '';
	position: absolute;
	top: 10px;
	padding:1px;
	height: 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
div.shop-item-rating-line:after {
	right: 0 !important;
	left: 50%;
	margin-left: 50px;
	content: '';
	position: absolute;
	top: 10px;
	padding:1px;
	height: 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}


/* list item price */
div.shop-item-price {
	font-size:20px;
	margin-top:6px;
	font-weight:bold;
}
div.shop-item-price>span {
	color:#999;
	font-size:15px;
	display:inline-block;
	padding:0 10px;
	font-weight:400;
}

/* list item buttons */
div.shop-item-buttons {
	margin-top:6px;
}
div.shop-item-buttons a.btn-default:hover {
	color:#333;
}
section.dark div.shop-item-buttons a.btn-default:hover {
	color:#fff;
}
	/* out of stock */
	span.out-of-stock {
		display:block;
		margin-top:15px;
	}

	span.out-of-stock:before {
		content:'–x– ';
	}
	span.out-of-stock:after {
		content:' –x–';
	}

	span.out-of-stock.clean:before,
	span.out-of-stock.clean:after {
		content:'';
	}



/* list item countdown */
div.shop-item>.thumbnail>.shop-item-counter {
	position:relative;
	position:absolute;
	bottom:4px;
	left:4px; right:4px;
	z-index:20;
	background-color:rgba(33,33,33,0.5);

	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
			border-radius: 3px;

	-webkit-border-top-left-radius: 0;
	-moz-border-radius-topleft: 0;
	border-top-left-radius: 0;
}
div.shop-item>.thumbnail>.shop-item-counter:before {
	position:absolute;
	left:0;
	top:-20px;
	padding:0 6px;
	height:20px;
	color:#fff;
	font: normal normal normal 14px/1 FontAwesome;
	content:"\f017 \20 limited offer";
	text-align:center;
	line-height:20px;
	background-color:rgba(33,33,33,0.5);

	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topright: 3px;
	border-top-right-radius: 3px;
	-webkit-border-top-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	border-top-left-radius: 3px;
}
div.shop-item>.thumbnail>.shop-item-counter>.countdown .countdown-section {
    display: inline-block;
    font-size: 11px;
	color:#fff;
    line-height: 1;
    text-align: center;
    width: 20%; margin:0 3px !important;
	padding:8px !important;
	text-align:center !important;
	margin:0; padding:0;
    text-transform: capitalize;
	overflow:hidden;

	-webkit-transition: all .500s;
	   -moz-transition: all .500s;
		 -o-transition: all .500s;
			transition: all .500s; 
}
div.shop-item>.thumbnail>.shop-item-counter>.countdown .countdown-amount {
	color:#fff;
    display: block;
    font-size: 13px;
	font-weight:bold;
	margin:0; padding:0;
}
div.shop-item>.thumbnail>.shop-item-counter>.countdown .countdown-period {
	font-size:10px !important;
	text-transform:lowercase !important;
	margin-top: 5px;
	display:block !important;
	margin-bottom:-18px !important;

	-webkit-transition: all .500s;
	   -moz-transition: all .500s;
		 -o-transition: all .500s;
			transition: all .500s; 
}

div.shop-item:hover>.thumbnail>.shop-item-counter>.countdown .countdown-period {
	margin-bottom:0 !important;
}

.thumbnail>.shop-limited-offer {
	position:absolute !important;
	left:5px; top:5px;
	z-index:20;
	color:#fff;
	font-size:18px;
	text-align:center;
}
.thumbnail>.shop-limited-offer>i {
	margin-left:8px;
	margin-top:6px;
}
.thumbnail>.shop-limited-offer:before {
	content: "";
	display: block;
	width: 40px;
	height: 40px;
	position: absolute;
	border: 26px solid transparent;
	border-left-color: #333;
	border-top-color: #333;
	left: 0; top: 0;

	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
			border-radius: 3px;
}


/****************************************************************/
/* For printing purpuses only in case user goes directly to print any page
  and we are using bootstrap classes 
  https://getbootstrap.com/docs/4.0/utilities/display/#display-in-print */ 
/****************************************************************/

.add-pagebreak-after 	{ page-break-after: always; } 
.add-pagebreak-before 	{ page-break-before: always; } 
.no-pagebreak-inside	{ page-break-inside: avoid; }

.student_lesson				{ margin-top:40px; }
.student_lesson	.lesson_title		{ margin-bottom:30px; }
.student_lesson .graph_container	{ margin-top:30px; }
.student_lesson .lesson_badges		{ font-size:15px; width:150px; }


@media only print  {
	
	.fix-print-in-fx 	{ display:block !important; }	
	section 		{ border: 0px !important; padding:0px !important; }
	.container		{ width:100% !important; max-width:100% !important; }

	.page-header-xs	{ margin-top: 20px !important; text-align:center !important; }
	
	.add-mt-20-onprint { margin-top: 20px !important;  }	
	
	.top_logos 	{ line-height:60px; margin:0px; padding:0px; }
	.top_logos img  { max-height:60px;  }
	
	.student_lesson		{ margin-top:5px !important; }
	.student_lesson	h4	{ font-size:15px !important; }
	
	.student_lesson .student_stat_title	{ font-size:13px !important; }
	.student_lesson .student_moria_title	{ font-size:13px !important; }
	
	.student_lesson	.lesson_title		{ margin-top:0px !important; margin-bottom:0px !important;  }
	.student_lesson .graph_container	{ margin-top:0px !important; margin-bottom:0px !important; }
	
	.student_lesson .lesson_badges		{ font-size:10px !important; width:100px !important; color:black !important; font-weight:400 !important; background:none !important; border:1px solid #999 !important;}
	
	canvas 		{  }
	
	
}


/****************************************************************/
/* For iframe videos like vimeo */ 
/****************************************************************/

.embed-container          { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } 
.embed-container iframe, 
.embed-container object, 
.embed-container embed    { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/****************************************************************/
/* For magnific popups  */ 
/****************************************************************/
.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}

/*************************************************************************/
/* fix some colors */
/*************************************************************************/
.callout-dark	{ background-color: #404040; } 
.heading-title.heading-arrow-top,
.heading-title.heading-arrow-bottom 	  { color:#fff; background-color: #404040; }
.heading-title.heading-arrow-bottom:after { border-top: 20px solid #404040; }
.heading-title.heading-arrow-top:after 	  { border-bottom: 20px solid #404040; }

.tp-bannertimer	{ background-color:red !important; }

.bg-dark { background: #404040 !important; }

#topBar.dark {
	color:#ccc;
	background-color:#404040;
	border-bottom-color:rgba(255,255,255,0.1);
}

section.dark {
	background-color:#404040 !important;
	border-bottom:rgba(255,255,255,0.1) 1px solid;
}

#footer {
	font-size:14px;
	color: rgba(255,255,255,0.6);
	display: block;

	background: #404040;
	/*
	background: -moz-linear-gradient(top, #555555 0%, #313131 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1a1d2b), color-stop(100%, #313131));
	background: -webkit-linear-gradient(top, #555555 0%, #313131 100%);
	background: -o-linear-gradient(top, #555555 0%, #313131 100%);
	background: -ms-linear-gradient(top, #555555 0%, #313131 100%);
	background: linear-gradient(to bottom, #555555 0%,#313131 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#313131',GradientType=0 );
	*/
}

.info-bar h3  {
	color:#404040;
	font-size:14px;
	line-height:1.4;
}

.info-bar h3:hover  {
	color:maroon;
}


#header.dark     { background-color:#404040; }


#header.fixed #topNav button.btn-mobile-active, #topNav button.btn-mobile-active {
    background-color: #404040 !important;
}

/*
#header.transparent #topMain, #header .submenu-dark #topMain {
    background-color: #404040;
}
*/

#topNav div.submenu-dark ul.dropdown-menu {
    background: #404040;
    background-color: #404040;
}

#header.translucent {
    background-color: rgba(0,0,0,0.5);
} 
 
/*************************************************************************/
/* top promos banners */
/*************************************************************************/

#promoBar { 
	margin:0px; padding:10px 0px; 
	text-align:center; 

	/*
	background: #404040; background-color: #404040; 
	border-top: rgba(255,255,255,0.1) 1px solid;
	border-bottom: rgba(255,255,255,0.1) 1px solid;
	*/

	background: #B71E1E; background-color: #B71E1E; 
	border-bottom: rgba(255,255,255,0.1) 1px solid;
	 
}
#promoBar img	{ height:70px; margin: 2px 2px;}


/*@media only screen and (min-width: 1100px) and (max-width: 1280px) {
	#promoBar img	{ height:65px; }
}
*/

@media only screen and (max-width: 340px) {
	#promoBar img	{ max-width:100%; height:auto; }
}


/*************************************************************************/
/* pinakes gia listes sxolon */
/*************************************************************************/
@media only screen and (max-width: 768px) {
	#datatable_01_wrapper .col-sm-12   { margin-bottom: 0px !important; }
	div.dataTables_filter label input  { width:50px !important; }
}

div.dataTables_length label select {
	width:     70px !important;
	height:    30px !important;
	padding:   0px 30px 0px 0px !important;
	font-size: 1em;
}

div.dataTables_length label  {
	font-size:   0.9em  !important;
	line-height: 30px   !important;
	font-weight: 600    !important;
	width:       100%   !important;   
}

div.dataTables_filter label {
	font-weight: normal;
	float:       right;
	line-height: 30px   !important;
	font-size:   0.9em  !important;	
	font-weight: 600    !important;
}    
    
#datatable_01	 { margin:0px; padding:0px; }
#datatable_01 th { font-size:0.8em;  background-color:#B71E1E; color:white; }
#datatable_01 td { font-size:0.8em; background-color:#fefefe; color:black; }
#datatable_01 td a { color:maroon; text-decoration:underline;}

#datatable_01 tr.thred    th { background-color:#B71E1E; color:white; }
#datatable_01 tr.thgreen  th { background-color:#28a745 ; color:white; }
#datatable_01 tr.thorange th { background-color:#FF851B; color:white; }
#datatable_01 tr.thblue   th { background-color:#0074D9; color:white; }


@media only screen and (max-width: 635px) {

	#datatable_01 th { font-size:0.5em; margin:0px; padding:0px; }
	#datatable_01 td { font-size:0.5em; margin:0px; padding:0px; }
	
}

 
/*************************************************************************/
/* Για κάποιες κατηγορίες στην αρχική σελίδα */
/*************************************************************************/
 
 
 ul.testimonial-dotted > li {
    padding-top:    15px;
    padding-bottom: 0px;
}

.testimonial	.testimonial-content  	   { color:black;    padding-left:60px;}
.testimonial	.testimonial-content:hover { color:maroon;   }
.testimonial    figure i 		   { font-size:45px; }	


@media only screen and (min-width: 752px) and (max-width: 974px) {

	.testimonial	.testimonial-content  	   { padding-left:35px; font-size:13px; }
	.testimonial    figure i 		   { font-size:25px; }	
}



/*************************************************************************/
/* Για το mobile menu του 2ου επιπεδου */
/*************************************************************************/

#page-menu-mobile { background-color: rgba(255, 253, 253, 0.2); color:#fff; }

/*************************************************************************/
/* Για να μη βάζει αυτό το μεγάλο κενό  */
/*************************************************************************/

@media only screen and (max-width: 768px) {
	section div.row>div {
		margin-bottom:0px;
	}
}    

/**************************************************/
/* Γιατί δε μας αρέσει η διαφάνεια, θέλουμε χρώμα */
/**************************************************/
.callout.callout-theme-color .btn,
.callout.callout-dark .btn {
	background-color:#404040;
	border-color:#404040;
}
.callout.callout-theme-color .btn:hover,
.callout.callout-dark .btn:hover {
	background-color:#606060;
	border-color:#606060;
}

/**************/
/* Γραμμούλες */
/*************/
.addborderright	{ height:100%;  }

@media only screen and (min-width: 751px) {

	.addborderright	{ border-right: 1px solid #aaa; }
	
}



/**************************************************/
/* Owl carousel for kappx */
/**************************************************/
/*#kappx_owl-carousel_block	{ display: block; width: 100%; margin:0px; padding:0px; }*/
#kappx_owl-carousel_block	{ width: 100%; margin:0px; padding:0px; }

/* Override owl controls  COLORS */
#kappx_owl-carousel_block .owl-theme .owl-controls .owl-page span 			{ background:white;  filter: Alpha(Opacity=90);  opacity: 0.9; }
#kappx_owl-carousel_block .owl-theme .owl-controls .owl-page.active span		{ background:yellow; filter: Alpha(Opacity=100); opacity: 1;   }
#kappx_owl-carousel_block .owl-theme .owl-controls.clickable .owl-page:hover span	{ background:yellow; filter: Alpha(Opacity=90);  opacity: 0.9; }
/* Set items  */
#kappx_owl-carousel_block a:link,	
#kappx_owl-carousel_block a:visited  { 
	display:block; overflow:hidden; 
	padding:0px; margin:0px 0px 5px 0px; 
	font-family:Open Sans, Arial, Verdana; 
	font-size:15px; 
	line-height:18px; 
	background:none; 
	color:#FFFFFF; 
	font-weight:normal; 
	text-decoration:none;
	text-align:left;   
}
#kappx_owl-carousel_block a:hover	{ color: #eee;  }	

/**************************************************/
/* No need the lable of toggle to be bold when active */
/**************************************************/

.toggle.toggle-transparent div.toggle.active label {
	font-weight:normal !important;
}