/* font imports */
@import url('https://fonts.googleapis.com/css2?family=Rokkitt:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,500,600,700,800");

/* colors:
black #000000
red #E2000B
gold #E0BE63
*/

*{
margin: 0px;
padding: 0px;
font-family: Raleway, Arial, sans-serif;
}

body {
margin: 0px;
padding: 0px;
}

/* containers */ 

.block_black, .block_white, .block_gold, .block_grey, .block_red {
width: 100%;
}

.block_black{
background-color: #000000;
background-image: url("images/hero_header.jpg");
background-position: center;
background-size: cover;
  }
    
.block_white{background-color: #FFFFFF;}
.block_gold{background-color: #E0BE63}
.block_grey{background-color: #f7f7f7;}
.block_red{background-color: #e2000b; color: #FFFFFF;}

.block_spacer{
width: 100%;
height: 0.25rem;
}
.block_spacer_small{
width: 100%;
height: 0.1rem;
}

.block_container_S, .block_container_M, .block_container_L, .block_container_XL{
width: 96%;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.block_container_S{max-width: 600px;}
.block_container_M{max-width: 1000px;}
.block_container_L{max-width: 1280px;}
.block_container_XL{max-width: 1440px;}

.soudalgame{
  width: 50%;
  margin-top: -8rem;
  margin-bottom: 2rem;
}
.soudalgame_margin{
  width: 100%;
  height: 10rem;
}

.soudalsummer{
  width: 50%;
  margin-top: -4rem;
  margin-bottom: 2rem;
}
.soudalsummer_margin{
  width: 100%;
  height: 6rem;
}

.mountains{
width: 100%;
margin-bottom: -0.5rem;
}



/* Titles */

.white_title, .blackgold_title, .blackwhite_title, .gold_text, .red_text, .black_descr, .whiteblack_title, .black_descr_HU, .HU_play_rules, .HU_play_rules_number{
font-family: Rokkitt, Arial, sans-serif;
font-size: 3.5rem;
font-weight: 500;
width: 100%;
text-align: center;
}

.white_title{
color:#FFFFFF;
text-shadow: 2px 2px 0 #E0BE63;
}

.blackwhite_title{
color: #000000;
text-shadow: 2px 2px 0 #FFFFFF;
}

.whiteblack_title{
color: #FFFFFF;
text-shadow: 2px 2px 0 #000000;
}


.blackgold_title{
color: #000000;
text-shadow: 2px 2px 0 #E0BE63;
}

.gold_text{
color:#E0BE63;
font-weight: 200;
font-size: 2rem;
}

.red_text{
color:#e2000b;
font-weight: 600;
padding-top: 0.4rem;
padding-bottom: 0.4rem;
font-size: 1.5rem;
text-align: left;
padding-left: 0.25rem;
}

.black_descr{
color: #000000;
font-weight: 200;
font-size: 1.2rem;
text-align: left;
padding-left: 0.25rem;
}

.black_descr_HU{
color: #000000;
font-weight: 400;
font-size: 1.2rem;
text-align: center;
padding-left: 0.25rem;
}

.HU_play_rules{
color: #FFFFFF;
margin-bottom: 1rem;
font-weight: 400;
font-size: 1.2rem;
text-align: left;
padding-left: 0.25rem;
}

.HU_play_rules_number{
font-weight: 800;
font-size: 1.2rem;
text-shadow: 2px 2px 0 #000000;
}

.HU_social_media_icon{
width: 15%;
margin-left: 2%;
margin-right: 2%;
}



.footer_text{
font-size: 0.9rem;
font-weight: 400;
}

.red_footer_text{
color:#e2000b;
font-weight: 800;
}


a.gold_link, a.gold_link:active, a.gold_link:hover, a.gold_link:visited{
font-weight: 800;
color: #E0BE63;
text-decoration: underline;
} 

a.gold_link:hover{text-decoration: none}



a.gold_frame_link, a.gold_frame_link:active, a.gold_frame_link:hover, a.gold_frame_link:visited,
a.red_frame_link, a.red_frame_link:active, a.red_frame_link:hover, a.red_frame_link:visited{
border: 1px;
color:#E0BE63;
font-size: 2.5rem;
text-decoration: none;
font-weight: 400;
}

a.red_frame_link, a.red_frame_link:active, a.red_frame_link:hover, a.red_frame_link:visited{
color:#FFFFFF;
}


a.gold_frame_link:hover, .a.red_frame_link:hover{
color:#FFFFFF;
}

.a.red_frame_link:hover{
color: #000000;
}


.gold_frame_link_box, .red_frame_link_box{
font-family: Rokkitt, Arial, sans-serif;
display: inline-block;
padding: 2rem;
padding-top: 0.5rem;
padding-bottom: 0.7rem;
background-color: #FFFFFF;
margin-top: 2rem;
margin-bottom: 2rem;
border: 0.0625rem solid #444;
}

.red_frame_link_box{
background-color: #e2000b;
border-color: #e2000b;
}

.gold_frame_link_box:hover,.red_frame_link_box:hover{
background-color: #000000;
}





/* other text */


.white_text{
color: #FFFFFF;
}


/* video */

.main_video{
cursor: pointer;
}


/* table */

.table {
  display: flex;
  width: 100%;
  align-items: center; /* Vertical alignment */
  justify-content: space-between; /* Horizontal alignment */
}

.left-arrow-column, .arrow_space, .column1, .column_space, .column2, .column3, .right-arrow-column, .column1W, .column2W, .column3W{
    align-items: center; /* Center content horizontally */
    justify-content: center; /* Center content vertically */
}

.left-arrow-column, .right-arrow-column {
  width: 9%;
}

.arrow_space {
  width: 5%;
}

.column1, .column2, .column3, .column1W, .column2W, .column3W {
  width: 22%;
  align-self:flex-start;
}

.column1W, .column2W, .column3W {
background-color: #FFFFFF;
}

.column_space{
  width: 3%;
}


/* Mobile Navbar */


.navbar {
  width: 100%;
  background-color: rgba(0, 0, 0, 0.85);
  padding: 1rem;
  position: fixed;
  z-index: 1000;
}
input#menu_toggle {
  display: none;
}
label.hamburger {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 2.5rem;
  height: 2rem;
  cursor: pointer;
}
label.hamburger span {
  display: block;
  height: 0.4rem;
  background-color: #E0BE63;
  border-radius: 0.5rem;
}
  nav.menu {
  display: none;
  background-color: rgba(20, 20, 20, 0.75);
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  z-index: 1001;
}
/* when checkbox is checked, show menu */
#menu_toggle:checked ~ nav.menu {
  display: block;
}
nav.menu a {
  display: block;
  font-family: Rokkitt, Arial, sans-serif;
  padding: 1.5rem;
  text-decoration: none;
  color: #E0BE63;
  font-size: 3rem;
  border-bottom: 0.1rem solid #E0BE63;;
}
nav.menu a:last-of-type {
  border-bottom: none;
}

/* HU extra code */
/* Only for the form, namespaced to .formSOQ_ to avoid collisions */

.formSOQ_title {
    font-family: Rokkitt, Arial, sans-serif;
    font-size: 1.75rem;
    font-weight: 500;
    color: #e2000b;
    margin-bottom: 1.5rem;
    text-align: center;
}

.formSOQ_table {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.formSOQ_left-column, .formSOQ_middle-column, .formSOQ_right-column {
    display: flex;
    align-items: center;
    justify-content: center;
}

.formSOQ_left-column, .formSOQ_right-column {
    width: 49%;
}

.formSOQ_middle-column {
    width: 2%;
}

.formSOQ_form-field {
    width: 100%;
    margin-bottom: 1rem;
}

.formSOQ_form-field input[type="text"],
.formSOQ_form-field input[type="email"],
.formSOQ_form-field input[type="file"] {
    width: 100%;
    padding: 10px;
    margin: 0.3rem 0;
    border: 1px solid #DDDDDD;
    background-color: #FFFFFF;
    font-family: "Source Sans Pro", Helvetica, sans-serif;
    font-size: 1rem;
    border-radius: 6px;
    box-sizing: border-box;
}

.formSOQ_form-field input[type="file"] {
    padding: 5px;
}

.formSOQ_form-field input:focus {
    border-color: #e2000b;
    outline: none;
}

button#formSOQ_submitButton {
    padding: 10px 20px;
    font-size: 16px;
    font-weight: 500;
    background-color: #333;
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 1rem;
    transition: background 0.2s;
}

button#formSOQ_submitButton:hover {
    background-color: #e2000b;
}

.formSOQ_form-field label {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
    width: 100%;
    font-weight: 400;
}

.formSOQ_form-field input[type="checkbox"] {
    margin-right: 0.5em;
}

.formSOQ_form-field input[type="date"],
.formSOQ_form-field input[type="date"]::-webkit-inner-spin-button,
.formSOQ_form-field input[type="date"]::-webkit-calendar-picker-indicator {
  -webkit-appearance: none;
  appearance: none;
}
.formSOQ_form-field input[type="date"] {
  width: 100%;
  padding: 10px;
  margin: 0.3rem 0;
  border: 1px solid #DDDDDD;
  background-color: #FFFFFF;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-size: 1rem;
  border-radius: 6px;
  box-sizing: border-box;
  cursor: pointer;
}
.formSOQ_form-field input[type="date"]:focus {
  border-color: #e2000b;
  outline: none;
}

.formSOQ_datepicker:empty::before {
  content: attr(data-placeholder);
  color: #999;
  position: absolute;
  pointer-events: none;
  padding: 10px;
}
.formSOQ_form-field { position: relative; }

@media (max-width: 600px) {
    .formSOQ_table {
        flex-direction: column;
    }
    .formSOQ_left-column, .formSOQ_right-column {
        width: 100%;
    }
    .formSOQ_middle-column {
        display: none;
    }
    .formSOQ_container {
        padding: 8px;
    }
}