@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300i,700&display=swap&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Amatic+SC:400,700&display=swap&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Abhaya+Libre:400,500,600,700,800&display=swap&subset=latin-ext');

html {
	
}

body {
	margin:0px;
	font-family: 'Abhaya Libre', serif;
	max-width: 100%;
	text-align: center;
	overflow-x: hidden;
	font-size: 1.2em;
}

h1 {
	color: #f08300;
	font-size: 200%;
	margin-top: 0px;
	margin-bottom: 30px;
	font-family: 'Amatic SC', cursive;
}

h2 {
	font-size: 200%;
	margin-top: 0px;
	margin-bottom: 30px;
	text-align: left;
}

h3 {
	font-size: 2rem!important;
}

h4 {
	font-size: 2rem!important;
}

h5 {
	font-size: 1.75rem!important;
}

h2, h3, h4, h5 {
	color: #f08300;
	font-family: 'Amatic SC', cursive;
}

h2:nth-child(2n+0),h3:nth-child(2n+0),h4:nth-child(2n+0),h5:nth-child(2n+0) {
	color:rgb(4, 175, 181);
}

h2:nth-child(3n+0),h3:nth-child(3n+0),h4:nth-child(3n+0),h5:nth-child(3n+0) {
	color:rgb(16, 190, 122);
}

p {
	margin-top: 0px;
	margin-bottom: 20px;
}

a {
	color: #f08300;
	text-decoration: none;
}

ul {
	box-sizing: border-box;
}

.modal {
	z-index: 11111;
}

#wrapper {
	background:#fff;
}

#entry a:hover {
	text-decoration: underline;
}

#bread {
	display: block;
	width: 98%;
	max-width: 1300px;
	margin: 0 auto; 
	border-bottom: 1px solid #003f77;
}

#header {
	display: table;
	width: 100%;
	margin: 0px auto;
}

#logo {
	display: table-cell;
	width: 30vw;
	vertical-align: middle;
	height: 241px;
	background:rgba(255,255,255,0.6);
}

#logo img {
	max-height: 90%;
	max-width: 90%;
}

#headSlider {
	display: inline-block;
	width:50%;
}

#headSlider div {
	width: 50%;
	height: 300px;
}

#entryHolder {
	display: table;
	width: 100%;
	padding: 30px 0;
}

#entry {
	display: table-cell;
	vertical-align: top;
	width: 75%;
	text-align: left;
	font-size: 130%;
	box-sizing: border-box;
	padding: 0px 20px;
}

#sidebar {
	display: table-cell;
	vertical-align: top;
	width: 25%;
	min-width: 300px;
}

.sBlock {
	box-sizing: border-box;
	padding: 0 20px;
	margin-bottom: 50px;
}

.sBlock img {
	max-width: 80%;
}

#sb-1 h2 {
	margin-bottom: 10px;
}

#footer {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

#footer div {
	padding: 20px;
	font-size: 160%;
	font-weight: bold;
	color: #f08300;
	font-family: 'Amatic SC', cursive;
	display: grid;
	align-items: center;
}

#footer div a {
	color: #003f77;
	text-decoration: none;
}

#deadlineGrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
	grid-template-rows: 150px;
	align-items: center;
	grid-gap: 10px;
	text-align: center;
	padding-left: 0px;
}

#deadlineGrid li {
	list-style: none;
	height: 240px;
	font-size: 140%;
	font-weight: bold;
	align-items: center;
	display: grid;
	font-family: 'Amatic SC', cursive;
	color: #f08300;
	border: 2px solid #003f77;
	padding: 10px;
	cursor: crosshair;
	transition: background-color 0.3s ease;
}

#deadlineGrid li:hover {
	background-color: #eee;
	transition: background-color 0.3s ease;
}

#deadlineGrid b {
	display: block;
	font-size: 130%;
}

.imgRight {
	float:right;
	margin-left: 20px;
}

.imgLeft {
	float:left;
	margin-right: 20px;
	shape-outside: circle();
	-webkit-shape-outside: circle();
}

#entry img {
	max-width: 100%;
}

.dpcsLink {
	display: block;
	text-align: center;
	background-color: #f08300;
	color: #fff;
	text-decoration: none;
	box-shadow: 2px 2px 1px grey;
	padding: 10px;
	width:80%;
	margin: 10px 10%;
	box-sizing: border-box;
	text-transform: uppercase;
	font-size: 170%;
	font-weight: bold;
	font-family: 'Amatic SC', cursive;
	transition: letter-spacing 0.3s ease, box-shadow 0.3s ease, width 0.3s ease, margin 0.3s ease;
}

.dpcsLink:hover {
	text-decoration: none!important;
	box-shadow: 3px 3px 5px #333;
	width:90%;
	margin: 10px 5%;
	letter-spacing: 0.05em;
	transition: letter-spacing 0.3s ease, box-shadow 0.3s ease, width 0.3s ease, margin 0.3s ease;
}

.supporters {
	padding: 0px;
}

.supporters li {
	background-color: #eee;
	margin-bottom: 15px;
	padding:5px 10px;
	box-decoration-break: clone;
}

.committee {
	box-sizing: border-box;
	padding-left: 5px;
}

.committee li {
	background-color: #eee;
	margin-bottom: 3px;
	padding:5px 10px;
	box-decoration-break: clone;
	list-style: none;
}

/* --- Slides --- */

.slide-1 {
	background:url('../img/slider_01.jpg');
	width: 70vw;
    height: 241px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}

/* --- Slider --- */

.bx-wrapper {
	border:0px none !important;
	margin-bottom:0px !important;
	width: 60%;
	display: table-cell;
	box-shadow: 0px 0px 0px !important;
	background:transparent!important;
}

#sidebar .bx-wrapper {
	width: 300px;
	max-width: 100%!important;
}

.bx-wrapper div {
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}

.logoSlider img {
	margin: 0 auto;
}

#sb-2 h2 {
	margin-bottom: 10px;
}

.dateSlider b {
	display: block;
	text-align: center;
	font-size: 600%;
	line-height: 1em;
	color: #f08300;
	font-family: 'Amatic SC', cursive;
	}

.dateSlider i {
	display: block;
	text-align: center;
	font-size: 250%;
	line-height: 1em;
	font-style: normal;
	font-weight: bold;
	color: #f08300;
	font-family: 'Amatic SC', cursive;
	}

.dateSlider u {
	display: block;
	text-align: center;
	font-size: 250%;
	line-height: 1em;
	text-decoration: none;
	margin-bottom: 10px;
	font-weight: bold;
	color: #f08300;
	font-family: 'Amatic SC', cursive;
	}

.dateSlider span {
	display: block;
	text-align: center;
	font-size: 180%;
	line-height: 1em;
	font-weight: bold;
	margin-bottom: 20px;
	font-family: 'Amatic SC', cursive;
	}

#sb-1 a:not(.bx-next):not(.bx-prev) {
	text-decoration:none;
	font-family: 'Amatic SC', cursive;
	margin: 0px auto;
	line-height: 1em;
	font-size: 200%;
	color:#fff;
	font-weight: bold;
	padding:5px 10px;
	background-color: #f08300;
}

.bx-wrapper .bx-prev,
.bx-wrapper .bx-next {
	opacity: 0.4;
	transition: opacity 0.3s ease;
}

.bx-wrapper:hover .bx-prev,
.bx-wrapper:hover .bx-next {
	opacity: 1;
	transition: opacity 0.3s ease;
}


#sb-0 {
	font-family: 'Amatic SC', cursive;
	font-size: 200%;
	font-weight: bold;
	color: #f08300;
	border:2px solid #003f77;
	padding:0px 20px 20px 20px;
	box-sizing: border-box;
	margin-bottom: -15px
}

#countbox1 {
	font-size: 250%;
}

#dateDrop {
	text-align: left;
	margin-bottom: 20px;
}

#dateDrop img {
	width: 50%;
	max-width: 200px;
}

/* --- Menü --- */

#navigation {
	font-family: 'Amatic SC', cursive;
	font-weight: bold;
	font-size: 140%!important;
	border-top:2px solid #003f77;
	border-bottom:2px solid #003f77;
}

.dropdown-menu {
	font-size: 1em;
}

#top-logo {
	width:20%;
	height: 50px;
	float:left;
	min-width: 150px;
}

#top-logo a {
	width:20%;
	height: 50px;
	min-width: 150px;
	font-weight: 700;
	letter-spacing: 0.0em;
	font-size: 170%;
	text-decoration: none;
	color:#003f77;
	background-color: #fff;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

#top-logo a span {
	color:#f08300;
}

#top-menu {
	display: block;
	float:right;
	width:80%;
}

#top-menu ul {
	list-style: none;
	padding-left: 0px;
	margin:0px;
}

span.dropDown {
	position: relative;
	margin-left:10px;
	width: 30px!important;
}

#top-menu li.has-child ul {
	display: none;
}

#top-menu li.has-child ul.show {
	display: table;
	position: absolute;
	width: 26.65%;
	border:2px solid #003f77;
	box-sizing: border-box;
	background-color: white;
}

#top-menu li.has-child ul.show li {
	display: table-cell;
	width: 100%;
	background-color: #fff;
	*margin: 5px 0;
}

#top-menu li.has-child ul.show li a {
	font-size: 120%;
}

#top-menu li {
	display: block;
	width:33.333333%;
	min-width: 150px;
	float:left;
}

#top-menu li a {
	background-color: #fff;
	height: 50px;
	display: table-cell;
	text-align: center;
	width: 100vw;
	text-decoration: none;
	font-size: 130%;
	color:#003f77;
	vertical-align: middle;
}

#top-menu li a:hover,
#top-menu li a.active,
#top-menu li.active a.has-child {
	color:#fff;
	background-color: #003f77;
	cursor: pointer;
}

 #toggleButton {
    display: none;
  }




 /* Gombok */

.button {
	border-radius: 15px;
	padding:20px 20px !important;
	box-sizing: border-box;
	text-decoration: none;
	text-transform: uppercase;
	transition: letter-spacing 0.4s ease;
	position: relative;
	margin: 20px 0;
	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;
	color: white;
}

.button:hover {
	text-decoration: none;
	letter-spacing: 0.1em;
	transition: letter-spacing 0.4s ease;
	color: white;
}

.full-width {
	display: block!important;
	text-align: center;
}

.half-width {
	display: block!important;
	text-align: center;
	width:50%;
	float: left;
}

.half-width.btn-first {
	border-radius: 10px 0 0 10px!important;
}

.half-width.btn-last {
	border-radius: 0 10px 10px 0!important;
}

.bg-mediumseagreen {
	background-color: #3CB371!important;
}

.bg-indianred {
	background-color: #CD5C5C!important;
}

.bg-steelblue {
	background-color: #4682B4!important;
}

.bg-isirgreen {
	background-color: #2e4e53!important;
}

.bg-isirgreen a {
	font-size: 22pt!important;
	transition: letter-spacing 0.3s ease;
}

.bg-isirgreen a:hover {
	letter-spacing: 0.1em!important;
	transition: letter-spacing 0.3s ease;
}


.bg-orange  {
	background-color: orange !important;
}
.disabled {
	cursor: not-allowed;
	opacity: 0.5;
}

.disabled:hover:after {
	display: block;
	position: absolute;
	width: auto;
	height:auto;
	content: 'Coming soon...';
	background-color:#fff;
	color: #555;
	border:1px solid #555;
	box-shadow:2px 2px 5px #888; 
	padding:5px 10px;
	opacity:1!important;
	letter-spacing: 0em;
	bottom: -30px;
	right: 30px;
}

.button strong {
	display: block;
	line-height: 1.2em;
}

.button i {
	display: block;
	text-transform:lowercase;
	font-size: 80%;
	line-height: 1.2em;
}

.btn {
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
border-radius: 6px;
}

/* Táblázat */

.regtable {
	display: inline-block;
    text-align: center;
    border: 1px solid #003f77;
	box-shadow: 3px 3px 5px #ccc;
	margin: 10px auto 30px auto;
	table-layout: fixed;
	max-width: 90%;
}

.regtable tr:first-child td {
	background-color: #003f77;
	color: white;
}

.regtable tr:last-child td {
	background-color: #f1f1f1;
	border-bottom:0px;
}





.regtable td:nth-child(1) {
	width:40%!important;
	padding: 10px;
	text-align: left;
	border-bottom: 1px solid #003f77;;
}

.regtable td:nth-child(2) {
	width:30%!important;
	padding: 10px;
	border-bottom: 1px solid #003f77;;
}

.regtable td:nth-child(3) {
	width:30%!important;
	padding: 10px;
	border-bottom: 1px solid #003f77;;
}

.nav-tabs a {
	background:#ddd;
	color:#000;
}

.modal-body p {
	margin: 20px 0;
	font-size: 14pt;
}

.subscribe {
	display: inline-block;
	background-color: #fff;
	color: rgba(46,78,73,1)!important;
	padding: 15px 10px!important;
	font-size: 16pt;
	margin: 20px 0;
	clear: both;
}

.subscribe:hover {
	background-color: rgba(255,255,255,0.8)!important;
	text-decoration: none;
}

hr {
	color: #003f77;
}


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

  body {
  	padding-top: 80px;
  }

  #navigation {
  	position: sticky;
  	top: 0px;
  	background: white;
  	font-size: 2rem!important;
  	z-index: 17;
  }

  .bi-filter-square-fill::before {
  	font-size: 2rem!important;
  	color: #f08300;
  }


  #top-menu {
  	width: 100%;
  	padding: 0;
  	box-sizing: border-box;
  	box-shadow: 0px 5px 5px #003f77;
  }

  #topMenu {
  	width:100%;
  	display: none;
 . }

  #topMenu.show {
  	display: table;
  	width:100%;
  }

  #toggleButton {
    display: block;
    background-color: #003f77;
	height: 50px;
	display: table-cell;
	text-align: left;
	width: 100%;
	text-decoration: none;
	font-size: 130%;
	color:#fff;
	vertical-align: middle;
	cursor: pointer;
	padding-left: 2vw;
  }

  #toggleButton span {
	margin:0 2%;
	width: 100%;
	font-weight: bold;
  }

  #top-logo {
	width:100%;
	background-color: #fff;
	display: table-row;
	padding: 0	2%;
	box-sizing: border-box;
  }

#top-logo a {
	width:100%;
	text-align: left;
}

#top-menu li {
	display: block;
	float:none;
	width: 100%;
	text-align: left;
	padding-left: 2%: 
}

#top-menu li a {
	text-align: left;
	width: 100vw;
	padding:0 2vw;
	box-sizing: border-box;
}

#top-menu a {
	text-align: left;
}

#top-menu a.has-child {
	font-weight: bold;
}

#top-menu li.has-child ul {
	display: table;
	position: relative;
	width: 100%;
	box-sizing: border-box;
	padding-left: 30px;
	overflow-y: scroll;
}

#top-menu li.has-child ul li {
	display: table-row;
	width: 100%;
}

#top-menu li.has-child ul.show {
	display: none;
}

#top-menu li.active a.has-child {
	background:#fff;
	color: #003f77;
}

.hButton {
	display: none;
}

#hButtons {
	grid-template-columns: 1fr;
}

.hDate {
	text-align: left;
}

.hDate span {
	float: right
}

  .regtable td,
  .regtable td:nth-child(1),
  .regtable td:nth-child(2),
  .regtable td:nth-child(3) {
  	display: block;
  	width: 100% !important;
  	text-align: center;
  }

  .regtable tr:first-child {
  	display: none;
  }

  .regtable td:nth-child(2):before {
  	content: 'Early fee';
  	display: block;
  	font-size: 80%;
  }

  .regtable td:nth-child(3):before {
  	content: 'Late fee';
  	display: block;
  	font-size: 80%;
  }

  .button {
  	font-size: 80%;
	line-height: 1.4em !important;
  }

  .button:hover {
  	letter-spacing: 0.03em;
  }

  break {
  	display:block;
  }

}

/* --- dropdown --- */

#dropdown h3 {
	display: block;
	background-color: #f08300;
	color:white;
	padding:5px 10px;
	box-sizing: border-box;
	cursor: pointer;
}

#dropdown div.tab {
	display: none;
	padding:5px 10px;
	box-sizing: border-box;
}

#dropdown div.tab h4 {
	margin-top: 0px;
}

/* --- 750px alatti megjelenés --- */

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

	.slide-1 {
	width: 100vw;
	}

	#entryHolder {
		display: block;
		width: 100%;
	}
	#entry {
		display: block;
		width: 100%;
	}

	#sidebar {
		display: block;
		width: 100%;
	}

	#sidebar .bx-wrapper {
		max-width: 100%!important;
	}

	.bx-wrapper {
	box-sizing: border-box!important;
	width: 100%;
	display: block;
	max-width: 100%!important;
	}

	#header {
	display: block;
	width: 100%;
	margin: 0px auto 10px;
}

#logo {
	display: inline-block;
	width: 100%;
	align-items: center;
	height: 33vw;
	margin-bottom: 20px;
	background:rgba(255,255,255,0.6);
	min-width: auto!important;
	padding-top: 20px;
}

#logo img {
	max-height: 30vw!important; 
	max-width: 90%!important;
	margin: 10px 0 10px 2vw;
}

body {
	padding-top: 0px!important;
}

.hDate {
	font-size: 100%;
}

#headSlider {
	display: inline-block;
}

#headSlider div {
	height: 210px;
	background-position: center center;
}

#topMenu {
	background-color: #fff;
	color:#003f77;
}

}

#logoSlider img {
	max-height: 150px;
}

.suppOrg .slide {
	display: inline-block;
	width: 200px;
	height: 200px;
	padding: 25px;
	text-align: center;
	box-sizing: border-box;
}

.organiserLogo {
	width: 300px !important;
	height: 300px !important;
}

.organiserLogo a {
	width: 250px !important;
	height: 250px !important;
}

.organiserLogo img {
	max-width: 250px !important;
	max-height: 250px !important;
}

.suppOrg .slide a {
	display: block;
	width: 150px;
	height: 150px;
	text-align: center;
}

.suppOrg .slide img {
	display: block;
	max-width: 150px;
	max-height: 150px;
	text-align: center;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

.suppOrg {
	text-align: center!important;
}

#coronavirus {
	width:99vw;
	margin: 1vh 0.5vw!important;
	position: fixed;
	background: rgba(0,0,0,0.85);
	color:#fff;
	top: 0px;
	z-index: 9999999;
	display: block;
	font-size: 2.5vw;
	font-weight: bold;
	padding: 10vw!important;
	box-sizing: border-box;
	min-height: 98vh;
}

#coronavirus p {
	margin-bottom: 0px;
}

#coronavirus close {
	position: absolute;
	top:1vw;
	right: 2vw;
	font-family: sans-serif;
	cursor: pointer;
}

.text-warning {
	color:#f08300!important;
}

.bg-warning {
	background-color:#f08300!important;
}

.text-blue {
	color:#003f77!important;
}

.bg-blue {
	background-color: #003f77!important;
}

.dropdown-item.active,
.dropdown-item:active,
.nav-link.active,
.nav-link:active,
.nav-item.active > a,
.nav-item:active >  a {
	background-color: #003f77!important;
	color: #fff!important;
}

.zoom {
	transition: all 1s ease;
}

.zoom:hover {
	transform: scale(1.1);
	transition: all .5s ease;
	box-shadow: 2px 2px 1rem #bbb;
}