* {
margin:0;
padding:0;
outline:none;
box-sizing:border-box;
}

html {
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
}

body {
font-family: 'Roboto Mono', sans-serif;
background:#fff;
min-height:100%;
height: 100%;
position:relative;
}

#pageBody {
position:relative;
}

.container {
max-width:1140px; 
margin:0 auto;
position:relative;
}

a { text-decoration:none; }
img { border:none; }
.left { float:left; }
.right { float:right; }
.clear { clear:both; }
at:before { content:"@"; }


/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

header {
width:100%;
height:100px;
position:absolute;
z-index:9999;
top:0;
left:0;
}

header .logo {
position:absolute;
bottom:23px;
left:40px;
height:auto;
width:200px;
}

header nav {
position:absolute;
bottom:20px;
right:100px;
height:40px;
display:flex;
gap:40px;
}

header nav a {
display:block;
font-size:14px;
line-height:40px;
color:#fff;
font-weight:300;
text-transform:uppercase;
letter-spacing:1px;
transition: all 0.5s ease;
}

header nav a:hover {
color:#FFC60A;
}

/* Content */



section {
padding:100px;
}

section p {
font-size:16px;
line-height:26px;
font-weight:300;
margin: 0 0 40px;
color:#222;
}

section ul {
font-size:22px;
line-height:32px;
font-weight:300;
margin: 0 0 40px;
color:#222;
}

section p b,section ul b {
font-weight:700;
}

section h3 {
font-size:40px;
line-height:50px;
font-weight:700;
margin: 0 0 40px;
color:#FFC60A;
font-family: "Roboto";
}

section h4 {
font-size:30px;
line-height:40px;
font-weight:300;
margin: 0 0 40px;
color:#111;
}



/* banner */

.banner {
position:relative;
background-image:url(../img/banner-bk.jpg);
background-position:center;
background-size:cover;
background-repeat:no-repeat;
height:100vh;
padding:0;
}

.banner:after {
position:absolute;
background: linear-gradient(to top, transparent 0%, black 100%);
display:block;
width:100%;
height:100%;
content:"";
z-index:10;
top:0;
left:0;
}

/*.banner:before {
position:absolute;
background-image:url(../img/tread.svg);
background-position:center;
background-size:contain;
background-repeat:no-repeat;
display:block;
width:20%;
height:100%;
content:"";
z-index:10;
top:0;
right:0;
}
*/
.banner .container {
height:100%;
max-width:1290px;
}

.banner .bannerContainer {
position:absolute;
top:60%;
transform:translateY(-60%);
width:70%;
left:20px;
color:#fff;
z-index:20;
}

.banner .bannerContainer h1 {
font-size:50px;
line-height:60px;
text-transform:uppercase;
font-weight:700;
margin: 0 0 20px;
color:#FFC60A;
font-family: "Roboto";

}

.banner .bannerContainer h4 {
font-size:22px;
line-height:28px;
font-weight:300;
margin: 0 0 20px;
color:#fff;
}

.banner .bannerContainer p {
font-size:22px;
line-height:28px;
font-weight:300;
margin: 0 0 20px;
color:#fff;
}

.banner .bannerContainer p b,
.banner .bannerContainer p a {
font-weight:900;
color:#FFC60A;
}

.banner .bannerContainer .bannerInfo {
display:flex;
align-items:center;
margin:40px 0 0;
gap:20px;
}

.banner .bannerContainer .bannerInfo .bannerInfoContainer {
display:flex;
align-items:center;
gap:20px;
}



.banner .bannerContainer .bannerInfo .bannerInfoContainer>i {
font-size:36px;
color:#FFC60A;
display:block;
}

.banner .bannerContainer .bannerInfo p {
padding-right:30px;
font-weight:700;
margin:0;
}

.banner .bannerContainer .bannerInfo p i {
font-weight:300;
font-style:normal;
display:block;
}

.banner .bannerContainer p.footnote {
font-size:16px;
font-style:italic;
}

/* Countdown */

.countdownWrapper {
background:#FFC60A;
padding:40px;
}

.countdownWrapper p {
color:#111;
text-align:center;
margin:0 0 40px;
}

.countdownWrapper ul {
margin:0 auto;
display:flex;
gap:10%;
justify-content:center;
list-style:none;
}

.countdownWrapper ul li {
text-align:center;
font-size:18px;
color:#111;
font-weight:300;
text-transform:uppercase;
}

.countdownWrapper ul li span {
font-size:80px;
width:160px;
border-radius:50%;
background:#111;
color:#fff;
height:160px;
line-height:160px;
margin:0 0 10px;
font-weight:700;
display:block;
}

/* Purchase form */
.ticket-form {
    margin: 40px 0 20px;
}

.ticket-form .purchase-button {
display: block;
line-height:60px;
padding: 0 40px;
background-color: #FFC60A;
color: #111;
font-size:22px;
font-weight:300;
border-radius:30px;
border: none;
cursor: pointer;
transition: all 0.5s ease;
font-family: 'Roboto Mono', sans-serif;

}

.ticket-form .purchase-button:hover {
background-color: #222;
color:#FFC60A;
}


section#purchase-form {
background:#f5f5f5;
}

.formSection, .terms, .termsContainer, .result {
background:#fff;
border-radius:10px;
padding:40px;
margin:0 0 10px;
}

.formSection h4 {
font-size:16px;
line-height:20px;
margin:0 0 20px;
color:#111;
font-weight:600;
}

.formSection p {
font-size:16px;
margin:0;
}
.formSection p a {
color:#FFC60A;
}

.formSection label {
font-size:13px;
margin:0 0 5px;
color:#888;
display:block;
}

.formSection label[for='invoice-checkbox'] {
display:inline-block;
}


.formSection input[type=text],
.formSection input[type=email],
.formSection input[type=number],
.formSection input[type=tel] {
font-size:16px;
line-height:50px;
margin:0 0 10px;
color:#111;
display:block;
border-radius:10px;
font-family: 'Ubuntu Sans', sans-serif;
background:#f5f5f5;
border:1px solid #ddd;
width:100%;
padding:0 20px;
box-sizing:border-box;
}


.participant-row {
display: flex;
gap: 10px;
align-items: flex-end;
}

.column {
flex: 1;
display: flex;
flex-direction: column;
}

.quantity {
display: flex;
align-items: center;
margin-bottom: 10px;
}

.quantity input[type="number"] {
width: 100px;
text-align: center;
margin-right:5px;
}

.quantity button {
line-height:50px;
margin:0 5px 10px 0;
color:#fff;
border:none;
width:50px;
text-align:center;
font-size:20px;
line-height:50px;
background:#111;
display:inline-block;
border-radius:10px;
cursor:pointer;
transition: all 0.5s ease;
}

.quantity button:hover {
color:#111;
background:#FFC60A;
}

.result ul {
margin:20px;
}

.terms {
margin-top: 20px;
background:#e5e5e5;
}

.terms label {
cursor:pointer;
display: inline-block;
}

.terms label a {
color:#444;
}
.terms label a:hover {
text-decoration:underline;
}


.terms input[type="checkbox"] {
display:inline-block;
vertical-align:middle;
}

.payment-methods {
margin-top: 20px;
}

.payment-methods label,
.terms label {
margin:0 20px 0 5px;
display:inline-block;
font-size:16px;
color:#444;
vertical-align:middle;
cursor:pointer;
font-weight:300;
}
.terms label {
margin:0;
}

.payment-methods label:hover {
color:#FFC60A;
}

#purchase-form .purchase-button {
font-size:22px;
line-height:50px;
margin:40px 0 60px;
color:#fff;
display:block;
border-radius:10px;
font-family: 'Roboto Mono', sans-serif;
background:#FFC60A;
border:none;
padding:0 20px;
transition: all 0.5s ease;
font-weight:900;
cursor:pointer;
}

#purchase-form .purchase-button:hover {
background:#111;
color:#FFC60A;
}

.termsContainer {
background:#e5e5e5;
}

.termsContainer p {
font-size:16px;
line-height:26px;
}
.termsContainer p a {
color:#444;
}
.termsContainer p a:hover {
text-decoration:underline;
}



/* ticket info */

.ticketInfoWrapper {
display:flex;
gap:80px;
}

.ticketInfoWrapper>div> i {
display:block;
margin:0 0 40px;
color:#eee;
font-size:160px;
text-align:center;
}

.ticketInfoWrapper h3 {
font-size:36px;
margin: 0 0 60px;
}

.ticketInfoContainer  {
background:#111;
padding:60px;
border-radius:2px;
flex-basis:40%;
flex-shrink:0;
}


.ticketInfoContainer .ticketPrice {
font-size:60px;
font-weight:700;
margin: 0 0 60px;
display:block;
color:#FFC60A;
}

.ticketInfoContainer p {
color:#fff;
}

.ticketInfoContainer  ul li {
display:flex;
font-size:16px;
align-items:center;
margin:0 0 10px;
color:#fff;
}

.ticketInfoContainer  ul li i {
margin-right:10px;
color:#FFC60A;
}

.ticketInfoContainer .purchase-button {
color:#111;
background:#FFC60A;
}

.ticketInfoContainer .purchase-button:hover {
color:#FFC60A;
background:#111;
}

.funWrapper {
display:flex;
align-items:stretch;
justify-content:space-between;
padding:0;
}

.mapWrapper .container {
max-width:1280px;
}
.mapWrapper img {
max-width:100%;
}

.lotteryWrapper h3 {
color:#111;
}

.lotteryWrapper  {
background:#FFC60A;
padding:40px;
text-align:center;
}

.lotteryWrapper h3 {
color:#111;
font-size:36px;
line-height:46px;
text-transform:uppercase;
font-weight:900;
}

.lotteryWrapper img {
width:200px;
}

.radioWrapper {
padding:40px;
background:#fff;
display:flex;
align-items:center;
gap:40px;
}

.radioWrapper img {
width:200px;
}


/* Program */
.programWrapper {
background:#111;
display:flex;
align-items:stretch;
padding:0;
}

.programContainer {
width:40%;
padding:100px;
}
.programPhoto2 {
width:60%;
background-image:url(/img/banner-kongres.jpg);
background-position:bottom right;
background-size:cover;
background-repeat:no-repeat;
}


.programWrapper p {
color:#fff;
}

.programWrapper ul {
display:flex;
list-style:none;
align-items:stretch;
flex-flow:column;
}

.programWrapper ul li {
flex-basis:100%;
max-width:100%;
margin: 0 0 40px;
display:flex;
align-items:center;
gap:20px;
box-sizing:border-box;
border-radius:15px;
font-weight:300;
}

.programWrapper ul li i {
display:block;
text-align:center;
font-style:normal;
font-size:40px;
color:#444;
}

.programWrapper ul li span {
display:block;
color:#fff;
}

/* sponsors */

.speakersWrapper {
background:#FFC60A;
}

.speakersWrapper>div>h3 {
color:#111;
}

.speakersContainer h3 {
font-size: 26px;
line-height: 26px;
margin: 0 0 20px;
color: #111;
}

.speakersContainer {
display:flex;
align-items:stretch;
gap:20px;
flex-wrap:wrap;
list-style:none;
}

.speakersContainer li {
background:#fff;
border-radius:20px;
padding:40px;
flex-basis:100%;
min-width:100%;
justify-content:center;
margin: 0 0 10px;
display:flex;
gap:40px;
}

.speakersContainer li p {
margin:0;
}

.speakersContainer li i {
font-size:100px;
color:#eee;
display:block;
}
/* organizer */

.organizerWrapper .container {
display:flex;
gap:80px;
align-items:start;
}

.organizerWrapper .contacts {
padding:40px 40px 20px;
background:#f5f5f5;
border-radius:2px;
}

.organizerWrapper .contacts a {
display:block;
margin: 0 0 20px;
color:#111;
font-size:22px;
line-height:32px;
font-weight:300;
white-space:nowrap;
}

.organizerWrapper .contacts a i {
margin-right:10px;
vertical-align:middle;
color:#FFC60A;
}
/* ticket cta */

.ticketCTA {
background:#111;
}

.ticketCTA p {
color:#fff;
}

.ticketCTA p a {
color:#FFC60A;
}
.mapWrapper p a {
color:#222;
}
.ticketCTA p a:hover, .mapWrapper p a:hover {
text-decoration:underline;
}

.ticketCTA .purchase-button {
background:#FFC60A;
color:#111;
}

.ticketCTA .purchase-button:hover {
color:#fff;
}

/* footer */

footer {
padding:40px;
font-size:14px;
line-height:24px;
font-weight:300;
color:#888;
text-align:center;
position:relative;
background:#111;
}

footer a {
color:#fff;
text-decoration:underline;
}
a.netit {
position:absolute;
right:30px;
top:40px;
display:block;
width:76px;
height:24px;
background:url(/img/netit.png) no-repeat;
}
a.netit:hover {
background-position:0 -24px; 
}


@media only screen
/*and (min-device-width : 375px) 
and (max-device-width : 667px)*/
and (min-height : 300px) and (max-width : 1020px) and (min-device-height : 300px) {

    header nav { display:none; }

    header .logo {
    left:20px;
    }
     
    .banner {
    height:auto;
    padding:140px 20px 40px;
    }

    .banner .container {
    height: auto;
    }

    .banner .bannerContainer {
    position: relative;
    top:auto;
    transform: none;
    width: 100%;
    left: auto;
    }

    .banner .bannerContainer h1 {
    font-size: 40px;
    line-height: 50px;
    }

    .banner .bannerContainer .bannerInfo {
    flex-wrap:wrap;    }

    .countdownWrapper ul {
    gap: 10px;
    justify-content: center;
    }
    section {
    padding: 20px;
    }
    .countdownWrapper ul li span {
    font-size: 30px;
    width:60px;
    font-weight:900;
    border-radius: 0;
    background: none;
    color: #222;
    height: auto;
    line-height: 30px;
    }
    .ticketInfoWrapper {
    gap: 0;
    flex-wrap: wrap;
    }
    .ticketInfoContainer {
    padding: 40px;
    flex-basis: 100%;
    }

    .programWrapper {
    flex-wrap: wrap;
    }

    .programPhoto {
    width: 100%;
    height:400px;
    }
    .programPhoto2 {
    display:none;
    }

    .programContainer {
    width: 100%;
    padding: 20px;
    }

    .sponsorsContainer li {
    flex-basis: 49%;
    flex-shrink: 1;
    font-size:16px;
    margin: 0 0 5px;
    }

    .speakersContainer li i {
    display:none;
    }

    .organizerWrapper .container {
    flex-wrap: wrap;
    gap: 0;
    }
    .organizerWrapper .contacts {
    width: 100%;
    }

    .organizerWrapper .logo {
    width:100%;
    text-align:center;
    margin-bottom:40px;
    }

    .formSection, .terms, .termsContainer {
    padding: 15px;
    }


    .funWrapper {
    flex-wrap: wrap;
    }
    .radioWrapper {
    flex-wrap: wrap;
    padding:20px;
    justify-content:center;
    }

    .lotteryWrapper {
        width:100%;
    }

    footer {
    padding:20px;
    }
    a.netit {
    /*position: relative;
    right:auto;
    top:auto;
    margin:20px auto 0;*/
    top:auto;
    bottom:10px;
    right:10px;
    }

}