html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, /*strong,*/ sub, sup, tt, var,
/*b,*/ u, i, center,
dl, dt, dd, /*ol, ul, li,*/
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-family: 'Roboto';
	
}
/*ol, ul {
	list-style: none;
}*/
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


html,
body {
 height: 100%;
 position: relative;
}



.main-container {
 min-height: 100vh; /* will cover the 100% of viewport */
 overflow: hidden;
 display: block;
 position: relative;
 
 min-width : 1300px;
}

#content-wrap {
  padding-bottom: 100px;    /* Footer height */
  
}

.footer {
 position: absolute;
 bottom: 0;
 width: 100%;
 height: 100px;
 background-color:#e5e5e5;
 text-align:center;
}

.dropbtn {
  /*background-color: #4CAF50;
  color: white;
  padding: 16px;*/
  font-size: 16px;
  border: none;
  float:left;
}



.dropdown {
  position: relative;
  display: inline-block;
  padding:0px 15px 0px 10px;
  border-right:1px solid white;
}

.dropdown  a{
	color:#fff;
	text-decoration:none;
}

.dropdown  a:hover{
	font-weight:700;
}


.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  top:20px;
}

.dropdown-content2 {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 200px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  top: 90px;
margin-left: 70px;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content2 a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #ddd;}

.dropdown:hover .dropdown-content {display: block;}

.eisodos:hover .dropdown-content2 {display: block;}


.dropdown:hover .dropbtn {/*background-color: #3e8e41;*/cursor:pointer}



.cont-form input, .cont-form textarea {
  background: #fff;
  color: #525865;
  border-radius: 4px;
  border: 1px solid #d1d1d1;
  box-shadow: inset 0px 1px 8px rgba(0, 0, 0, 0.2);
  font-family: inherit;
  font-size: 1em;
  line-height: 1.10;
  outline: none;
  padding: 0.6em 1.45em 0.7em;
  -webkit-transition: .18s ease-out;
  -moz-transition: .18s ease-out;
  -o-transition: .18s ease-out;
  transition: .18s ease-out;
  
}

.cont-form input:hover, .cont-form textarea:hover {
  box-shadow: inset 1px 2px 8px rgba(0, 0, 0, 0.02);
}

.cont-form input:focus, .cont-form textarea:focus {
  color: #4b515d;
  border: 1px solid #B8B6B6;
  box-shadow: inset 1px 2px 4px rgba(0, 0, 0, 0.01), 0px 0px 8px rgba(0, 0, 0, 0.2);
}









.container {
  display: block;
  position: relative;
  /*padding-left: 35px;*/
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 16px;
  padding-top: 5px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-top:10px
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}

.popup_content {
  margin: 10px;
  padding: 0 10px;
  max-width: 60%;
  border: 2px solid #444;
  background: white;
}

#ex5 input{
	width:100%
}

#ex3 input{
	width:100%
}

#ex3 textarea{
	width:100%
}

.lefty{
	float:left;
	text-align:right;
	width:45%;
	padding-right:2%;
}

.righty{
	float:left;
	text-align:left;
	width:46%;
}

.formator{
	width:70%;
	padding:0 15%;
	color:grey;
}

.formator input{
	width:100%
}


.title1{
	color:#4395cd;
	font-weight:bold;
	font-size:1.5vw;

}

.text1{
	color:#636363;
	font-size:1vw;
}


.cat_boxes , .cat_boxesx{
width:24.5%;
float:left;
padding-right:0.5%;
}

/*
.cat_boxes , .cat_boxesx{
width:23%;
float:left;
padding-right:2%;
}
*/
.cat_boxes:hover .cat_image{
	opacity: 0.2;
	filter: alpha(opacity=20);
}

.cat_boxesxx{
	width:23%;
	float:left;
	margin-right:5%;
	border:1px solid #ececec;
}

.cat_boxes:hover .centered{
	display:block;
}

.centered {
  position: absolute;
  top: 25%;
  left: 0%;
  /*transform: translate(-50%, -50%);*/
  display:none;
}

.cont1{
	position: relative;
  text-align: center;
  color: blue;
  font-size:2vw;
}

.cont-pd{
	width:80%;
	padding:0 10%;
}

.clearx{
	clear:both;
}

.f_l{
	float:left;
}

.f_r{
	float:right;
}


.hx10{
	height:10px;
}

.hx15{
	height:15px;
}

.hx20{
	height:20px;
}

.hx30{
	height:30px;
}

.hx40{
	height:40px;
}

.hx60{
	height:60px;
}


.fs_2{
font-size:34px;
}

.fs_1_7{
font-size:28px;
}


.fs_1_5{
font-size:24px;
}

.fs_1_4{
font-size:22px;
}

.fs_1_3{
font-size:20px;
}

.fs_1_2{
	font-size:18px;
}

.fs_1_1{
	font-size:16px;
}


.fs_1{
	font-size:14px;
}

.fs_italic{
	font-style:italic;
}

.fs_bold{
	font-weight:bold;
}

.pad_tb3{
	padding-top:3px;
	padding-bottom:3px;
}

.pad_tb10{
	padding-top:10px;
	padding-bottom:10px;
}

.pad_tb20{
	padding-top:20px;
	padding-bottom:20px;
}

.pad_tb25{
	padding-top:25px;
	padding-bottom:25px;
}

.pad_tb30{
	padding-top:30px;
	padding-bottom:30px;
}

.pad_lr5{
	padding-left:5px;
	padding-right:5px;
}

.pad_lr10{
	padding-left:10px;
	padding-right:10px;
}

.pad_lr20{
	padding-left:20px;
	padding-right:20px;
}

.hr_grey{
	border: 1px solid #c6c6c6;
}

.hd{
	display:none;
}

.bc_grey1{
	background-color:#f2f2f2;
}

.bc_black{
	background-color:#000;
}

.fc_white{
	color:#fff;
}

.fc_blue{
	color:#0187ce;
}

.fc_grey1{
	color : #787878;
}

.fc_grey1 a{
	color : #787878;
}

.fc_grey2{
	color:#717171;
}

.fc_grey2 a{
	color:#717171 ;
}


.mg_lf_2{
	margin-left:2%;
	margin-right:2%;
}

.tx_n a{
	text-decoration:none;
}

.dis_in{
	display:inline-block
}

/***********************************************/
/*                PRODUCT                      */
/***********************************************/

#pd_top_left{
	float:left;
	width:38%;
}

#pd_top_right{
	float:left;
	width:60%;
	padding:0 1%
}

.blue_files{
	background-color:#0187ce;
	padding:5px;
	margin:5px;
	cursor:pointer;
	float:left;
}

.blue_files a{
	text-decoration:none;
	
	color:#fff;
}

.pick_div{
	border:1px solid grey;
	float:left;
	padding:3px;
	margin:3px;
}

.pick_div:hover{
	border:1px solid red;
	cursor:pointer;
}

 .pick_selected{
	border:1px solid red;
}

.top_checked{
	width:49%;
	margin:0 0.5%;
	float:left;
	background-color:#e5e5e5;
	color:#8c8c8c;
	padding:10px 0px;
	text-align:center;
	background-repeat: no-repeat;
	background-position: 10px 2px; 
	background-size: 30px 30px;	
	cursor:pointer;
	
}

#pd_main_top_left{
	background-image: url('/images/perigrafi_grey.png');	
}

#pd_main_top_left.main_top_checked{
	background-image: url('/images/perigrafi_white.png')  !important;	
}

#pd_main_top_right{
	background-image: url('/images/xaraktiristika_grey.png');
}

#pd_main_top_right.main_top_checked{
	background-image: url('/images/xaraktiristika_white.png') !important;
}

.main_top_checked{
	background-color:#0187ce !important ; 
	color:#fff !important ;
}

.main_checked{
	/*width:90%;
	padding:0 5%;*/
	width:99%;
	padding:0 0.5%;
	text-align:justify;
}

.specs_cont{
	width:49%;	
	margin:0 0.5%;
	float:left;
}

.ta_c{
	text-align:center;
}

.ta_j{
	text-align:justify;
}


.custom-select{
	width: 500px;
	height: 46px;
	overflow: hidden;
	background: url('/images/select_arrow_sm.png?asd=3') no-repeat 450px #fff;
	border: 1px solid #d8d8d8;
}

.custom-select select {
    background: transparent;
    width: 600px;
    padding: 5px;
    font-size: 18px;
    line-height: 1;
    border: 1px;
    border-radius: 10px;
    height: 46px;
    -webkit-appearance: none;
}

/***********************************************/
/*           END  PRODUCT                      */
/***********************************************/

/***********************************************/
/*           CATEGORY                          */
/***********************************************/


.category_title {
	background-color:#efefef;
	color:#0187ce;
	font-size:50px;
	text-align:center;
	padding:20px;
	font-weight:bold;
	position:relative;

}

.category_cont{
	border:1px solid #ececec;
	float:left;
	width:29%;
	margin:20px 0.5%;
	padding:1.5%;
}

.category_model{

}

.click_to_product{
	background-color:#0187ce;
	padding:10px 2%;
	width:96%;
	text-align:center;
	
}

.click_to_product a {
	text-decoration:none;
	color:#fff;

}

.spec_titles{
	
}

.specs{
	padding:20px; 
	cursor:pointer;
	border-right:1px solid #fff;
}

.specs:hover{
	background-color:#0187ce;
}

.specs_checked{
	background-color:#0187ce;
}

.clear_filters{
	background-color: #0187ce;
	color: #fff;
	float: right;
	font-size: 20px;
	position: absolute;
	top: 20px;
	right: 30px;
	padding: 10px;
	cursor:pointer;
}

.sup_titles{
	display:inline-block;
	border-left:3px solid #0187ce;
	padding-left:10px;
	margin-left:5px;
	text-align:left;
}

.dis_in img {
position: relative;
top: 8px;
}

/***********************************************/
/*           END  CATEGORY                     */
/***********************************************/

/***********************************************/
/*                 SUPPORT                     */
/***********************************************/

#files_content td, #files_content th
{
	vertical-align:middle;
}

.info_85{
	display:none;
}

/***********************************************/
/*           END  SUPPORT                      */
/***********************************************/

/***********************************************/
/*                 SUPPORT                     */
/***********************************************/

#files_content td, #files_content th
{
	vertical-align:middle;
}

.info_85{
	display:none;
}

/***********************************************/
/*           END  SUPPORT                      */
/***********************************************/

/***********************************************/
/*                 ABOUT                       */
/***********************************************/

#about
{
	width:70%;
	padding:0 15%;
}

/***********************************************/
/*           END  ABOUT                        */
/***********************************************/

.loginator{
	width:70%;
	padding:0 15%;
	color:grey;
}

.title_login{
	font-weight:700;
	color:#000;
}

.input_login{
	font-size:22px;
	background-color:#f2f3f5;
	color:#4395cd;
	border: 0px;
    padding: 5px 5%;
	width:90% !important;
}

.cb7x{
	clear:both;
	height:7px;
}

.bk_link a{
	color:#000;
}

.input_login_black{
	font-size:22px;
	background-color:#f2f3f5;
	color:#000;
	border: 0px;
    padding: 5px 5%;
	width:90% !important;
}