/* roboto mono */
@font-face {
    font-family: 'Roboto-mono';
    src: url('fonts/roboto-mono/RobotoMono-Regular.ttf');
    src: url('fonts/roboto-mono/RobotoMono-Bold.ttf');
    src: url('fonts/roboto-mono/RobotoMono-VariableFont_wght.ttf');
  }
  
  /* roboto slab */
  @font-face {
    font-family: 'Roboto-slab';
    src: url('fonts/roboto-slab/RobotoSlab-Regular.ttf');
    src: url('fonts/roboto-slab/RobotoSlab-Bold.ttf');
    src: url('fonts/roboto-slab/RobotoSlab-VariableFont_wght.ttf');
  }
  
  
  
  
  /* **************************************** */
  /* **************************************** */
  /* General styles */
  :root {
      /* rgb(232,285,17) */
      /* #e8b911 rgb(232,185,17) */
    --yellow: #e8b911;
    /* #4d80b3 rgb(64,112,176) #4070b0 */
    --blue: #4d80b3;

    --lightBlue:rgb(138,190,237);
    --black: #231f20;
    --white: #fff;
    --lightGray: #f3f3f3;
    --mediumGray: #ccc;
    --red:#e64f04;
  
 
  
  }
  
  * {
    font-family: 'Source Sans Pro', sans-serif;
    /* font-family: 'Roboto', 'Source Sans Pro', sans-serif; */
    /* font-family:  'Roboto-mono', 'Roboto-slab', 'Roboto', 'Source Sans Pro', sans-serif; */
    /* font-family: "DIN", sans-serif; */
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    scroll-behavior: smooth;
    word-break: break-word;
    -webkit-text-size-adjust: 100%;
    line-height: 150%;
  }
  
  html {
    font-size: 62.5%;
  }
  body {
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    font-size: 1.6rem;
  
    background-position: top;
    background-size: cover;
    /* background-repeat: no-repeat; */
    background-repeat: repeat-y;
  
    /* background-attachment: fixed; */
    
  
  }
  
  
  
  
  main {
    margin-top: 8rem;
  }
  
  h1 {
    font-size: 4rem;
    line-height: 125%;
    padding-bottom: 1rem;
  }
  
  h2 {
    font-size: 3.2rem;
    line-height: 125%;
    padding-bottom: 1rem;
  }
  
  h3 {
    font-size: 2.8rem;
    line-height: 125%;
    padding-bottom: 1rem;
  }
  
  h4 {
    font-size: 2.4rem;
    line-height: 125%;
    padding-bottom: 1rem;
  }
  
  .big-p {
    font-size: 2.4rem;
    line-height: 125%;
  }
  
  h5 {
    font-size: 2.2rem;
    line-height: 125%;
    padding-bottom: 0.75rem;
  }
  
  h6 {
    font-size: 2rem;
    line-height: 125%;
    padding-bottom: 0.5rem;
  }
  
  p,
  a,
  .box-content {
    font-size: 1.8rem;
  }
  
  
  /* set fontfamily for all heading */
  h1, h2, h3, h4, h5 {
    font-family: 'Source Sans Pro', sans-serif;
    /* font-family: 'Roboto', 'Source Sans Pro', sans-serif; */
    letter-spacing: 0.08rem;
  }
  
  
  
  a,
  a:visited {
    color: var(--blue);
    text-decoration: none;
  }
  
  em,
  strong,
  label,
  input,
  ::placeholder,
  textarea,
  select,
  option,
  ul,
  ol,
  li,
  th,
  tr,
  td {
    font-size: inherit;
    font-size: 1.6rem;
  }
  
  
  blockquote,
  blockquote p,
  blockquote a {
    font-weight: 300;
    font-size: 1.6rem;
  }
  
  span,
  strong,
  em {
    font-size: inherit;
    line-height: inherit;
  }
  main ul,
  main ol {
    margin-left: 1.6rem;
  }
  
  img {
    max-width: 100%;
    height: auto;
  }
  
  input[type="submit"],
  button {
    display: block;
    background-color: transparent;
    padding: 1rem 3rem;
    text-decoration: none;
    width: fit-content;
    width: -moz-fit-content;
    color: var(--white) !important;
    background-color: var(--blue);
    font-weight: bold;
    cursor: pointer;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    text-align: center;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 1;
    border-radius: 5px;
  }
  input[type="submit"]:hover,
  form button:hover {
    color: var(--white) !important;
    background-color: var(--black) !important;
  }




   input[type="text"],
  input[type="email"],
  input[type="number"],
  input {
    padding: 5px;
    display: block;
    border: none;
    width: 100%;
    /* min-width: 200px; */
    margin-bottom: 10px;
    border-bottom: 1px solid var(--mediumGray);
    border-radius: 5px !important;
  }




  
  textarea {
    resize: none;
    width: 100%;
  }
  
  iframe {
    border: none !important;
    max-width: 100%;
  }
  
  a:focus {
    border: none;
  }
  
  body.using-keyboard a:focus,
  body.using-keyboard input:focus,
  body.using-keyboard textarea:focus,
  body.using-keyboard select:focus,
  body.using-keyboard button:focus,
  body.using-keyboard *:focus {
    border: 4px solid var(--blue) !important;
    outline: var(--blue);
  }
  
  
  
  table {
    width: 100%;
  }
  td {
    width: 50%;
  }
  
  /* select */
  
  select {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    min-width: 10rem;
    padding: 5px;
    background: #fff;
    color: #000;
    border: 1px solid var(--mediumGray) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 1.6rem;

    border-radius: 5px !important;

  }
  
  
  
  .select-wrapper {
    position: relative;
  }
  
  .select-wrapper:before {
    content: '\f107';
    font-family: "Line Awesome Free";
    font-weight: 900;
    font-size: inherit;
    color: var(--mediumGray);
    display: inline-block;
    position: absolute;
    right: 20px;
    top: 4px;
    pointer-events: none;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2rem;
  }
  
  select::-ms-expand {
    display: none;
  }






/******  main-menu-logged-in-wrapper ********/
.main-menu-logged-in-wrapper {
  position: absolute;
  top: 8rem;
  display: flex;
  width: 100%;
  justify-content: flex-end;
  background-color: var(--yellow);
  margin: 0 auto;
  padding: 1rem 0;
  z-index: 0;
}

.main-menu-logged-in-wrapper .main-menu-logged-in-content {
  display: flex;
  width: 100%;
  justify-content: flex-end;

  margin: 0 auto;
  max-width: 1600px;

  /* padding-right: 4rem; */
  padding: 0 10rem;

}
.main-menu-logged-in-wrapper .menu-action-user {
  /* margin-right: 1rem; */
  margin-right: 0;
  margin-left: 1rem;
}

.menu-action-user-action-wrapper a {
  width: 100%;
  font-weight: 700 !important;
  transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
}
.menu-action-user-action-wrapper a:hover {
  /* font-weight: 500 !important; */
  color: var(--lightBlue) !important;
}

.main-menu-logged-in-wrapper .logged-in-name {
  color: var(--blue);
}





/***** misc css for forms **********/


/* Login modal */
.modal-box {
  display: flex;
  width: 100%;
  z-index: 10;
  opacity: 0;
  height: 100%;
  position: fixed;
  overflow-x: hidden;
  background-color: rgba(0, 0, 0, 0.8);
  transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  z-index: -1;
}

.modal-box.open {
  opacity: 1;
  z-index: 1000;
}

.login-wrapper {
  width: 100%;
  height: 100vh;
  color: var(--yellow);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 1rem;
}


#login-inner-wrapper {
  position: relative;
  padding: 3rem 5rem;
  margin: 5rem 0rem;
  width: 100%;
  max-width: 600px;
  border-radius: 2rem;
  color: var(--darkgrey);
  background-color: var(--white);
  display: flex;
  flex-direction: column;
}
.login-text-wrapper {
  display: flex;
  /* justify-content: space-between; */
  /* align-items: center; */
}

#close-login-button {
  position: absolute;
  top: 1rem;
  right: 2rem;
}

#forgot-password-wrapper {
  padding-top: 2rem;
}



/****** forgot password modal **********/
.modal-box-forgot-password {
  display: flex;
  width: 100%;
  z-index: 10;
  opacity: 0;
  height: 100%;
  position: fixed;
  overflow-x: hidden;
  background-color: rgba(0, 0, 0, 0.8);
  transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  z-index: -1;
}

.modal-box-forgot-password.open {
  opacity: 1;
  z-index: 1000;
}

.forgot-password-wrapper {
  width: 100%;
  height: 100vh;
  color: var(--yellow);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 1rem;
}


#forgot-password-inner-wrapper {
  position: relative;
  padding: 3rem 5rem;
  margin: 5rem 0rem;
  width: 100%;
  max-width: 600px;
  border-radius: 2rem;
  color: var(--darkgrey);
  background-color: var(--white);
  display: flex;
  flex-direction: column;
}

#close-forgot-password-button {
  position: absolute;
  top: 1rem;
  right: 2rem;
}

/****** end  forgot password modal **********/




/***** forms **********************/
.box-select-wrapper {
  margin: 0 0 2rem 0;
  width: 100%;
}

.error-message {
  font-size: 12px;
  color: var(--red);
  margin-bottom: 25px;
  display: block;
}



/************ end  forms***************************/



/*********** photo gallery **************************/
#section-photo-gallery-wrapper {
  width: 100%;
}
.photo-gallery-wrapper {
  padding: 3rem;
}




/***** table event participants  ********************/
.table-event-participants {
  overflow: scroll;
}
#event-participants-list-wrapper table {
  border-collapse: collapse;
  width: 100%;
  overflow-x: auto;
}
#event-participants-list-wrapper table, tr, th, td {
  padding: 8px;
}

.table-event-participants thead{
  border-color: rgb(255, 205, 41) !important;
  border-bottom: 2px solid rgb(255, 205, 41)!important;
}
.table-event-participants thead tr th {
  
  text-align: start !important;
}
.table-event-participants .table-data-col-name {
  width: 30%;
}
.table-event-participants tbody td {
  text-align: start;
  font-size: 1.6rem;
}

.table-event-participants tbody tr:nth-child(even) {
  background: rgb(238, 238, 238);
}
.table-event-participants tbody tr:nth-child(odd) {
  background: rgb(248, 248, 248);
}

/*
.table-event-participants tbody tr {
  line-height: 2rem !important;
  padding: 2rem 0;
}
*/

.table-action-wrapper {
  display: flex;
  align-items: center;
}

.table-event-participants .box-input-wrapper {
  display: flex;
  width: 100%;
  align-items: center;

}
.table-event-participants .box-input-wrapper input {
  width: 100%;
  width: 6rem;
  color: var(--blue);
  margin-right: 1rem;
  margin-bottom: 0;
}
.table-event-participants .box-input-wrapper button {
  min-width: 10rem;
}

.table-event-participants .box-input-wrapper .btn-delete {
  margin-left: 2rem;
}


/************ end  table event participants *********/









  
@media all and (min-width: 1200px) {

  .main-menu {
    padding-bottom: 2rem;
  }

  .sticky .main-menu {
    padding-bottom: 0;
  }



  #main-menu-inner-wrapper {
    display: flex;
    width: 100%;
  }

  #main-menu-inner-wrapper .current-menu-item > a,
  #main-menu-inner-wrapper .current-menu-ancestor > a {
    /* color: rgb(1, 116, 170) !important; */
    color: rgb(19, 180, 255) !important;
  }

  #main-menu-inner-wrapper .current-menu-item > a {
    /* color: rgb(1, 116, 170) !important; */
    color: rgb(19, 180, 255) !important;
  }


  #main-menu-inner-wrapper li .sub-menu .current-menu-item > a {
    /* color: rgb(1, 116, 170) !important; */
    color: rgb(19, 180, 255) !important;
  }

  #main-menu-inner-wrapper ul li {
    position: relative;
    display: flex;
  }

  #main-menu-inner-wrapper li .sub-menu {
    display: none;
    position: absolute;
    /* top: 100%; */
    /* top: 4rem; */
    top: 3.5rem;
    left: 0;
    width: max-content;
    list-style: none;
    background: var(--white);
    z-index: 10;
    margin: 0;
    padding: 0;
    /* border-top: 3px solid var(--blue); */
    box-shadow: 0 7px 14px rgba(171, 171, 171, 0.15),
      0 5px 5px rgba(171, 171, 171, 0.15);
      border-radius: 0 0 5px 5px;
  }

  #main-menu-inner-wrapper li .sub-menu li {
    padding: 1.5rem;
    width: 100%;
    margin-left: 0;

    border: none;

  }

  #main-menu-inner-wrapper li .sub-menu a {
    /* color: var(--black); */
    color: var(--marine) !important;
    transition: all 0.5s ease;
  }

  #main-menu-inner-wrapper li .sub-menu a:hover {
    /* color: var(--marine) !important; */
    color: rgb(19, 180, 255) !important;
    -webkit-transform: scale(0.90);
    -ms-transform: scale(0.90);
    transform: scale(0.90) !important;
  }

  #main-menu-inner-wrapper li.menu-item-has-children:hover > .sub-menu {
    display: block;
  }

  .menu-item-has-children .sub-menu > .menu-item-has-children:hover .sub-menu {
    display: block;
  }

  #main-menu-inner-wrapper li .sub-menu li {
    position: relative;
  }

  #main-menu-inner-wrapper li .sub-menu li .sub-menu {
    position: absolute;
    /* top: 0; */
    top: 0.3rem;
    left: 0;
    width: max-content;
    transform: translate(-100%, -3px);
  }

  #main-menu-inner-wrapper .mainmenu li a.toggle-icon-holder {
    position: absolute;
    /* top: 75%; */
    top: 60%;
    left: 40%;
    transform: translate(-50%, 0%);
  }

  #main-menu-inner-wrapper .mainmenu li .sub-menu a.toggle-icon-holder {
    position: absolute;
    /* top: 50%; */
    top: 42%;
    left: 0;
    transform: rotate(90deg) translate(-50%, 5px);
  }
}


/* **************************************** */
/* **************************************** */
/* Keep footer at bottom */
html,
body {
  width: 100%;
  height: 100%;
}

.content-wrapper {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

main {
  width: 100%;
  flex-grow: 1;
}

header,
main,
footer {
  flex-shrink: 0;
}
/* End of keep footer at bottom */
/* **************************************** */
/* **************************************** */
  

/* **************************************** */
/* **************************************** */
/* Header */
header {
  width: 100%;
  /* box-shadow: 0 7px 14px rgba(171, 171, 171, 0.15),0 5px 5px rgba(171, 171, 171, 0.15); */
  /* background-color: var(--white); */
  background-color: transparent;
  z-index: 10;
  position: absolute;
}

header .header-container {

  height: auto;
  /* padding-top: 6rem; */
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;

  max-width: 1600px;
  margin: 0 auto;
  /* padding: 0 2.5rem; */

  /* padding-top: 2.5rem; */
  padding-top: 1rem;
  padding-bottom: 2rem;

}

header.header-no-trans {
  background-color: var(--white);
}

header.sticky {
  z-index: 997;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
  position: fixed;
  top: 0;
  width: 100%;
  background-color: var(--white);
  box-shadow: 0 7px 14px rgb(171 171 171 / 15%), 0 5px 5px rgb(171 171 171 / 15%);
}
header.sticky .header-container {
  height: 0;
  -moz-animation: slideDown-sticky 0.2s ease-in forwards;
  -webkit-animation: slideDown-sticky 0.2s ease-in forwards;
  -o-animation: slideDown-sticky 0.2s ease-in forwards;
  animation: slideDown-sticky 0.2s ease-in forwards;
  -moz-animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
  -o-animation-delay: 0.2s;
  animation-delay: 0.2s;
  margin-top: 1rem;
  margin-bottom: 0;
}

header.sticky .logo-container,
header.sticky .menu-and-icons-wrapper {
  opacity: 0;
  -moz-animation: fadeIn 0.2s ease-in forwards;
  -webkit-animation: fadeIn 0.2s ease-in forwards;
  -o-animation: fadeIn 0.2s ease-in forwards;
  animation: fadeIn 0.2s ease-in forwards;
  -moz-animation-delay: 0.5s;
  -webkit-animation-delay: 0.5s;
  -o-animation-delay: 0.5s;
  animation-delay: 0.5s;
  z-index: 10;
}
header.sticky .logo-container #header-logo {
  width: 8rem;
}
header.sticky .header-icon-wrapper .header-icon-item .header-icon-text {
  display: none;
}

@keyframes slideDown {
  from {
    height: 0;
  }
  to {
    height: 10rem;
  }
}

@-webkit-keyframes slideDown {
  from {
    height: 0;
  }
  to {
    height: 8rem;
  }
}
@keyframes slideDown-sticky {
  from {
    height: 0;
  }
  to {
    height: 8rem;
  }
}

@-webkit-keyframes slideDown-sticky {
  from {
    height: 0;
  }
  to {
    height: 10rem;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}



.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 10rem;
  height: 10rem;
}

/* logo container, hidden on start show on scroll or not mainpage */
.logo-container {
  /* display: none; */
  display: flex;
  align-items: center;
  z-index: 10;
}
.logo-container.show {
  display: flex;
  align-items: center;
}



.logo-container #header-logo {
  /* width: 8rem; */
  width: 10rem;
  line-height: 0;
}


.logo-container #header-logo-text {
  /* width: 28rem; */
  width: 16rem;
}


header.sticky .logo-container #header-logo-text {
  /* width: 20rem; */
  width: 16rem;
}


.header-icon-wrapper {
  display: flex;
  align-items: center;
}

.header-icon-item {
  display: flex;
  flex-flow: column;
  align-items: center;
  color: var(--red);
  margin-left: 2.5rem;
  cursor: pointer;
  text-decoration: none;
}

.header-icon-item i {
  color: var(--turquoise);
  font-size: 5.5rem;
}

.header-icon-item img {
  width: 4rem;
}

.header-icon-item p {
  margin-top: 0.75rem;
  color: var(--red);
  font-size: 1.6rem;
}
/* End of header */
/* **************************************** */
/* **************************************** */


/* **************************************** */
/* **************************************** */
/* Main menu */

.menu-and-icons-wrapper {
  display: flex;
  justify-content: center;
}

#header-menu-button {
  display: none;
}

#close-menu-button {
  display: none;
}
.mainmenu {
  display: flex;
}
.mainmenu li {
  list-style-type: none;
}
.mainmenu li a {
  text-decoration: none;
  margin: 0 1.5rem;
  text-transform: uppercase;
  color: var(--blue);
  font-family: 'Source Sans Pro', sans-serif;
  /* font-family: 'Roboto', 'Source Sans Pro', sans-serif; */
  font-size: 2rem;
  font-weight: 500;
  transition: all 0.4s ease;
}
.mainmenu li a:hover {
  color: var(--yellow);
}

.mainmenu li:last-child a {
  margin-right: 0;
}

.main-menu-action-item {
  margin-left: 1rem;
  display: flex;
}

.main-menu-action-item a{
  text-decoration: none;
  margin: 0 1.5rem;
  text-transform: uppercase;
  color: var(--blue);
  font-family: 'Source Sans Pro', sans-serif;
  /* font-family: 'Roboto', 'Source Sans Pro', sans-serif; */
  font-size: 2rem;
  font-weight: 500;
  transition: all 0.4s ease;
}
.main-menu-action-item a:hover {
  color: var(--yellow);
}




/* End of main menu */
/* **************************************** */
/* **************************************** */


/* **************************************** */
/* **************************************** */
/* Footer */
footer {
  height: auto;
  background-color: var(--yellow);
  -webkit-transition: all 0.3s ease-in;
  -moz-transition: all 0.3s ease-in;
  -ms-transition: all 0.3s ease-in;
  -o-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  width: 100%;
  position: relative;
}
.foooter-inner-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}


.footer-main {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 4rem 0;
}


/* box 33 */
.footer-33-wrapper {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
}
.footer-33 {
  width: 33.33%;
  width: 33.33%;
  width: calc(33.33% - 30px);
  padding: 2.5rem;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
}

.footer-33 .box-content {
  color: var(--blue);
}


/* footer image */
.footer-33-img {
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
}
.footer-33-img:hover {
  transform: scaleY(0.98);
  transform: scaleX(0.96);
}


/* footer links */

.footer-links {
  list-style: none;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  
}


.footer-links a {
  width: max-content;
  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
}

.footer-links a:hover {
  color: var(--lightBlue);
}


.footer-main .footer-links ul {
  text-decoration: none;
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-main .footer-links li {
  text-decoration: none;
  list-style: none;
  margin: 0;
}

.footer-main li a {
  color: var(--blue);
  text-decoration: none;
  transition: all 0.5s ease-in-out;
}

.footer-main li a:hover {
  color: var(--white);
}

.footer-links li {
  position: relative;
}







/* End of footer */
/* **************************************** */
/* **************************************** */




/* **************************************** */
/* **************************************** */
/* COOKIES */
#cookie-info {
  position: fixed;
  z-index: 999;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: var(--white);
  box-shadow: 0px -4px 3px rgba(87, 87, 87, 0.208);
  display: none;
}

#cookie-wrapper {
  position: relative;
}

#cookie-text {
  max-width: 75%;
}

#cookie-text p a {
  font-size: 1.6rem;
}

#cookie-content {
  max-width: 1520px;
  margin: 0 auto;
  padding: 1.5rem 5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#cookie-content .btn-black-trans {
  width: -moz-max-content;
  width: max-content;
  margin-left: 2.5rem;
  padding: 1rem 1.5rem;
  font-size: 1.6rem;
}

#cookie-info p {
  font-size: 1.6rem;
}

/********************************/
/********************************/


/********  spin-loader ************/
/**********************************/

#get-more-magazines-loader {
  display: none;
}
.spin-loader {
 
}
.spin-loader img {
  width: 8rem;
  height: 8rem;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/* small */
.loader-small {
  display: none;
}
.small-loader-image img {
  width: 3rem;
  height: 3rem;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

.show-small-loader {
  display: flex;
}


/**********************************/



/******************** style for misc. blocks *****************/
/*************************************************************/
#activity-event-wrapper {
  display: flex;
  flex-wrap: wrap;
  flex-flow: column;
  width: 100%;
}

#member-magazine-wrapper {
  display: flex;
  flex-wrap: wrap;
  /* flex-flow: column; */
  width: 100%;
}

#event-participants-list-wrapper {
  display: flex;
  flex-wrap: wrap;
  flex-flow: column;
  width: 100%;

  margin-top: 10rem;

}
#event-participants-list-wrapper h2 {
  font-size: 2.4rem;
}

#event-participants-list-wrapper .activity-single-event-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  padding: 2rem 0;
}
#event-participants-list-wrapper .info-title {
  font-size: 2.5rem;
  font-weight: 800;
}

.date {
  color: var(--yellow);
  font-size: 2rem;
  font-weight: 600;
  padding: 0 1rem;
}
.clock {
  color: var(--blue);
  font-size: 2rem;
  font-weight: 600;
  padding: 0 1rem;
}
.location {
  color: var(--blue);
  font-size: 2rem;
  font-weight: 400;
  padding: 0 1rem;
}

.name {
  color: var(--blue);
  font-size: 2rem;
  font-weight: 600;
}

.descr {
  color: var(--black);
  word-break: break-word;
  width: 100%;
}







.tooltip .tooltiptext {
  position: absolute;
  /* bottom: 50%; */
  /* top: 2rem; */
  top: -4rem;
  /* left: 50%; */
  left: calc(50% - 18rem);
  visibility: hidden;
  width: 100%;
  max-width: 30rem;
  background-color: rgba(255, 255, 255, 0.98);
  /* color: var(--blue); */
  color: var(--black);
  text-align: center;
  border-radius: 6px;
  padding: 1rem;
  z-index: 1;
  
  /* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */
  opacity: 0;
  transition: opacity 1s;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}


/* new-member-form */
.new-member-form {
  width: 100%;
  display: flex;
  flex-wrap: wrap;

  color: var(--white);

}

/* new-member-form-wrapper */
.new-member-form-wrapper {
  width: 100%;
}
/* form-area-left  */
.new-member-form-wrapper .form-area-left {
  width: 50%;

  padding: 2rem;

  border-right: 2px solid var(--white);

}
.new-member-form-wrapper .form-area-right {
  width: 50%;

  padding: 2rem;

}

.box-input-wrapper {
  width: 100%;
  display: flex;
  flex-wrap: wrap; 
}

.form-area-right .vehicle-info-box .box-input-wrapper .input-wrapper{
  width: 33%;
  padding-right: 1rem;
}

.form-area-left .box-input-wrapper .input-wrapper {
  padding-right: 1rem;
} 

.input-wrapper label {
  color: var(--black);
}

.new-member-form .add-more-vehicle a{
  color: var(--white);
}




.form-action-new-member {
  display: flex;
  justify-content: flex-end;
  padding-bottom: 2rem;
  padding-right: 2rem;
  /* margin-top: -8rem; */
}

.form-action-new-member button {
  font-size: 1.8rem;
}
.form-action-new-member .btn-blue:hover {
  color: var(--yellow) !important;
  background-color: rgb(32, 109, 209) !important;
  text-decoration: none !important;
  transform: scale(0.98);
}


.input-wrapper-checkbox {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}


.chbx-container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: fit-content;
  letter-spacing: 0.05rem;
}
.box-chbox-wrapper input{
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.box-chbox-wrapper .checkmark {
  position: absolute;
  top: 0;
  left: 0px;
  height: 25px;
  width: 25px;
  background-color: var(--white);
  border-radius: 0.5rem;
}
.box-chbox-wrapper label:hover  input:not(input:checked)~.checkmark {
  background-color: var(--white);
}
.box-chbox-wrapper input:checked~.checkmark {
  background-color: var(--blue);
}
.box-chbox-wrapper .checkmark:after{
  content: "";
  position: absolute;
  display: none;
}
.box-chbox-wrapper input:checked~.checkmark:after {
  display: block;
}
.box-chbox-wrapper .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


.flex-div-box-wrapper {
  position: relative;
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 50rem;

}


/*******  update-member-form-wrapper **********************/

.update-member-form-wrapper {
  width: 100%;
  padding: 2rem;
}

/* new-member-form */
.update-member-form {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;

  color: var(--white);

}

.form-action-update-member {
  display: flex;
  justify-content: flex-end;
  padding-bottom: 2rem;
  padding-right: 2rem;
  /* margin-top: -8rem; */
}

.form-action-update-member button {
  font-size: 1.8rem;
}
.form-action-update-member .btn-blue:hover {
  color: var(--yellow) !important;
  background-color: rgb(32, 109, 209) !important;
  text-decoration: none !important;
  transform: scale(0.98);
}


/*********************************************************/



/********************************************************/
/****** showhide-galley *********************************/

.action-show-gallery-items {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: max-content;
  font-size: 1.6rem;
  cursor: pointer;
  transition: color 0.4s ease;
  margin: 10px 0;
}


.showhide-gallery {
  /* visibility: visible !important; */
  /* height: 100px !important; */
  visibility: hidden !important;
  /* height: 0px !important; */
}

/* .modula-gallery.modula-gallery-initialized .modula-items .modula-item{
  visibility: hidden !important;
} */
/* .modula-items{
  visibility: hidden !important;
} */


.showhide-gallery.show-dropdown {
  visibility: visible !important;
  height: auto;
}
/* .modula-gallery.modula-gallery-initialized .modula-items .modula-item .show-dropdown {
  visibility: visible !important;
} */
/* .modula-items.show-dropdown {
  visibility: visible !important;
} */




/************** Media queries ***********************/
/****************************************************/
@media all and (max-width: 1400px) {
  .mainmenu li a {
    margin: 0 1rem;
    font-size: 1.7rem;
  }

  .main-menu-action-item a {
    /* margin: 0 1rem; */
    font-size: 1.7rem;
  }
}

@media all and (max-width: 1200px) {

  #main-menu-inner-wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .header-container {
    padding: 0 2rem;
    padding-bottom: 1rem !important;
  }
  
  /* **************************************** */
  /* **************************************** */
  /* Main menu */
  #main-menu {
    visibility: hidden;
    position: fixed;
    top: 0;
    right: -100%;
    width: 0;
    height: 100%;
    background-color: rgba(255, 255, 255 ,98%);
    z-index: 998;
    overflow-y: scroll;
    padding-bottom: 200px;

    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;

    box-shadow: 0 7px 14px rgba(171, 171, 171, 0.15),
      0 5px 5px rgba(171, 171, 171, 0.15);
  }

  @keyframes mainmenu {
    0% {
      right: -100%;
      visibility: hidden;
      width: 0;
    }

    1% {
      right: -55rem;
      width: 80%;
      visibility: visible;
    }

    100% {
      right: 0;
      width: 80%;
      visibility: visible;
    }
  }

  @-webkit-keyframes mainmenu {
    0% {
      right: -100%;
      visibility: hidden;
      width: 0;
    }

    1% {
      right: -55rem;
      width: 80%;
      visibility: visible;
    }

    100% {
      right: 0;
      width: 80%;
      visibility: visible;
    }
  }

  .header-icon-wrapper {
    display: flex;
  }
  #header-menu-button {
    display: block;
  }
  #close-menu-button {
    display: block;
  }
  .mainmenu {
    display: block;
  }

  #main-menu::-webkit-scrollbar {
    display: none;
  }

  #main-menu.open {
    animation: mainmenu 0.3s linear forwards;
  }

  @keyframes mainmenuClose {
    0% {
      right: 0;
      visibility: visible;
      width: 60%;
    }

    99% {
      right: -55rem;
      width: 0;
      visibility: visible;
    }

    100% {
      right: -100%;
      width: 0;
      visibility: hidden;
    }
  }

  @-webkit-keyframes mainmenuClose {
    0% {
      right: 0;
      visibility: visible;
      width: 60%;
    }

    99% {
      right: -55rem;
      width: 0;
      visibility: visible;
    }

    100% {
      right: -100%;
      width: 0;
      visibility: hidden;
    }
  }

  #main-menu.closed {
    animation: mainmenuClose 0.3s linear forwards;
    visibility: visible;
  }

  body.menu-open main,
  body.menu-open footer {

    position: relative;
  }

 

  #main-menu #close-menu-button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 2.5rem;
    cursor: pointer;
  }
  #main-menu #close-menu-button i {
    color: var(--blue);
    font-size: 2.5rem;
  }
  #main-menu-inner-wrapper {
    width: 100%;
    height: 100%;
    margin-top: 7.5rem;
    border-top: 0.2rem solid var(--fuscous-gray);
  }



  .mainmenu > li:not(:last-child):after {
    content: '';
      border-right: none;
  }


  #main-menu-inner-wrapper .mainmenu li {
    list-style-type: none;
    padding: 0;
    display: flex;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    border-bottom: 2px solid var(--fuscous-gray);
  }
  #main-menu-inner-wrapper .mainmenu li a {
    color: var(--blue);
    font-weight: 500;
    text-decoration: none;
    font-size: 1.8rem;
    padding: 1.5rem 2.5rem;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    width: 100%;
  }
  #main-menu-inner-wrapper .mainmenu li.menu-item-has-children a {
    width: 80%;
    margin: 0 1.5rem;
    width: calc(80% - 3rem);
  }

  #main-menu-inner-wrapper .mainmenu li.menu-item-has-children a.toggle-icon-holder {
    width: 20%;
    display: flex;
    justify-content: flex-end;
    margin: 0;
    padding-left: 0;
  }

  #main-menu-inner-wrapper .mainmenu li a.toggle-icon-holder {
    padding: 0 2.5rem;
  }


  #main-menu-inner-wrapper .mainmenu li:hover,
  #main-menu-inner-wrapper .mainmenu > li .sub-menu li:hover {
    /* background-color: var(--turquoise); */
    background-color: rgb(231, 231, 231);
  }

  #main-menu-inner-wrapper .mainmenu > li .sub-menu li {
    background-color: rgba(255, 255, 255, 0.7);
    border-bottom: none;
  }

  #main-menu-inner-wrapper .mainmenu > li .sub-menu li:last-of-type {
    border-bottom: none !important;
  }

  #main-menu-inner-wrapper .mainmenu > li .sub-menu li a {
    padding-left: 4rem;
    font-weight: normal;
  }

  #main-menu-inner-wrapper .mainmenu > li ul {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    overflow: hidden;
  }

  #main-menu-inner-wrapper .mainmenu > li ul:not(.show-lis) {
    display: none;
  }

  #main-menu-inner-wrapper .mainmenu > li .sub-menu li .sub-menu a {
    padding-left: 5rem;
  }

  #main-menu-inner-wrapper .mainmenu li ul.show-lis {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    /* border-top: 0.2rem solid var(--fuscous-gray); */
  }
  #main-menu-inner-wrapper .toggle-icon {
    color: var(--blue);
    font-size: 2rem;
    cursor: pointer;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
  }
  #main-menu-inner-wrapper .la-arrow-up {
    color: var(--white);
  }
  #main-menu-inner-wrapper .mainmenu li:hover .la-arrow-up,
  #main-menu-inner-wrapper .mainmenu > li .sub-menu li:hover .la-arrow-up {
    color: var(--white);
  }

  #main-menu-inner-wrapper .no-border {
    border: none !important;
  }

  .mainmenu li a {
    margin: 0 1.5rem;
  }


  .main-menu-action-item {
    margin-left: 1rem;
  }


  .main-menu-logged-in-wrapper .main-menu-logged-in-content {
    padding: 0 5rem;
  }

  /* End of main menu */
  /* **************************************** */
  /* **************************************** */




  



}

@media all and (max-width: 960px) {

}

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


  header {
    background-color: var(--white);
  }
  .main-menu-logged-in-wrapper {
    top: 12rem;
  }

  

  .footer-33-wrapper {
    flex-direction: column;
  }
  .footer-33 {
    width: calc(100% - 30px);
  }
  .footer-33 .footer-33-img {
    max-width: 20rem;
  }


}

@media all and (max-width: 650px) {
  .main-menu-logged-in-wrapper .main-menu-logged-in-content {
    flex-direction: column;
  }
  .main-menu-logged-in-wrapper .logged-in-name {
    margin-left: 1rem;
  }
  .menu-action-user-action-wrapper {
    padding: 0.3rem 0;
  }

  .main-menu-logged-in-wrapper .menu-action-user {
    font-weight: 700;
  }
}

@media all and (max-width: 550px) {

  header.sticky .header-container {
    margin-top: 0 !important;
  }


  .mainmenu li a {
    margin: 0 1.5rem;
  }

  #login-inner-wrapper {
    margin: 5rem 1rem;
  }

  .new-member-form-wrapper .form-area-left,
  .new-member-form-wrapper .form-area-right {
    width: 100%;
  }

  .logo-container #header-logo,
  header.sticky .logo-container #header-logo {
    width: 6.5rem;
  }

  .main-menu-logged-in-wrapper {
    top: 8rem;
  }

  .main-menu-logged-in-wrapper .main-menu-logged-in-content {
    flex-direction: column;
    padding: 0 1rem;
  }
  .main-menu-logged-in-wrapper .logged-in-name {
    margin-left: 1rem;
  }
  .menu-action-user-action-wrapper {
    padding: 0.3rem 0;
  }

  .main-menu-logged-in-wrapper .menu-action-user {
    font-weight: 700;
  }



  .flex-div-box-wrapper {
    flex-direction: column;
  }


  #event-participants-list-wrapper {
    overflow-x: scroll;
    margin-bottom: 10rem;
  }

  #event-participants-list-wrapper .table-event-participants .box-input-wrapper {
    flex-wrap: nowrap;
  }
  .table-event-participants .table-data-col-name {
    min-width: 16rem;
  }
  .table-event-participants .box-input-wrapper button {
    min-width: 10rem;

  }
  .table-event-participants .box-input-wrapper .btn-delete {
    padding: 1rem 0;
  }



  .footer-33-wrapper {
    flex-direction: column;
  }
  .footer-33 {
    width: calc(100% - 30px);
  }


  #section-photo-gallery-wrapper {
    padding: 0 1rem;
  }


}