@charset "UTF-8";

@font-face {
  font-family: 'Open Sans';
  src:  url('../fonts/OpenSans-Regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Open Sans Bold';
  src:  url('../fonts/OpenSans-Bold.woff2') format('woff2');
}

html {
	font-size: 10px;
}

body {
  margin: 0;
}

.content {
	padding-bottom: 8rem;
}

table {
	border-collapse: collapse;
	width: 100%;
	font-family: "Open Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	border-top: 0px solid #CCC;
}
thead th, ol {
	font-family: "Open Sans Bold", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}
td, th {
	padding: 0.5em 1em ;
	text-align: left;

}
th:first-child {
	padding-left: 1em;
}
/*
th:last-child, td:last-child {
	padding-right: 1em;
}
*/

td {
	border-bottom: 0px solid #CCC;
}


tr {
	border-bottom: 1px solid #CCC;
}
a {
  color: black;
}

thead th {
  border-bottom: 2px solid rgba(249, 66, 58, 1);
  font-size: 19px;
}

tbody th {
  font-size: 17px;
}

tbody td span, li{
  font-weight: 400;
  font-size: 17px;
}

td, th {vertical-align: top;}
ul {margin-top: 0;
	padding-left:20px}

/* tablet */
@media screen and (min-width: 768px) and (max-width: 903px) {

  thead th {
    font-size: 17px;
  }
  tbody th, tbody td span, ol, li {
    font-size: 16px;
  }

}

/* smart phone */
@media screen and (max-width: 767px) {
  th {
    font-family: "Open Sans Bold", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	 border-bottom: medium solid rgba(249, 66, 58, 1);
  }

	table, tbody, tr {
		display: block;
	}
	thead {
		display: none;
	}
	thead th, th, td {
  	border-bottom: 0px solid #fff;
	}
	table {
	border-top: 1px solid #CCC;
	}
	/*
	tr:first-child {
		border-top: 1px solid #CCC;
	}
	*/
	tr:last-child {
		border-bottom: 1px solid #CCC;
		padding: 0em;
	}
	th::before {
		content: "Kanal: ";
	}

	tbody th {
		display: block;
	}

	td {
		display: inline-block;
		min-width: 80%;
		padding: .4em 1em 1em 1em;
		text-align: left;
		font-weight: bold;
	}

  	tbody th {
    font-size: 15px;
  }

  tbody td, tbody td span, ol, li {
    font-size: 14px;
  }

}


@media screen and (max-width: 330px) {
	td {
		display: block;
	}
	tr {
		padding: .5em .5em 1em;
	}
}

/* desktop */

@media screen and (min-width: 904px) {
	body {
		font-size: 2.2rem;
	}
}

/* tablet */
@media screen and (min-width: 768px) and (max-width: 903px) {
	body {
		font-size: 1.7rem;
	}
	table {
		max-width: calc(100% - 120px);
		margin-left: 60px;
        margin-right: 60px;
	}
	.content {
		padding-bottom: 6.5rem;
	}
}

/* mobile */
@media screen and (min-width: 0px) and (max-width: 767px) {
	body {
    	font-size: 1.5rem;
  	}
	table {
		max-width: calc(100% - 4.4rem);
		margin-left: 2.2rem;
        margin-right: 2.2rem;}
	.content {
	padding-bottom: 6rem;
}
}