* {
    box-sizing: border-box;
}
body {
  position: relative;
  overflow-x: hidden;
}
body {
	margin: 0;
	padding: 0;
	min-width: 320px;
}


br.closer {
	display: block;
	clear: both;
}

.row:after {
    content: "";
    clear: both;
    display: block;
}

* {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.right {text-align: right;}
.right-gap {text-align: right; padding-right: 8px;}
.left {text-align: left;}
.center {text-align: center;}
.bold {font-weight: bold !important;}
.top {vertical-align: top;}
.middle {vertical-align: middle;}
.bottom {vertical-align: bottom;}

.error {
	margin: 5%;
	color: red;
}


/*
	************* header
*/
.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  margin: 0px;
  padding: 0px 10px;
	background-color: #dedede; /* #f8f8f8; /* #ffffff; */
  border-style: none;
  xxxheight: 116px;
  border-bottom: 1px solid gray;
}


/* LOGÓ */
	.header-logo {
		float: left;
		font-weight: bold;
		font-family: sans-serif;
		letter-spacing: -2px;
		padding-top: 10px;
		padding-left: 1%;
		xxxfont-size: 60px;
	}
		.header-logo img {border: 0px none;}
		.header-logo a {
			display: table-cell;
			vertical-align: middle;
			text-decoration: none;
			color: #262626;
			xxxheight: 100px;
			}
			.header-logo span {
				color: #ee1c25;
				}
	.header-languages {color: gray; text-align: right;}
		.header-languages a {color: inherit; text-decoration: none;}
		.header-languages a:hover {color: #ee1c25; text-decoration: none !important; }

/* MENÜ */
	.header-main-menu {
		display: inline-block;
		margin: 0;
		padding: 0;
		float: right;
		}

		.header-main-menu ul {
			margin: 0;
			padding: 0;
			}

		.header-main-menu li {
			display: inline-block;
			position: relative;
			xxxheight: 116px;
			}

	.header-main-menu li a {
			display: table-cell;
			margin: 0;
			font-family: sans-serif;
			font-weight: 700;
			text-decoration: none;
			color: #262626;
			background-color: transparent;
			vertical-align: middle;
			text-align: center;
			border-bottom-style: solid;
			border-bottom-color: transparent;
			
		}

	.header-main-menu li a:hover {
			color: #ffffff;
			background-color: #262626;
			border-bottom-color: #ee1c25;

			xxxborder-bottom-width: 10px;
		}


.highlight-box {
	padding: 1% 2%;
	font-weight: bold;
	
	border-style: solid;

	border-bottom-color: #ee1c25;
	border-bottom-width: 8px;
	border-top-color: #262626;
	border-top-width: 2px;
}
.highlight-a {
	font-size: 130%;
}




	.header-sub-menu {
		position: absolute;
		top: 90px;
		right: 24px;
		padding: 0;
		}

	.header-sub-menu-inner {
		background-color: rgba(38, 38, 38, .85);
		color: white;
		padding: 8px 14px;
		
		}

	.header-sub-triangle-marker {
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 6px 10px 6px;
		border-color: transparent transparent rgba(38, 38, 38, .85) transparent;
		margin-right: 10px;
		margin-left: auto;
		}

	.header-sub-menu ul {
		padding: 0px 12px;
		}
	.header-sub-menu li {
		height: 38px; 
		display: block;
		}
	.header-sub-menu li a {
		font-size: 16px; 
		font-weight: 600; 
		color: white;
		text-decoration: none;
		}
	.header-sub-menu li a:hover {
		text-decoration: underline;
		}
/*				
	.header-main-menu-icon { text-align: right; padding-top: 12px; padding-right: 10px;}
		.header-main-menu-icon input[type=button]
			{font-size: 20px; cursor: pointer; border: 1px solid silver; border-radius: 2px; padding: 0 3px;}
		.header-main-menu-lang input[type=button] 
			{font-size: 15px; cursor: pointer; border: 1px solid silver; border-radius: 2px; padding: 0 3px; margin-bottom: 8px; margin-left: 4px;}
*/














/*
		********************** TARTALMI RÉSZ
*/
	.content {
		margin-top: 10px;
		}
		

	.content .head-image {
		width: 100%;
		height: auto;
		}

	.content .head-image-inner-page {
		width: 100%;
		height: auto;
		}
		


	/* téma boxok */
	.themebox {
		height: 100%;
		display: table-cell;
		cursor: pointer;
		}
		.themebox-1	{
			background-color: #f0333b;
			color: white;
			}
		.themebox-2	{
			background-color: #dddddd;
			color: black;
			}

    	.themebox .title {font-weight: bold;}
    	.themebox a {text-decoration: none; color: inherit; display: block; text-align: right;}

		.themebox.themebox-1:hover {
				background-color: #bd0e20;
			}
		.themebox.themebox-2:hover {
				background-color: #ccc;
			}



	/* szöveges részek */
	.textcontent {
		}
		.textcontent h1,
		.textcontent h2 {
			color: #888;
			}
		.textcontent h3,
		.textcontent h5 {
			color: #f0333b;
			}
		.textcontent p {
			}
		
		
	/* kategóriák, vásárlás */
	.themebox-offer {}
		.themebox-offer .title {font-weight: bold;float: left; }
		.themebox-offer a {text-decoration: none; color: inherit; display: block;}
		
  	.themebox-offer .period {}
  	.themebox-offer .price {font-weight: bold;}
  	.themebox-offer input[type=button] {font-weight: bold; color: #f0333b; background-color: #ddd; border: 1px solid gray; cursor: pointer;}
	  	.themebox-offer input[type=button]:hover {color: #444;}
		



	/* footer */		
	.footer {
		background-color: #444 /*#262626*/;
		color: #ddd;
		font-weight: 200;
		}
	.footer-normal {
		position: relative;
		}
	.footer-fixed {
		position: fixed;
  	bottom: 0;
  	left: 0;
  	right: 0;
		}
		
		
		.footer a {
			color: #ddd;
			text-decoration: none;
			font-weight: 200;
			}
		.footer a:hover {
			color: #fff;
			text-decoration: underline;
			}
		.footer a::before {
			content: "▪ ";
			}
	
	
	.floating-footer {
	  position: fixed;
  	bottom: 0;
  	left: 0;
  	right: 0;
  	margin: 0px;
  	xxxpadding: 16px 10px;
	
		xxxbackground-color: #000;
		xxxbackground-color: #f0333b;
		background-color: #b01423;
	  border-style: none;
	  border-top: 1px solid #6a0012;
  	xxxheight: 100px;
	
		font-size: 14px;
		color: white;
		padding: 10px 0;
		text-align: center;
	}
	
	
	
	
	
/* form */	
	.form {
		font-size: 14px;
		line-height: 180%;
		color: #666;
		letter-spacing: 0.02em;
		font-weight: 300;
		}
	 .form .row {
	 	margin: 8px 0;
	 	}
	 	
		form input[type=text],
		form input[type=password],
		form select {
			background-color: #f0333b;
			color: white;
			border: 1px solid #811;
			border-radius: 4px;
			font-size: 14px;
			font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
			font-weight: 300;
			letter-spacing: 0.03em;
			}
		form option {
			background-color: #f0333b;
			color: white;
			font-size: 14px;
			font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
			font-weight: 300;
			letter-spacing: 0.03em;
			}
			
			

		form input[type=text],
		form input[type=password] {
			padding: 2px 8px;
			}
	
		form select {
	    padding: 2px 30px 2px 2px;
			-webkit-appearance: none;
	    -moz-appearance: none;
	    appearance: none;
	    background-image: url(select_arrow.png);
	    background-position: right;
	    background-repeat: no-repeat;
			}
			/* for ie */
			form	select::-ms-expand {
		    display: none;
			}
	
		.form .label {text-align: right; padding-right: 8px;}
		.form .data {text-align: left; font-weight: 800;}
	
		form input[type=radio] {
			
			}
	
	
		form input[type=submit] {
			background-color: #444;
			color: #eee;
			border-radius: 4px;
			border: 1px solid black;
			font-size: 13px;
			font-weight: 800;
			padding: 2px 12px;
			}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
.warning {
	color: #f0333b !important;
	}
.info {
	color: #00b !important;
	}


.fullwidth {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 0;
}

.contentwidth {
	clear: both;
	padding: 0;
	margin-left: auto;
	margin-right: auto;
	}


/*
.fluid {
	margin-left: auto;
	margin-right: auto;
	padding-left: 15px;
	padding-right: 15px;
}

@media only screen and (max-width: 500px) {
    body {
        background-color: lightblue;
    }
}
*/
/*

A KÉP NŐ, CSÖKKEN
img {
    width: 100%;
    height: auto;
}

A KÉP NŐ-CSÖKKEN, DE MAX A BOX SZÉLESSÉGÉNEK 100%, NEM NŐ TOVÁBB
img {
    max-width: 100%;
    height: auto;
}


HÁTTÉRKÉP FELTÖLTI A FELÜLETET:
div {
    width: 100%;
    height: 400px;
    background-image: url('img_flowers.jpg');
    background-size: cover;
    border: 1px solid red;
}


*/

/*
	*** a kategória ikonok miatt szét kellett hekkelni..
*/
@media only screen and (max-width: 399px) {
	.themebox img {height: 14px;}
	.themebox .icons {display: block; line-height: 14px;}
	.themebox-offer img {height: 14px;}
}
@media only screen and (min-width: 400px) and (max-width: 599px) {
	.themebox img {height: 14px;}
	.themebox .icons {display: block; line-height: 14px;}
	.themebox-offer img {height: 18px;}
}
@media only screen and (min-width: 600px) and (max-width: 749px) {
	.themebox img {height: 14px;}
	.themebox .icons {display: block; line-height: 14px;}
	.themebox-offer img {height: 22px;}
}
@media only screen and (min-width: 750px) and (max-width: 1299px) {
	.themebox img {height: 22px;}
	.themebox .icons {display: block; line-height: 22px;}
	.themebox-offer img {height: 22px;}
}
@media only screen and (min-width: 1300px) {
	.themebox img {height: 25px;}
	.themebox .icons {display: inline-block;}
	.themebox-offer img {height: 25px;}
}










/* 
************************ PHONE SIZE - MAX 600 PX 
*/

@media only screen and (max-width: 599px) {
	.header {height: 60px;}
	.header-languages {display: none;}
	/*
	.header-languages {height: 18px; font-size: 11px;}
		.header-languages img {height: 10px; margin-left: 10px; vertical-align: middle;}
	*/
	.header-logo {font-size: 28px;}
	.header-logo a {height: 48px;}	
		.header-logo a:hover {text-decoration:none;}
		.header-logo img { height: 36px;}



	.header-main-menu {
		position: absolute;
		top: 10px;
		right: 14px;
		xxxwidth: 250px;
		xxxbackground-color: #262626;
		background-color: rgba(38, 38, 38, .85);
		color: white;
		padding: 4px;
		}
	.header-main-menu-leftblock {display: inline-block;}
	.header-main-menu-rightblock {display: inline-block; vertical-align: top; margin-left: 5px; padding-left: 5px; border-left: 1px dotted gray;}

	.header-main-menu li {height: 28px; display: block}
	.header-main-menu li a {height: 28px; font-size: 12px; font-weight: 300; line-height: 180%; padding: 0 4px;  xxxborder-bottom-width: 2px; color: white;}
	.header-main-menu li a:hover {border-bottom-color: transparent; background-color: transparent; text-decoration: underline;}
	.header-main-menu-lang {display: ;}
	#header-main-menu-mobile-close {display: ;}
					.header-main-menu-rightblock img {height: 14px; border: 0px none;}
				
	.header-main-menu-icon { text-align: right; padding-top: 12px; padding-right: 10px;}
		.header-main-menu-icon input[type=button]
			{font-size: 20px; cursor: pointer; border: 1px solid silver; border-radius: 2px; padding: 0 3px;}
		.header-main-menu-lang input[type=button] 
			{font-size: 15px; cursor: pointer; border: 1px solid silver; border-radius: 2px; padding: 0 3px; margin-bottom: 8px; margin-left: 4px;}

	#kezeles_gomb {display: none;}

	.floating-footer { opacity: 0; padding: 0; margin: 0; widht: 1px; height: 1px; overflow: hidden;}

	.show_hide_menu {
			-webkit-appearance: none;
		}


	.content {margin-top: 54px;}
		/* lásd .header height - 5 valamiért */
	.contentwidth {max-width: 97%;}

	
	.themebox {padding: 8px; display: block; height: 110px;}
		.themebox .title {font-size: 26px; float: left; width: 65px;}
		.themebox .text {font-size: 13px;}
		.themebox a {font-size: 12px;}
  .themebox-offer {padding: 8px;}
		.themebox-offer .title {font-size: 22px;}
		.themebox-offer .text {font-size: 13px;}
   	.themebox-offer .period {font-size: 12px; margin-top: 8px;    float: left; }
  	.themebox-offer .price {font-size: 13px; margin-top: 8px;    float: left; }
  	.themebox-offer input[type=button] {font-size: 11px; margin-top: 8px; paddig: 2px 0 !important;     float: left; display: inline-block; }
	  	.themebox-offer input[type=button]:hover {}
  
  
	h1 {font-size: 40px; padding-top: 18px; padding-bottom: 6px;}
		h1.subtitle {padding-bottom: 0px;}
	h2 {font-size: 36px; padding-top: 18px; padding-bottom: 6px;}
		h2.subtitle {padding-bottom: 0px;}
	h3 {font-size: 30px; padding-top: 4px; padding-bottom: 8px;}
		h3.subtitle {padding-top: 0px;}
	h4 {font-size: 26px; padding-top: 4px; padding-bottom: 8px;}
		h4.subtitle {padding-top: 0px;}
	h5 {font-size: 20px; padding-top: 4px; padding-bottom: 8px;}
		h5.subtitle {padding-top: 0px;}

	p, ul {font-size: 11px;}

	.dt-dotedright {}
	.m-dottedbottom {border-bottom: 1px dotted silver;}
	.m-dottedtop {border-top: 1px dotted silver;}
	.dt-floatleft {}
	.m-floatleft {float: left;}
	.dt-floatright {}
	.m-floatright {float: right;}
	.dt-padleft {}
	.dt-padright {}
	


	.padding-vertical {padding-top: 15px; padding-bottom: 15px;}
	.gap {margin-bottom: 15px; }
	.footer {padding-top: 15px; padding-bottom: 25px; padding-left: 20px;}
		.footer a {font-size: 16px; display: block; line-height: 24px;}


	/* form */
	#divTerkep {display: none;}

	form {
		font-size: 12px;
		}
		form input[type=text],
		form input[type=password],
		form select {
			font-size: 12px;
			}
		form input[type=text],
		form input[type=password] {
			padding: 1px 4px;
			}
		form select {
	    padding: 1px 20px 1px 1px;
	    }
			
			
			
	.terkep-height {height: 200px;}
}
	
/* ez csak iphone-ra kell... de azon sem mindenhová */			
/*
input {
	-webkit-appearance: none;
	}
*/




/* 
********************** TABLET SIZE - 600-900 PX 
*/
@media only screen and (min-width: 600px) and (max-width: 899px) {
	.header {height: 70px /*90px*/;}
	.header-languages {height: 20px; font-size: 11px;}
		.header-languages img {height: 12px; margin-left: 10px; vertical-align: middle; border: 0px none;}
	/* ALABONTAS 1 */
	.header-logo a {height: 54px /*64px*/;}	
		.header-logo a:hover {text-decoration:none;}
		.header-logo img { height: 36px;}

	.header-main-menu-leftblock {display: inline-block;}
	.header-main-menu-rightblock {display: none;}

	.header-main-menu li {height: 50px /*70px*/;}
	.header-main-menu li a {height: 50px /*70px*/; border-bottom-width: 4px;}
	.header-main-menu li a:hover {}
	.header-main-menu-lang {display: none;}
	#header-main-menu-mobile-close {display: none;}

	.floating-footer { opacity: 0; padding: 0; margin: 0; widht: 1px; height: 1px; overflow: hidden;}



	.content {margin-top: 65px /*85px*/;}
		/* lásd .header height -5 valamiért... */
	.contentwidth {max-width: 97%;}

	/* ALABONTAS 2 */
		.themebox .text {font-size: 13px;}
		.themebox a {font-size: 12px;}
	.themebox-offer {padding: 12px;}
		.themebox-offer .title {font-size: 26px;}
		.themebox-offer .text {font-size: 14px;}
   	.themebox-offer .period {font-size: 13px; margin-top: 8px;}
  	.themebox-offer .price {font-size: 16px; margin-top: 8px;}
  	.themebox-offer input[type=button] {font-size: 13px; margin-top: 8px;}
	  	.themebox-offer input[type=button]:hover {}
  
  
	h1 {font-size: 40px; padding-top: 32px; padding-bottom: 18px;}
		h1.subtitle {padding-bottom: 0px;}
	h2 {font-size: 36px; padding-top: 32px; padding-bottom: 18px;}
		h2.subtitle {padding-bottom: 0px;}
	h3 {font-size: 30px; padding-top: 8px; padding-bottom: 16px;}
		h3.subtitle {padding-top: 0px;}
	h4 {font-size: 26px; padding-top: 6px; padding-bottom: 12px;}
		h4.subtitle {padding-top: 0px;}
	h5 {font-size: 20px; padding-top: 8px; padding-bottom: 16px;}
		h5.subtitle {padding-top: 0px;}

	p, ul {font-size: 12px;}

	.dt-dotedright {border-right: 1px dotted silver;}
	.dt-floatleft {float: left;}
	.m-floatleft {}
	.dt-floatright {float: right;}
	.m-floatright {}
	.dt-padleft {padding-left: 3%;}
	.dt-padright {padding-right: 3%;}
	
	.header-main-menu-icon {
		display: none;
		}
	
	.padding-vertical {padding-top: 35px; padding-bottom: 35px;}
	.gap {margin-bottom: 35px;}
	.footer {padding-top: 25px; padding-bottom: 35px;}
		.footer a {font-size: 16px; padding-right: 20px; }
		
		
	/* form */
	#divTerkep {display: block;}

	.terkep-height {height: 300px;}

}

/* Speciális alábontások */
	/* ALABONTAS 1 */
	@media (min-width: 600px) and (max-width: 749px) {
		/* .header-logo {font-size: 32px;} */
		.header-main-menu li a {font-size: 13px; padding: 0 4px; }
	}
	@media (min-width: 750px) and (max-width: 899px) {
		/* .header-logo {font-size: 36px;} */
		.header-main-menu li a {font-size: 14px; padding: 0 6px; }
	}

	/* ALABONTAS 2 */
	@media (min-width: 600px) and (max-width: 749px) {
		.themebox {padding: 12px; display: block; width: 100% !important; height: 75px;}
			.themebox .title {font-size: 26px; float: left; width: 85px;}
			.themebox .text {font-size: 13px;}
	}  
	@media (min-width: 750px) and (max-width: 899px) {
		.themebox {padding: 12px; display: table-cell;}
			.themebox .title {font-size: 26px;}
  }






/* 
**************** DESKTOP SIZE - MIM 900 PX 
*/
@media only screen and (min-width: 900px) {
	.header {height: 100px /*138px*/ /*116px*/;}
	.header-languages {height: 22px; font-size: 12px;}
		.header-languages img {height: 14px; margin-left: 12px; vertical-align: text-bottom; border: 0px none;}
	.header-logo {font-size: 50px;}
	.header-logo a {height: 100px;}
		.header-logo a:hover {text-decoration:none;}
		.header-logo img { height: 50px;}
	
	.header-main-menu-leftblock {display: inline-block;}
	.header-main-menu-rightblock {display: none;}

	.header-main-menu li {height: 78px /*116px*/;}
	.header-main-menu li a {height: 78px /*116px*/; font-size: 16px /*20px*/; padding: 0 6px; border-bottom-width: 7px;}
	.header-main-menu li a:hover {}
	.header-main-menu-lang {display: none;}
	#header-main-menu-mobile-close {display: none;}
	
	.xxxfloating-footer { opacity: 0; padding: 0; margin: 0; widht: 1px; height: 1px; overflow: hidden;}
	
	.content {margin-top: 95px /*133px*/;}
		/* lásd .header height -5 valamiért... */
	.contentwidth {max-width: 900px;}
	
	  
  
  
	.themebox {padding: 22px; display: table-cell;}
		.themebox .title {font-size: 42px;}
		.themebox .text {font-size: 13px;}
		.themebox a {font-size: 15px;}
	.themebox-offer {padding: 22px;}
		.themebox-offer .title {font-size: 42px; line-height: 40px;}
		.themebox-offer .text {font-size: 14px;}
  	.themebox-offer .period {font-size: 16px; margin-top: 12px;}
  	.themebox-offer .price {font-size: 22px; margin-top: 12px;}
  	.themebox-offer input[type=button] {font-size: 18px; margin-top: 12px;}
	  	.themebox-offer input[type=button]:hover {}
  
  
	h1 {font-size: 66px; padding-top: 42px; padding-bottom: 28px;}
		h1.subtitle {padding-top: 0px; padding-bottom: 0px;}
	h2 {font-size: 54px; padding-top: 42px; padding-bottom: 28px;}
		h2.subtitle {padding-top: 0px; padding-bottom: 0px;}
	h3 {font-size: 42px; padding-top: 12px; padding-bottom: 28px;}
		h3.subtitle {padding-top: 0px; padding-bottom: 0px;}
	h4 {font-size: 32px; padding-top: 8px; padding-bottom: 20px;}
		h4.subtitle {padding-top: 0px; padding-bottom: 0px;}
	h5 {font-size: 30px; padding-top: 12px; padding-bottom: 28px;}
		h5.subtitle {padding-top: 0px; padding-bottom: 0px;}

	p, ul {font-size: 14px;}

	.dt-dotedright {border-right: 1px dotted silver;}
	.dt-floatleft {float: left;}
	.m-floatleft {}
	.dt-floatright {float: right;}
	.m-floatright {}
	.dt-padleft {padding-left: 6%;}
	.dt-padright {padding-right: 6%;}
	
	.header-main-menu-icon {
		display: none;
		}
	
	.padding-vertical {padding-top: 55px; padding-bottom: 55px;}
	.gap {margin-bottom: 55px; }
	.footer {padding-top: 35px; padding-bottom: 45px;}
		.footer a {font-size: 18px; padding-right: 30px; }


	/* form */
	#divTerkep {display: block;}

	.terkep-height {height: 450px;}

}








 /* For mobile phones: */
/*
[class*="c-"] {
	width: 100%;
}
*/
@media only screen and (max-width: 599px) {
	/* For tablets: */
	.cm-0 {display: none;}
	.cm-1 {width: 8.33%;}
	.cm-2 {width: 16.66%;}
	.cm-3 {width: 25%;}
	.cm-4 {width: 33.33%;}
	.cm-5 {width: 41.66%;}
	.cm-6 {width: 50%;}
	.cm-7 {width: 58.33%;}
	.cm-8 {width: 66.66%;}
	.cm-9 {width: 75%;}
	.cm-10 {width: 83.33%;}
	.cm-11 {width: 91.66%;}
	.cm-12 {width: 100%;}
	
	.cotodm-1 {width: 100%;}

}
@media only screen and (min-width: 600px) {
	/* For desktop: */
	.c-0 {display: none;}
	.c-1 {width: 8.33%;}
	.c-2 {width: 16.66%;}
	.c-3 {width: 25%;}
	.c-4 {width: 33.33%;}
	.c-5 {width: 41.66%;}
	.c-6 {width: 50%;}
	.c-7 {width: 58.33%;}
	.c-8 {width: 66.66%;}
	.c-9 {width: 75%;}
	.c-10 {width: 83.33%;}
	.c-11 {width: 91.66%;}
	.c-12 {width: 100%;}
	
	.cotod-1 {width: 20%;}

}



h1, h2, h3, h4, h5 {
	margin: 0;
	line-height: 110%;
	}
h2, h4 {font-weight: 100;}
p, ul {
	font-size: 14px;
	line-height: 180%;
	color: #666;
	letter-spacing: 0.02em;
	}
a {cursor: pointer;}
a:hover {
	text-decoration: underline;
	}

.div-z-table{
  display:table;         
  width:auto;         
  background-color:#eee;         
  border:1px solid  #666666;         
  border-spacing:1px; /*cellspacing:poor IE support for  this*/
  margin: 0 auto;
  width: auto;
}
.div-z-table-row{
  display:table-row;
  width:auto;
  clear:both;
}
.div-z-table-col{
  float:left;/*fix for  buggy browsers*/
  display:table-column;         
  width:120px;         
  background-color:#fff;  
  font-size: 10px;
  border:1px solid  #666666;         
  padding: 3px;
}


/* RESZPONZIV ADAT TÁBLÁZAT */
/*
:root {
	--tab-border-color: red;
	--tab-cell-color-1: white;
	--tab-cell-color-2: #f0f0ff;
	--tab-border-size: 1px;
	
	
	--tab-head-bg: #f0333b;
	--tab-head-color: #fff;
	--tab-caption-color: #444;
	--tab-cell-color: #444;
	--tab-cell-bg: #eee;
	--tab-border-color: #aaa;
}
*/



table.rtab {
	
	font-weight: 100;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	
	margin: 0 auto;
	border-collapse: collapse;
	background: #f0333b;
	color: #fff;
	text-rendering: optimizeLegibility;
	border-radius: 5px; 
}
table.rtab caption { 
	color: #444;
	margin: 1rem;
}
table.rtab thead th {
	border-radius: 5px;
	}
table.rtab thead th, table.rtab tbody td {
	padding: .8rem;
	font-size: 15px;
}
table.rtab tbody td { 
	padding: .8rem;
	color: #444;
	background: #eee; 
}
table.rtab tbody tr:not(:last-child) { 
	border-top: 1px solid red;
	border-bottom: 1px solid red;
}


@media screen and (max-width: 599px) {
	table.rtab thead {
		display: none;
		}
	table.rtab tbody td { 
		display: block;
		padding: .6rem; 
	}
	table.rtab tbody tr td:first-child { 
		background: #f0333b;
		color: #fff;
	}
	table.rtab tbody td:before {
		content: attr(data-th); 
		font-weight: bold;
		display: inline-block;
		width: 6rem;
	}
	table.rtab td {
		text-align: left !important;
		}
}