/* --- modal info --- */
#cdt-modal-working {
	animation-iteration-count: 2; 
}
/* --------------------------------------------------------
         page 
   -------------------------------------------------------- */
h1 {
    color: #105894;
}
h2 {
    color: #105894;
}
section {
	margin-top: 34px;
}
#competition-name {
	font-size: 24px;
	font-weight: bold;
	color: #105894;
}
#competition-info {
	display: none;
}
#doc-title {
	font-weight: bold;
	text-align: center;
}
#content {
	padding: 20px;
	background-color: #ffffff;
}
/* -- expiry message ---------- */
.message {
	max-width: 450px;
	margin: 50px auto 50px auto;
	padding: 40px 20px;
	text-align: center;
	background-color: #e0e0e6;
	border: 1px solid #999999;
}
#msg1 {
	font-size: 1.1rem;
	color: #dd0000;
	font-weight: bold;
}

/* -------------------------------------------------------- 
      delegate
   -------------------------------------------------------- */
#delegate-account {
	color: #003874;
	background-color: #eaeaea;
	background-image: url("img/bkg-metal-01b.jpg");
}
#delegate-title {
	margin-top: 15px;
	margin-bottom: 30px;
	font-size: 1.2rem;
	font-weight: bold;
	color: #105894;
}
.dlg-label-1, .dlg-label-2 {
	display: inline-block;
}
.dlg-text-1, .dlg-text-2 {
	margin-bottom: 6px !important;
}

/* --------------------------------------------------------
      participants table
   -------------------------------------------------------- */
table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 25px;
}
.header-name-1 {
	max-width: 180px;
	margin: auto;
	text-align: left;
}
.header-name-2 {
	max-width: 125px;
	margin: auto;
	text-align: left;
}
/* -- table header -------------------------- */
.proba {
	min-width: 55px;
}
/* -- table rows ---------------------------- */
.participant-row {		/*   by default    */
	display: none;		/* rows are hidden */
}
td {
	text-align: center;
	padding: 3px 0;
}
.nr-crt {
	display: inline-block;
	text-align: center;
}
.btn-toggle {
	display: none;
}
/* -- size of input fields ------------------ */
input {
	max-width: 150px;
}
/* .captlz { text-transform: capitalize; } */
.f-text {
	max-width: 180px;
}
.l-text {
	max-width: 125px;
	margin-left: 1px;
}
.g-text {
	max-width: 30px;
	text-align: center;
	text-transform: uppercase;
}
.y-text {
	max-width: 50px;
	text-align: center;
}
.age-text {
	display: inline-block;
	width: 20px;
	padding-right: 4px;
	text-align: center;
}
.pb-text {
	max-width: 80px;
	text-align: center;
}
/* ------------- */
.ev-data {
}
/* -----------------------------------------
      under table
   ----------------------------------------- */
/* -- table controls ---------- */
#table-controls {
	height: 35px;
	margin-right: 3px;
}
.table-btn {
	float: right;
	width: 65px;
	margin-left: 10px;
} 
/* -- anti robot -------------- */
.proof-nr {
	max-width: 40px;
	text-align: center;
}

/* ===================================================================================
 *   desktop
 * =================================================================================== */
@media screen and (min-width: 1211px) and (max-width: 1330px) {
	.col-nr { display: none; }
	.pt-age { display: none; }
}
@media screen and (min-width: 1211px) {
	#content {
		box-shadow: 0px 3px 6px 4px #c9c9c9;
		border-top: 6px solid #2068a4;
		border-bottom: 6px solid #2068a4;
	}
	#competition-name {
		margin-top: 20px;
		text-align: center;
	}
	#competition-info {
		position: absolute;
		top: 20px;
		right: 30px;
		display: block;
		text-align: right;
	}
	#info-deadline {
		font-size: 15px;
		font-style: italic;
	}
	#doc-title {
		margin-top: 10px;
		font-size: 22px;
	}
	/* ------------------------------
	 *  desktop - delegate
	 * ------------------------------ */
	#delegate-account {
		margin-bottom: 35px;
		padding-top: 10px;
		padding-bottom: 35px;
		border-width: 1px;
		border-style: solid;
		border-color: #d6d6d6 #bbbbbb #bbbbbb #d6d6d6;
	}
	#delegate-title {
		margin-left: 20px;
	}
	#delegate-1 {
		vertical-align: top;
		display: inline-block;
		width: 400px;
		margin-left: 20px;
	}
	#delegate-2 {
		vertical-align: top;
		display: inline-block;
		width: 300px;
		margin-left: 30px;
	}
	.dlg-label-1 {
		min-width: 108px;
	}
	.dlg-label-2 {
		min-width: 68px;
	}
	.dlg-text-1 {
		min-width: 270px;
	}
	.dlg-text-2 {
		min-width: 210px;
	}
	/* ------------------------------
	 *  desktop - participants table
	 * ------------------------------ */
	table {
		border-left: 1px solid #cccccc;
		border-right: 1px solid #cccccc;
	}
	th {
		font-weight: normal;
		color: #003874;
		background-image: url("img/bkg-metal-01a.jpg");
		padding: 6px 0 4px 0;
		border-top: 1px solid #f9f9f9;
		border-bottom: 1px solid #999999;
	}
	tr:nth-child(even) {
		background-color: #e9e9e9;
	}
	tr:nth-child(odd) {
		background-color: #f3f3f3;
	}
	.narrow-screen {
		display: none;
	}
	/* ------------------------------
	 *  desktop - under table
	 * ------------------------------ */
	.validation {
		margin-left: 5px;
	}
	#register {
		margin-left: 5px;
	}
}
/* ===================================================================================
 *   mobile / tablet
 * =================================================================================== */
@media screen and (max-width: 1210px) {
	#content {
		padding: 10px;
	}
	h2 {
		margin-left: 10px;
	}
	header {
		min-height: 0;
	}
	#competition-name {
		text-align: center;
		margin-top: 10px;
		padding: 10px;
	}
	#doc-title {
		font-size: 18px;
	}
	/* -------------------------
	 *  mobile - delegate
	 * ------------------------- */
	#delegate-account {
		margin-top: 20px;
		margin-bottom: 50px;
		padding-top: 20px;
		border-bottom: 1px solid #999999;
	}
	#delegate-title {
		margin-left: 10px;
	}
	#delegate-1, #delegate-2 {
		width: 100%;
		margin-left: 0;
		margin-bottom: 30px;
	}
	.dlg-label-1, .dlg-label-2 {
		margin-left: 10px;
		min-width: 110px;
	}
	.dlg-text-1, .dlg-text-2 {
		min-width: 270px;
	}
	/* -----------------------------
	 *  mobile - participants table
	 * ----------------------------- */
	.wide-screen {
		display: none;
	}
	.narrow-screen {
		display: inline-block;
	}
	.m-label {
		min-width: 110px;
	}
	.m-proba {
		position: relative;
		bottom: 3px;
		min-width: 90px;
		margin-left: 20px;
		text-align: center;
	}
	table {	display: block; }
	thead { display: none;  }
	th    {	display: none;  }
	tbody {	display: block; width: 100%}
	/* -- <tr> -------------------------- */
	.participant-row:first-child {
		border-top: 1px solid #cccccc;
	}
	.participant-row:nth-child(odd) {
		background-color: #e0e0e3;
		border-bottom: 1px solid #9d9d9d;
		
	}
	.participant-row:nth-child(even) {
		background-color: #ececee;
		border-bottom: 1px solid #d6d6d9;
	}
	/* -- <td> -------------------------- */
	td {
		display: inline-block;
		text-align: left;
		min-width: 200px;
		padding-left: 10px;
	}
	td:first-child {
		margin-top: 10px;
	}
	td:nth-child(1), td:nth-child(2), td:nth-child(3),
	td:nth-child(4), td:nth-child(5), td:nth-child(6) {
		display: block;
	}
	.age-text {
		margin-left: 6px;
	}
	td:last-child {
		margin-bottom: 30px;
	}
	.ev-data {
	}
	.pb-data {
		display: block;
	}
	/* -- inside <td> ------------------- */
	.pt-label {
		margin-top: 5px;
	}
	.nr-crt {
		width: 24px;
		height: 24px;
		margin-left: 5px;
		padding: 8px 3px 1px 3px;
		text-align: center;
		vertical-align: middle;
		background-color: #c6bfbf;
		border-radius: 5px;
	}
	/*
	.btn-toggle {
		display: inline-block;
		float: right;
		width: 24px;
		height: 24px;
		margin-right: 25px;
		padding: 3px 3px 3px 3px;
		text-align: center;
		vertical-align: middle;
		background-color: #7bc3f3;
		border-width: 1px;
		border-style: solid;
		border-color: #a6dbff #429bd5 #429bd5 #a6dbff;
		border-radius: 5px;
		cursor: default;
	}
	.btn-toggle:hover {
		background-color: #6cb8ea;
	}
	.btn-toggle:active {
		background-color: #5faee2;
		border-color: #429bd5 #a6dbff #a6dbff #429bd5;
	}
	*/
	/* -- <input> ----------------------- */
	.f-text, .l-text {
		max-width: 200px;
	}
	input[type=checkbox] {
		width: 25px;
		height: 25px;
	}
	
	/* -- table controls ---------------- */
	#table-controls {
		margin-right: 15px;
	}
	.validation {
		margin-left: 20px;
	}
	#register {
		margin-left: 20px;
	}
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 800px) {
	#content {
		max-width: 100%;
		padding: 0;
	}
	#competition-name {
		margin-top: 0;
	}
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 600px) {
	.dlg-text-1, .dlg-text-2,
	.f-text, .l-text {
		min-width: calc(100vw - 160px);
	}
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 500px) {
	.message {
		margin: 50px 10px; 
	}
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 430px) {
	td { min-width: 170px; }
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 386px) {
	.dlg-text-1, .dlg-text-2 {
		margin-left: 10px !important;
	}
}