@charset "utf-8";
/**
 * @package		KPS
 * @author		Piotr Adamiec
 */

/* ======================================== Global vars ======================================== */
:root {
  --kps-color-orange: #DF5813;
  --kps-color-orange-active: #CD4D0C;
}


/* ======================================== Reset / normalize ======================================== */
*, *::before, *::after {
  box-sizing: border-box;
}

ul, ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
  color: inherit;
}

img, picture {
  max-width: 100%;
  display: block;
}

button, input, select, textarea {
  font: inherit;
  border: none;
  background: none;
  padding: 0;
  margin: 0;
  color: inherit;
}
button, input[type="submit"], input[type="reset"] {
  cursor: pointer;
	outline: inherit;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}


/* ======================================== Overwriting ======================================== */
/* ---------------------------------------- Bootstrap */
/* Vars */
:root {
  --bs-body-font-family: "Lato",Arial,sans-serif;
  --bs-body-color: #313131;
  --bs-body-bg: #ffffff;
  --bs-body-bg-rgb: 255,255,255;
  --bs-link-color: #0055A7;
  --bs-link-color-rgb: 0,85,167;
  --bs-link-hover-color: #003B73;
  --bs-link-hover-color-rgb: 0,59,115;

  --bs-form-invalid-color: #FCAE09;
  --bs-form-invalid-border-color: #FCAE09;
  
  --bs-btn-color: #ffffff;
  --bs-btn-bg: #0065FB;
  --bs-btn-border-color: #418DFF;
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #0154CF;
  --bs-btn-hover-border-color: #418DFF;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #0065FB;
  --bs-btn-active-bg: #0154CF;
  --bs-btn-active-border-color: #418DFF;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #A4A4A4;
  --bs-btn-disabled-bg: #393939;
  --bs-btn-disabled-border-color: #535353;

  --bs-border-color: #A1A1A1;
  --bs-border-radius: 8px;
}

/* Buttons */
.btn {
  --bs-btn-padding-x: 1.5rem;
  --bs-btn-padding-y: .6rem;
}

.btn-primary span,
.btn-secondary span {
  padding-left: 10px;
}

.btn-secondary {
  --bs-btn-color: #0065FB;
  --bs-btn-bg: #ffffff;
  --bs-btn-border-color: #ffffff;
  --bs-btn-hover-color: #0154CF;
  --bs-btn-hover-bg: #D5E6FF;
  --bs-btn-hover-border-color: #D5E6FF;
  --bs-btn-focus-shadow-rgb: 130,138,145;
  --bs-btn-active-color: #0154CF;
  --bs-btn-active-bg: #D5E6FF;
  --bs-btn-active-border-color: #D5E6FF;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #ffffff;
  --bs-btn-disabled-bg: #6c757d;
  --bs-btn-disabled-border-color: #6c757d;
}

/* Forms */
.form-control {
  background-color: #DAE0E7;
  border: solid 2px #124680;
}

.control-group.correct-checkbox {
  display: flex;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
}
.correct-checkbox .control-label {
  order: 2;
}
.correct-checkbox .controls {
  order: 1;
  min-width: auto;
}
.correct-checkbox .form-check .form-check-input {
  margin-left: auto;
}


/* ---------------------------------------- PWE */
/* Buttons */
.pwe-btn-group {
  display: block;
  text-align: center;
}
.pwe-btn-group > * {
  margin-left: 10px;
  margin-right: 10px;
}

/* Skiplinks */
.pwe-skiplinks a {
  background-color: var(--bs-white);
}


/* ======================================== Typography ======================================== */
/* ---------------------------------------- Fonts */
@font-face { /* Light */
  font-family: 'Lato';
  src: url('../fonts/LatoLatin-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}
@font-face { /* Light Italic */
  font-family: 'Lato';
  src: url('../fonts/LatoLatin-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
}
@font-face { /* Regular */
  font-family: 'Lato';
  src: url('../fonts/LatoLatin-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face { /* Regular Italic */
  font-family: 'Lato';
  src: url('../fonts/LatoLatin-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}
@font-face { /* Medium */
  font-family: 'Lato';
  src: url('../fonts/LatoLatin-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}
@font-face { /* Medium Italic */
  font-family: 'Lato';
  src: url('../fonts/LatoLatin-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
}
@font-face { /* Bold */
  font-family: 'Lato';
  src: url('../fonts/LatoLatin-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face { /* Bold Italic */
  font-family: 'Lato';
  src:  url('../fonts/LatoLatin-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500&display=swap');


/* ---------------------------------------- Html, body */
@-ms-viewport {
	width: device-width;
}

body {
  background: var(--bs-body-bg);
}


/* ---------------------------------------- Outline */
a:focus, area:focus, input:focus, select:focus, textarea:focus, button:focus, iframe:focus, 
[tabindex]:focus, [contentEditable=true]:focus {
	outline: #FF0404 solid 3px;
	outline-offset: 3px;
}


/* ---------------------------------------- Colors  */
.c-text-white {
  color: var(--bs-white);
}

.c-bg-dark-white {
  background-color: var(--bs-white);
}
.c-bg-dark-grey {
  background-color: #464646;
}


/* ---------------------------------------- Heading */
/* Default heading */
.c-heading {
  display: table;
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  text-transform: uppercase;
  padding-bottom: 2px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2.5rem;
  border-bottom: 3px solid #3E3E3E;
}
.c-heading-white {
  color: var(--bs-white);
  border-color: #D7D7D7;
}


/* ---------------------------------------- Links */
.c-link-light,
.c-bg-dark-grey a {
  color: #E4E4E4;
}
.c-link-light:hover, .c-link-light:focus, .c-link-light:active,
.c-bg-dark-grey a:hover, .c-bg-dark-grey a:focus, .c-bg-dark-grey a:active {
  color: var(--bs-white);
}

.site-footer a {
  text-decoration: underline;
}


/* ---------------------------------------- Form */
.control-group {
  padding-bottom: 2rem;
}

.control-label label {
  font-size: 1.1rem;
  padding-bottom: 4px;
}

.form-check {
  padding-left: 0;
}
.form-check-inline {
  display: block !important;
}

.invalid {
  color: var(--bs-form-invalid-color);
  border-color: var(--bs-form-invalid-border-color);
}

#submissionForm .control-label {
  background: #094995;
  padding: 12px;
  padding-bottom: 0;
  border-radius: 7px 7px 0 0;
}
#submissionForm .controls {
  background: #094995;
  padding: 12px;
  padding-top: 0;
  border-radius: 0 0 7px 7px;
}

#submissionForm .correct-checkbox .control-label {
  padding-bottom: 12px;
  padding-left: 0;
  border-radius: 0 7px 7px 0;
}
#submissionForm .correct-checkbox .controls {
  padding-top: 12px;
  padding-right: 0;
  border-radius: 7px 0 0 7px;
}

.c-contest-form__success-icon {
  font-size: 8rem;
  color: #81A6D2;
}
.c-contest-form__success_info {
  font-size: 1.5rem;
  margin-top: 1rem;
}

.c-contest-form .btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--kps-color-orange);
  --bs-btn-border-color: var(--kps-color-orange);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--kps-color-orange-active);
  --bs-btn-hover-border-color: var(--kps-color-orange-active);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--kps-color-orange-active);
  --bs-btn-active-border-color: var(--kps-color-orange-active);
}

#submissionForm .table {
  --bs-table-color: initial;
  --bs-table-bg: initial;
  --bs-table-border-color: transparent;
  --bs-table-accent-bg: transparent;
  width: 100%;
  margin-bottom: 0;
  vertical-align: top;
}

#submissionForm .table .control-group {
  padding-bottom: 0;
}

#submissionForm .table th {
  font-weight: normal;
}


/* ---------------------------------------- Standard content */
.c-text p:last-child,
.c-content p:last-child {
  margin-bottom: 0 !important;
}

.c-content img {
  max-width: 100%;
  height: auto;
}


/* ======================================== Utilities ======================================== */
.c-hidden {
  display: none !important;
}

.object-cover {
  object-fit: cover;
  height: 100%;
}




/* ======================================== Layout ======================================== */
/* ---------------------------------------- Site header */
.c-site-header {
  position: relative;
}

/* -------------------- Site header branding */
.c-site-header__brand {
  background-color: var(--bs-white);
}

/* Site branding */
.c-site-brand {
  display: flex;
  width: 100%;
}

.c-site-brand__logo {
  text-align: left;
  padding: 20px 0;
}

.c-site-brand__promo {
  display: flex;
  flex-grow: 1;
  justify-content: flex-end;
  align-items: center;
  padding: 20px 0;
}

/* -------------------- Hero */
.c-site-header__hero {
  width: 100%;
  border-bottom: solid 3px var(--kps-color-orange);
}

.c-header-hero {
  display: flex;
  width: 100%;
  position: relative;
  min-height: 340px;
}

.c-header-hero__left {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 60%;
  z-index: 1;
  background-color: #142513;
  background-image: url('../images/kps-header-hero-left.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}

.c-header-hero__right {
  position: relative;
  width: 50%;
  margin-left: 50%;
  z-index: 2;
  background-color: transparent;
}

.c-header-hero__right-image {
  clip-path: url(#c-header-hero__right-image-clip);
}
#c-header-hero__right-image-svg {
  position: absolute;
  width: 0;
  height: 0;
}

.c-page-title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  max-width: 660px;
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: 15%;
  text-align: center;

  padding: 40px 20px
}
.c-page-title__contest {
  font-family: 'Cinzel', serif;
  font-weight: 500;
  font-size: 2.7rem;
  padding: 10px 0;
  color: var(--bs-white);
  line-height: 100%;
  text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
}
.c-page-title__name {
  font-family: 'Cinzel', serif;
  font-weight: 500;
  font-size: 3.2rem;
  padding: 10px 0;
  color: #EBCD26;
  line-height: 100%;
  text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
}
.c-page-title__slogan {
  font-family: 'Cinzel', serif;
  font-weight: 500;
  font-size: 1.4rem;
  padding: 10px 0;
  color: var(--bs-white);
}

/* -------------------- Menu box */
.c-site-header__menu {
  width: 100%;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 50%);
  z-index: 2;
}


/* ---------------------------------------- Site footer */
.site-footer {
  background-color: #E7E7E7;
}

.site-footer__copyrights {
  margin-top: 20px;
  font-size: .9rem;
}




/* ---------------------------------------- Sections */
.c-section {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}


/* ======================================== Elements ======================================== */
/* ---------------------------------------- Site sign / logo */
.c-site-logo {
  display: inline-block;
}

/* ---------------------------------------- Promo signs WS / UE */
.c-promo-signs {
  display: flex;
}
.c-promo-signs > *:not(:last-child) {
  margin-right: 10px;
}
.c-promo-signs a {
  display: block;
}
.c-promo-signs img {
  display: block;
  max-width: 100%;
  height: auto;
}


/* ---------------------------------------- Main menu */
.c-main-menu {
  display: flex;
  justify-content: center;
  padding: 5px 10px;
}
.c-main-menu__item {
  position: relative;
  font-size: 1.1rem;
  color: #ffffff;
  padding: 10px 30px;
  background-color: var(--kps-color-orange);
}
.c-main-menu__item:hover, .c-main-menu__item:focus, .c-main-menu__item:active {
  background-color: var(--kps-color-orange-active);
}

.c-main-menu .c-main-menu__item:not(:last-child) {
  border-right: solid 1px #BF480B;
}

.c-main-menu .c-main-menu__item:first-child {
  border-radius: 7px 0 0 7px;
}
.c-main-menu .c-main-menu__item:last-child {
  border-radius: 0 7px 7px 0;
}


/* ======================================== Components / modules ======================================== */
/* ---------------------------------------- About */
.c-about-contest {
  position: relative;
  background: #e0e0e0;
  background: linear-gradient(0deg,rgba(224, 224, 224, 1) 0%, rgba(255, 255, 255, 1) 100%);
  border-bottom: solid 3px var(--kps-color-orange);
  padding-top: 4rem;
  padding-bottom: 3rem;
}
.c-about-contest__content {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 2;
}

.c-about-contest__camera-left,
.c-about-contest__camera-right {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-image: url('../images/kps-about-contest-bg-camera.png');
  background-size: auto 80%;
  background-repeat: no-repeat;
  background-position: -50px center;
}
.c-about-contest__camera-left {
  z-index: 1;
}
.c-about-contest__camera-right {
  z-index: 2;
  transform: scaleX(-1);
}

/* Contest menu */
.c-contest-menu {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 50%);
  z-index: 4;
  
  display: flex;
  justify-content: center;
  padding: 5px 10px;
}
.c-contest-menu__item {
  position: relative;
  font-size: 1.1rem;
  color: #ffffff;
  text-transform: uppercase;
  padding: 10px 30px;
  background-color: var(--kps-color-orange);
}
a.c-contest-menu__item:hover, a.c-contest-menu__item:focus, a.c-contest-menu__item:active {
  background-color: var(--kps-color-orange-active);
}

.c-contest-menu .c-contest-menu__item:first-child {
  border-radius: 7px 0 0 7px;
}
.c-contest-menu .c-contest-menu__item:last-child {
  border-radius: 0 7px 7px 0;
  margin-left: -20px;
}

.c-contest-menu__download-icon {
  position: absolute;
  left: 0;
  top: -5px;
  z-index: 1;
  margin-left: -10px;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: #BF480B;
}


/* ---------------------------------------- Prizes */
.c-prizes {
  padding-top: 3.5rem;
  background-color: #377A0D;
}
.c-prizes-list {
  margin-top: 0;
}
.c-prizes-list__item {
  margin-bottom: 50px;
}
.c-prizes-list__item-awards {
  margin-top: 10px;
  margin-bottom: 30px;
}
.c-prizes-list__item-awards .c-prizes-item {
  padding: 30px 20px;
}
.c-prizes-list__item-awards .c-prizes-item__desc {
  font-size: 1.4rem;
}

.c-prizes-item {
  position: relative;
  height: 100%;
  color: #235205;
  background-color: #F5F8F4;
  border-radius: 8px;
  padding: 45px 20px 50px 20px;
}

.c-prizes-item__place-no {
  display: flex;
  align-items: center;
  justify-content: center;

  position: absolute;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  top: 0;
  z-index: 2;
  
  width: 70px;
  height: 70px;
  border-radius: 50%;

  font-weight: bold;
  font-size: 36px;
  color: var(--bs-white);
  background-color: #529D22;
}
.c-prizes-item__place {
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}
.c-prizes-item__desc {
  font-size: 1.2rem;
  text-align: center;
  text-transform: uppercase;
  margin-top: 10px;
}
.c-prizes-item__link {
  position: absolute;
  left: 50%;
  transform: translateX(-50%) translateY(50%);
  bottom: 0;
  z-index: 3;

  padding: 10px 40px;
  border-radius: 8px;

  font-size: 1.1rem;
  color: #ffffff;
  background-color: var(--kps-color-orange);
}
.c-prizes-item__link:hover, .c-prizes-item__link:focus, .c-prizes-item__link:active {
  background-color: var(--kps-color-orange-active);
}


/* ---------------------------------------- Banners */
.c-banners--default .c-banners__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 70px;
}

.c-banners__item a {
  display: block;
}
.c-banners__item img {
  display: block;
}



/* ---------------------------------------- Contest form */
.c-contest-form {
  color: #ffffff;
  background-color: #043977;
}

.c-contest-form a {
  text-decoration: underline;
}

.c-contest-form .form-text {
  color: #E1E4E8;
}



/* ======================================== Media Queries ======================================== */
/* ---------------------------------------- Max width 991px */
@media (max-width: 1200px) {
  .c-page-title {
    max-width: 400px;
  }
  .c-page-title__contest {
    font-size: 2rem;
  }
  .c-page-title__name {
    font-size: 2.5rem;
  }
  .c-page-title__slogan {
    font-size: 1.1rem;
  }
}

/* ---------------------------------------- Max width 991px */
@media (max-width: 991px) {
  .c-page-title {
    max-width: 100%;
  }

  /* Hero */
  .c-header-hero {
    flex-direction: column;
  }

  .c-header-hero__left {
    position: relative;
    width: 100%;
  }

  .c-header-hero__right {
    width: 100%;
    margin-left: 0;
  }
  .c-header-hero__right-image {
    clip-path: none;
  }

  /* -------------------- Components / modules */
  /* About contest */
  .c-about-contest__camera-left,
  .c-about-contest__camera-right {
    display: none;
  }

  /* Banners */
  .c-banners--default .c-banners__list {
    gap: 30px;
  }
}

/* ---------------------------------------- Max width 768px */
@media (max-width: 768px) {
  /* Site branding */
  .c-site-brand {
    flex-direction: column;
  }
  .c-site-brand__logo {
    text-align: center;
    padding-top: 16px;
    padding-bottom: 0;
  }
  .c-site-brand__promo {
    justify-content: center;
    padding-top: 0;
    padding-bottom: 10px;
  }

  /* About contest */
  .c-about-contest {
    padding-bottom: 4rem;
  }

  /* Contest menu */
  .c-contest-menu {
    flex-direction: column;
  }
  .c-contest-menu__item {
    text-align: center;
  }

  .c-contest-menu .c-contest-menu__item:first-child {
    margin-left: 30px;
    border-radius: 7px 7px 0 0;
  }
  .c-contest-menu .c-contest-menu__item:last-child {
    margin-left: 30px;
    border-radius: 0 0 7px 7px;
    border-top: solid 1px #BF480B;
  }

  .c-contest-menu__download-icon-box {
    padding: 0;
  }
  .c-contest-menu__download-icon {
    left: 10px;
    top: -30px;
  }

  /*  Prizes */
  .c-prizes {
    padding-top: 5rem;
  }
}