﻿body { padding: 0; margin: 0; position: relative; }
div { position: relative; box-sizing: border-box; }
section { position: relative; }

input { font-weight: 400; }
textarea { font-weight: 400; }
button { font-weight: 400; }

.fixed_screen { overflow: hidden; }
.visible { display: block !important; }
.hidden { display: none !important; }
.clear { clear: both; }

.align_center { text-align: center; }

a.button, button { display: inline-block; position: relative; color: #ffffff; background: #eb3739; border: 1px solid #eb3739; text-decoration: none; font-weight: 700; font-size: 18px; line-height: 62px; letter-spacing: 0.36px; padding: 0 20px; transform-style: preserve-3d; transition: all 0.2s ease; cursor: pointer; }
a.button.small, button.small { line-height: 18px; padding: 18px 32px; } 
a.button.small:hover, button.small:hover { background: #1d1d1d; border-color: #1d1d1d; color: #eb3739; } 
a.button.shadow:before, button.shadow:before { content: ''; position: absolute; background: #ffffff; width: 100%; height: 100%; right: -5px; top: 5px; transform: translateZ(-1px); transition: all 0.2s ease;  }
a.button.shadow:hover, button.shadow:hover { transform: translate(5px, 5px); }
a.button:hover:before, button:hover:before { right: 0; top: 0; }

a.button.shadow:before, button.shadow:before { background: #1d1d1d; }
a.button.shadow.white_shadow:before, button.shadow.white_shadow:before { background: #ffffff; }

a.ghost_button, button.ghost_button { display: inline-block; position: relative; color: #1d1d1d; border: 1px solid #6e6f52; text-decoration: none; font-weight: 600; font-size: 18px; line-height: 50px; padding: 0 20px; transform-style: preserve-3d; transition: all 0.2s ease; }
a.ghost_button:hover, button.ghost_button:hover { background: #eb3739; color: #ffffff; border: 1px solid #eb3739; }

.on_white { background: #ffffff;}

a.ghost_button.on_yellow { background: #eb3739; }
a.ghost_button.on_yellow:before { content: ''; position: absolute; background: #000000; width: 100%; height: 100%; right: -5px; top: 5px; transform: translateZ(-1px); transition: all 0.2s ease; }
a.ghost_button.on_yellow:hover { border: 1px solid; transform: translate(5px, 5px);  }
a.ghost_button.on_yellow:hover:before { right: 0; top: 0; }

a.pc__vysledek_claim__content__button { transition: all 0.2s ease; }
a.pc__vysledek_claim__content__button:hover { transform: scale(1.1); }

/* Test - začátek */

.pc__test {}

.pc__test__close { position: absolute; display: block; width: 54px; height: 54px; border-radius: 50%; z-index: 6; transition: all 0.2s ease; }
.pc__test__close::before { content: ''; width: 31px; height: 1px; background: #1d1d1d; position: absolute; top: 26px; left: 12px; transform: rotate(45deg); }
.pc__test__close::after { content: ''; width: 31px; height: 1px; background: #1d1d1d; position: absolute; top: 26px; left: 12px; transform: rotate(-45deg); }
.pc__test__close:hover { background-color: #f2f9ff; }

.pc__test__tabs { display: inline-grid; margin: 0 auto 30px; }

.pc__test__tabs__tab { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #e6e6e6; }
.pc__test__tabs__tab.passed { background: #eb3739; }
.pc__test__tabs__tab.active { background: #eb3739; }
.pc__test__tabs__tab.active:before { content: ''; position: absolute; left: -4px; top: -4px; width: 18px; height: 18px; border: 1px solid #eb3739; border-radius: 50%; }

.pc__test__tab_content { display: none; }
.pc__test__tab_content.active { display: block; margin: 0 0 40px; }

.pc__test__formular__progress_bar { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #eaeaea90; z-index: 5; }

.test__question__headline{ font-size: 18px; line-height: 30px; letter-spacing: 0.36px; font-weight: 700; text-align: center; margin: 0 0 13px; }

.test__question { display: grid; border-bottom: 1px solid #e6e6e6; }

.test__question__radio {  }
.test__question__radio label span.radio_label { display: block; text-indent: -999em; height: 1px; overflow: hidden; text-align: center; }
.test__question__radio label span.radio_label { display: block; text-indent: -999em; height: 1px; overflow: hidden; text-align: center; }

.test__question__answer { color: #1d1d1d }

.test__question__answer1 { grid-area: a1; }
.test__question__answer2 { grid-area: a2; }
.test__question__answer3 { grid-area: a3; }
.test__question__answer4 { grid-area: a4; }
.test__question__answer5 { grid-area: a5; }

.test__question__radio1 { grid-area: r1; }
.test__question__radio2 { grid-area: r2; }
.test__question__radio3 { grid-area: r3; }
.test__question__radio4 { grid-area: r4; }
.test__question__radio5 { grid-area: r5; }

.test__question__outer .test__validation_message { display: none;  margin: -5px 0 15px; }
.test__question__outer.invalid .test__validation_message { display: block; text-align: center; }
.test__question__outer.invalid .test__validation_message span { color: #ff4343; }

.test__validation_summary { display: none; margin: -15px 0 25px; }
.test__validation_summary.invalid { display: block; }
.test__validation_summary span { display: block; color: #ff4343; text-align: center; }

.pc__test__tab_content__button { text-align: center; margin: 0 0 30px;}
.pc__test__tab_content__button .button { font-family: Gantari, sans-serif; font-size: 18px; line-height: 62px; font-weight: 600; padding: 0 30px; }

.personal_info__form__jmeno_grid { display: grid; }

.test__tab_content__headline__text { background: #f8f8f8; padding: 20px; color: #1d1d1d; font-weight: 800;  text-align: center; }

.test__error_message {}
.test__error_message p { font-size: 18px; line-height: 28px; text-align: center; margin: 20px auto 50px; max-width: 600px; }

.test__partner { text-align: center; margin: 0 0 20px; }
.test__partner span { margin: 0 auto; font-size: 15px; line-height: 24px; }
.test__partner span a { color: #1d1d1d; }
.test__partner span a:hover { color: #ffd502; }

@media screen and (min-width: 0) {
    .pc__test__close { right: -14px; top: -15px; width: 54px; height: 54px; }

    .pc__test__tabs { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; margin-bottom: 30px; gap: 15px; }

    .personal_info__form__jmeno_grid { grid-template-columns: 1fr 1fr; gap: 15px; }

    .test__question { grid-template-columns: 28px 1fr; grid-template-areas: "r1 a1" "r2 a2" "r3 a3" "r4 a4" "r5 a5"; gap: 11px 32px; padding: 0 0 30px; margin: 0 0 25px; }
    .test__question__answer { display: block; font-size: 15px; line-height: 20px; letter-spacing: 0.34px; height: 28px; width: 100%; }
    .test__question__answer1::before { position: absolute; content: ''; left: -24px; top: 11px; height: 1px; width: 16px; background: #e6e6e6; }
    .test__question__answer3::before { position: absolute; content: ''; left: -24px; top: 11px; height: 1px; width: 16px; background: #e6e6e6; }
    .test__question__answer5::before { position: absolute; content: ''; left: -24px; top: 11px; height: 1px; width: 16px; background: #e6e6e6; }

    .test__tab_content__headline__text { font-size: 15px; line-height: 20px; letter-spacing: 0.3px; margin: 0 0 20px; }
}

@media screen and (min-width: 400px) {
    .pc__test__tabs { margin-bottom: 50px; gap: 23px; }
}

@media screen and (min-width: 1024px) {
    .pc__test__close { right: 5px; top: -15px; width: 54px; height: 54px; }

    .personal_info__form { display: grid; grid-template-columns: 1fr 1fr; gap: 30px;   }
    .personal_info__form label { text-align: left;    }
    .pc__formular__checkbox span { text-align: left;    }
    .pc__formular__item span { text-align: left;    }

    .personal_info__form__jmeno_grid { grid-template-columns: 1fr 1fr; gap: 30px; }

    .test__question { grid-template-columns: 1fr 60px 60px 60px 60px 60px 1fr; grid-template-areas: "a1 r1 r2 r3 r4 r5 a5"; gap: 0; align-content: center; align-items: center; padding: 0 0 20px; margin: 0 0 25px; }
    .test__question__answer { font-size: 17px; line-height: 26px; letter-spacing: 0.34px; height: unset; width: unset; }
    .test__question__answer1 { text-align: right; padding: 0 30px 0 20px; }
    .test__question__answer2 { display: none; }
    .test__question__answer3 { display: none; }
    .test__question__answer4 { display: none; }
    .test__question__answer5 { text-align: left; padding: 0 20px 0 30px; }

    .test__question__answer1::before { display: none; }
    .test__question__answer3::before { display: none; }
    .test__question__answer5::before { display: none; }


    .test__tab_content__headline__text { font-size: 17px; line-height: 26px; letter-spacing: 0.34px; margin: 0 0 30px; }
}

.dialog__cover {
    box-sizing: border-box;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,.6);
    z-index: 1100;
    overflow-x: hidden;
    overflow-y: auto;
}

.dialog__content {
    position: relative;
    background: #ffffff;
    box-shadow: 0 1px 15px rgba(0,0,0,.75);
    max-width: 910px;
    display: block;
    margin: 30px auto;
    padding: 37px 22px 50px;
}

/* Customize the label (the container) */
.radio_container {
  display: block;
  position: relative;
  cursor: pointer;
  width: 28px;
  height: 28px; 
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin: 0 auto;
}

/* Hide the browser's default radio button */
.radio_container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.radio_checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 26px;
  width: 26px;
  border: 1px solid #e6e6e6;
  border-radius: 50%;
  box-sizing: content-box;
}

/* On mouse-over, add a grey background color */
.radio_container:hover input ~ .radio_checkmark {
  background-color: #e6e6e6;
}

/* When the radio button is checked, add a blue background */
.radio_container input:checked ~ .radio_checkmark {
  background-color: #ffffff;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.radio_checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio_container input:checked ~ .radio_checkmark:after {
  display: block;
  background-color: #eb3739;
}
.radio_container input:checked ~ .radio_checkmark {
  border-color: #eb3739;
}

/* Style the indicator (dot/circle) */
.radio_container .radio_checkmark:after {
  top: 6px;
  left: 6px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
}


/* Test - konec */



.pc__formular__item { margin: 0 0 22px;  }
.pc__formular__item label { display: block; font-size: 18px; line-height: 22px; letter-spacing: 0.36px; font-weight: 800; margin-bottom: 12px; padding: 0; }
.pc__formular__item label > span { font-size: 16px; font-weight: 400; }
.pc__formular__item input[type=text], .pc__formular__item input[type=email] { display: block; box-sizing: border-box; width: 100%; border: 1px solid #e6e6e6; padding: 15px 20px; font-size: 16px; line-height: 19px; color: #1d1d1d; }
.pc__formular__item input[type=text]::placeholder, .pc__formular__item input[type=email]::placeholder { color: #cbcbcb; }
.pc__formular__item input[type=text]:focus, .pc__formular__item input[type=email]:focus { border-color: #1d1d1d; outline: 0; }
.pc__formular__item textarea { height: 190px; resize: none; display: block; box-sizing: border-box; width: 100%; border: 1px solid #e6e6e6; padding: 15px 20px; font-size: 16px; line-height: 19px; color: #1d1d1d; }
.pc__formular__item textarea::placeholder { color: #cbcbcb; }
.pc__formular__item textarea:focus { border-color: #1d1d1d; outline: 0; }
.pc__formular__item select:focus { border-color: #1d1d1d; outline: 0; }
.pc__formular__button { text-align: center; margin: 40px 0 0;}

.pc__formular__item select { outline: 0; width: 100%; padding: 15px 20px; font-size: 16px; line-height: 19px; letter-spacing: 0.36px; background: #ffffff; border: 1px solid #e6e6e6; color: #1d1d1d; border-radius: 0; z-index: 12; -moz-appearance:none; -webkit-appearance:none; appearance:none; margin: 0; }
.pc__formular__item select option { color: #1d1d1d; }

.pc__formular__item .select_arrow { position: absolute; right: 20px; top: 17px; width: 19px; height: 11.875px; z-index: 10; pointer-events: none; }
.pc__formular__item .select_arrow svg { width: 19px; height: 11.875px; fill: #e6e6e6; pointer-events: none; }

.pc__formular__item span { display: none; }
.pc__formular__checkbox { text-align: center; grid-column: 1 / 3; margin: 10px 0 -20px; }
.pc__formular__checkbox__inner { display: inline-block; text-align: center; margin: 0 auto;}
.pc__formular__checkbox__inner > span { display: none; }
.pc__formular__item label span { display: block; }

.pc__formular__checkbox  a { font-weight: 700; text-decoration: underline; color: #1d1d1d; transition: all 0.2s ease;  }
.pc__formular__checkbox  a:hover { color: #ffd502; }

.pc__formular__item.invalid span { display: block; margin-top: 5px; font-size: 14px; line-height: 17px; letter-spacing: 0.28px; }
.pc__formular__checkbox.invalid > div > span { display: block; margin-top: 5px; font-size: 14px; line-height: 17px; letter-spacing: 0.28px; color: #ff4343; }
.pc__formular__checkbox.invalid .checkmark { border-color: #ff4343; }
.pc__formular__item.invalid input[type=text], .pc__formular__item.invalid input[type=email] { border-color: #ff4343; }
.pc__formular__item.invalid select { border-color: #ff4343; }

.pc__formular__item.invalid { color: #ff4343; }

.pc__formular__validation_summary {}
.pc__formular__validation_summary span { display: block; font-weight: 700; font-size: 16px; line-height: 24px; margin: 20px 0 5px;}
.pc__formular__validation_summary div { font-size: 16px; line-height: 24px; color: #ff4343; }

@media screen and (min-width: 0) {
    .pc__nominace { margin: 0 0 220px; padding: 0 20px; }
    .pc__nominace__perex p { margin-bottom: 90px; }
    
    .pc__nominace__formular { padding: 62px 20px 52px; }
    .pc__nominace__formular__yes { right: 10px; top: -65px; }

    .pc__nominace__podekovani { grid-template-columns: 1fr; gap: 20px; padding: 30px 50px 20px; margin: 110px auto 0; }
    .pc__nominace__podekovani__image { text-align: center; }
    .pc__nominace__podekovani__text { text-align: center; }
}

@media screen and (min-width: 1260px) {
    .pc__nominace { margin: 0 0 352px; padding: 0; }
    .pc__nominace__perex p { margin-bottom: 66px; }

    .pc__nominace__formular { padding: 62px 93px 52px; }
    .pc__nominace__formular__yes { right: -55px; top: -45px; }

    .pc__nominace__podekovani { grid-template-columns: 110px 1fr; gap: 50px; padding: 50px 70px 40px; margin: 110px auto 0; }
    .pc__nominace__podekovani__image { text-align: unset; }
    .pc__nominace__podekovani__text { text-align: unset; }
}

.chb .outer {  display: block; position: relative; padding-left: 30px;  margin-bottom: 12px;  cursor: pointer;  font-size: 16px;  line-height: 19px;  color: #1d1d1d;  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none; }
.chb .outer input { position: absolute;  opacity: 0;  cursor: pointer;  height: 0;  width: 0;}
.checkmark {  box-sizing: border-box;  position: absolute;  top: 0;  left: 0;  height: 20px;  width: 20px;  background-color: #ffffff;  border: 1px solid #e6e6e6; }
.chb .outer:hover input ~ .checkmark {  border-color: #eb3739; }
.chb .outer input:checked ~ .checkmark {  background-color: #eb3739; }
.checkmark:after {  content: "";  position: absolute;  display: none; }
.chb .outer input:checked ~ .checkmark:after {  display: block; }
.chb .outer .checkmark:after { left: 6px; top: 2px; width: 4px;  height: 8px;  border: solid #ffffff;  border-width: 0 3px 3px 0;  -webkit-transform: rotate(45deg);  -ms-transform: rotate(45deg);  transform: rotate(45deg); }



/* sekce Výsledek testu - začátek */

.pc__vysledek { margin: 0 0 00px; }
/*.pc__vysledek__toolbox { box-shadow: 0px 0px 15px #0000001F;  }*/
.pc__vysledek__toolbox { margin: 0 -10px  }

.pc__vysledek__head { display: grid; }
.pc__vysledek__head__image { text-align: center; grid-area: image; }
.pc__vysledek__head__image > img { margin: 15px auto; max-width: 100%; max-height: 240px; }
.pc__vysledek__head__text { grid-area: text; }
.pc__vysledek__head__text h1 { font-weight: 800; color: #1d1d1d; padding: 0; margin: 7px 0 2px; font-size: 30px; line-height: 36px; text-transform: uppercase; letter-spacing: 0.6px; }
.pc__vysledek__head__text p { color: #c5c5c5; letter-spacing: 0.4px;}
.pc__vysledek__head__text p span { text-transform: uppercase; }
.pc__vysledek__head__text__populace { position: absolute; top: 0; right: 0; background: #f8f8f8; color: #1d1d1d; font-weight: 700; }
.pc__vysledek__head__letters { grid-area: letters; }
.pc__vysledek__head__letters p { font-size: 17px; line-height: 26px; color: #1d1d1d; margin: 0 0 2px; }
.pc__vysledek__head__letters p strong { font-weight: 700; color: #eb3739; }
.pc__vysledek__head__letters p b { font-weight: 700; }
.pc__vysledek__head__letters p.message { margin: 30px 0; color: #c5c5c5; }
.pc__vysledek__head__letters p.message b { color: #1d1d1d; }

.pc__vysledek__top_profese { margin: 0 -10px 20px; text-align: left; }
.pc__vysledek__top_profese__label { display: block; font-size: 20px; line-height: 26px; font-weight: 800; letter-spacing: 0.3px; color: #1d1d1d; margin: 0 0 18px; text-align: center  }
.pc__vysledek__top_profese__values { display: flex; flex-wrap: wrap; justify-content: center; margin: 0; }
.pc__vysledek__top_profese__values__item { display: inline-block; background: #f2f9ff; color: #1d1d1d; font-size: 17px; line-height: 26px; font-weight: 700; letter-spacing: 0.34px; padding: 10px 25px; margin: 0 10px 20px; }

.pc__vysledek__nabidky_prace { margin: 0 0 40px; text-align: center; }
.pc__vysledek__nabidky_prace a { }

.pc__vysledek__charakteristika { margin: 0 0 50px; border: 1px solid #e6e6e6; padding: 24px 30px; }
.pc__vysledek__charakteristika__label { color: #1d1d1d; font-size: 20px; line-height: 26px; letter-spacing: 0.4px; font-weight: 800; margin: 0 0 14px; }
.pc__vysledek__charakteristika ul { margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.pc__vysledek__charakteristika ul li { font-size: 17px; line-height: 30px; letter-spacing: 0.34px; font-weight: 700; padding: 0 0 0 5px; margin: 1px 0 1px 20px; box-sizing: border-box; overflow: visible; }
.pc__vysledek__charakteristika ul li:before { left: -12px; top: 11px; }

.pc__vysledek__buttons { background: #f8f8f8; }

.pc__vysledek__buttons__homepage.ghost_button { display: inline-flex; align-items: center; margin: 0; line-height: 23px; background: #f8f8f8; padding: 15px 66px 16px 20px; }
.pc__vysledek__buttons__homepage.ghost_button:hover { background: #eb3739; border-color: #eb3739; }
.pc__vysledek__buttons > div > a span { position: absolute; right: 20px; width: 28px; height: 17px; background: url(https://peniazesk.pencdn.cz/images/ico/arrow-left-thin.svg) no-repeat left top; }

/*
.pc__vysledek__buttons__detaily.ghost_button { display: inline-flex; align-items: center; margin: 0 20px 0 0; line-height: 23px; background: transparent; padding: 27px 54px 27px 20px; }
.pc__vysledek__buttons__detaily.b2.ghost_button { margin: 0 35px 0 0; }
.pc__vysledek__buttons__detaily.d2.ghost_button { padding: 27px 65px 27px 20px; }
a.pc__vysledek__buttons__detaily.d1 span {  right: 12px; transform: rotate(90deg); }
a.pc__vysledek__buttons__detaily.d2 span {  right: 12px; transform: rotate(-90deg); }
*/

.pc__vysledek__buttons__switch { display: flex; align-content: center; align-items: center; outline: 0; }
.pc__vysledek__buttons__switch a { display: inline-block; width: 140px; color: #1d1d1d; text-decoration: none; padding-left: 10px; font-size: 18px; line-height: 24px; letter-spacing: 0.36px; font-weight: 600; }

.pc__vysledek__buttons__switch::before { content: 'Výber zobrazenia'; font-size: 15px; line-height: 18px; letter-spacing: 0.3px; position: absolute; display: block; top: -29px; left: 0; }

.pc__vysledek__buttons__switch .switch { position: relative; display: inline-block; width: 75px;  height: 40px; }
.pc__vysledek__buttons__switch .switch input {  opacity: 0;  width: 0;  height: 0; outline: 0; }
.pc__vysledek__buttons__switch .slider { position: absolute;  cursor: pointer;  top: 0;  left: 0;  right: 0;  bottom: 0;  background-color: #e6e6e6;  -webkit-transition: .4s;  transition: .4s; }
.pc__vysledek__buttons__switch .slider:before {  position: absolute;  content: "";  height: 28px;  width: 28px;  left: 6px;  bottom: 6px;  background-color: white;  -webkit-transition: .4s;  transition: .4s;}
.pc__vysledek__buttons__switch input:checked + .slider {  background-color: #eb3739; }
.pc__vysledek__buttons__switch input:focus + .slider {   }
.pc__vysledek__buttons__switch input:checked + .slider:before {  -webkit-transform: translateX(36px);  -ms-transform: translateX(36px);  transform: translateX(36px); }
.pc__vysledek__buttons__switch .slider.round {  border-radius: 34px; }
.pc__vysledek__buttons__switch .slider.round:before {  border-radius: 50%; }

.pc__vysledek__buttons__shares { display: block; position: relative; grid-area: shares; }

.pc__vysledek__buttons__shares::before { content: 'Zdieľajte svoj výsledok'; font-size: 15px; line-height: 18px; letter-spacing: 0.3px; position: absolute; display: block; top: -29px; left: 0; }
.pc__vysledek__buttons__shares__grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px; background: #eb3739; padding: 21px 20px 18px; }
.pc__vysledek__buttons__shares__grid a { display: block; padding: 0; margin: 0; }
.pc__vysledek__buttons__shares__grid a img { display: block; padding: 0; margin: 0; transition: all 0.2s ease; }

.pc__vysledek__buttons__shares__grid a.btn-facebook:hover img { filter: invert(30%) sepia(96%) saturate(2157%) hue-rotate(203deg) brightness(101%) contrast(90%);  }
.pc__vysledek__buttons__shares__grid a.btn-linkedin:hover img { filter: invert(23%) sepia(98%) saturate(2526%) hue-rotate(183deg) brightness(92%) contrast(104%);  }
.pc__vysledek__buttons__shares__grid a.btn-twitter:hover img { filter: invert(52%) sepia(65%) saturate(2009%) hue-rotate(175deg) brightness(95%) contrast(99%);  }
.pc__vysledek__buttons__shares__grid a.btn-copy:hover img { filter: invert(98%) sepia(2%) saturate(0%) hue-rotate(204deg) brightness(103%) contrast(104%);  }

.pc__vysledek__letters { display: grid; }

.pc__vysledek__letters__item__bar { width: 100%; height: 20px; border: 1px solid #e6e6e6; margin: 0 0 30px; }
.pc__vysledek__letters__item__bar__progress { background: #eb3739; height: 100%; }
.pc__vysledek__letters__item__procenta { font-size: 30px; line-height: 30px; font-weight: 800; letter-spacing: 0.6px; margin: 0 0 17px; color: #eb3739; }
.pc__vysledek__letters__item__label { font-size: 17px; line-height: 26px; letter-spacing: 0.34px; font-weight: 800; color: #1d1d1d; margin: 0 0 13px; }
/*.pc__vysledek__letters__item__label strong { color: #ffd502; }*/
.pc__vysledek__letters__item ul { margin: 0; padding: 0; }
.pc__vysledek__letters__item.item_less .pc__vysledek__letters__item__procenta { color: #c5c5c5; }
.pc__vysledek__letters__item ul li { font-size: 15px; line-height: 25px; margin: 2px 0 2px 20px; padding: 0; overflow: visible; }
.pc__vysledek__letters__item ul li:before { left: -16px; top: 8px; }

a.pc__vysledek__tabs__item { color: #1d1d1d; font-weight: 800; border: 1px solid #c5c5c5; border-top-left-radius: 20px; border-top-right-radius: 20px; text-decoration: none; text-transform: uppercase; display: block; box-sizing: border-box; transition: all 0.2s ease; background: #f8f8f8; text-align: center; }
a.pc__vysledek__tabs__item.active { background: #ffffff; z-index: 10; }

.pc__vysledek__content { border: 1px solid #c5c5c5; z-index: 1; padding: 34px 32px 20px; margin: 0 0 60px; }
.pc__vysledek__content__placeholder { display: none; }
.pc__vysledek__content__placeholder.active { display: block; }

.pc__vysledek__content .tabProfese {  }
.pc__vysledek__content .tabVysledky {  }
.pc__vysledek__content .tabTypologie p { font-size: 16px; line-height: 25px; letter-spacing: 0.25px; margin: 0 0 30px; }
.pc__vysledek__content .tabTypologie > ul li, .pc__vysledek__content .tabTypologie > ol li { font-size: 16px; line-height: 25px; letter-spacing: 0.25px; margin: 0 0 15px; }
.pc__vysledek__content .tabTypologie > ul, .pc__vysledek__content .tabTypologie > ol { margin: 0 0 30px; }
.pc__vysledek__content .tabTypologie .pc__vysledek__charakteristika { border-color: #eb3739; }
.pc__vysledek__content .tabTypologie .pc__vysledek__charakteristika ul { display: block; }
.pc__vysledek__content .tabTypologie .pc__vysledek__charakteristika ul li { width: 100%; }

.pc__vysledek__profese { display: grid; }
.pc__vysledek__profese__item {  }
.pc__vysledek__profese__item h3 { font-size: 20px; line-height: 26px; letter-spacing: 0.4px; font-weight: 800; color: #eb3739; padding: 0; margin: 0 0 20px; }
.pc__vysledek__profese__item h4 { font-size: 17px; line-height: 26px; letter-spacing: 0.34px; font-weight: 800; color: #1d1d1d; padding: 0; margin: 0 0 13px; }
.pc__vysledek__profese__item ul { padding: 0; margin: 0 0 30px; }
.pc__vysledek__profese__item ul li { padding: 0 0 0 5px; margin: 2px 0 2px 20px; font-size: 15px; line-height: 25px; letter-spacing: 0.3px; color: #1d1d1d; overflow: visible; }
.pc__vysledek__profese__item ul li:before { left: -16px; top: 8px; }

.pc__vysledek_claim__content { text-align: center; padding: 20px 0 30px; }
.pc__vysledek_claim.first { border-bottom: 1px solid #c5c5c5; }
.pc__vysledek_claim.last { border-top: 1px solid #c5c5c5; }

@media screen and (min-width: 0) {
    .pc__vysledek__toolbox { padding: 32px 20px 54px;  }
    
    .pc__vysledek__head { grid-template-columns: 1fr; gap: 0; margin: 0 0 30px; grid-template-areas: "text" "image" "letters"; grid-template-rows: auto; }

    .pc__vysledek__head__text p { margin: 0 0 15px; }
    .pc__vysledek__head__text__populace { font-size: 16px; line-height: 28px; padding: 10px 10px; }
    .pc__vysledek__head__image { margin: 0 0 15px; }

    .pc__vysledek__buttons { margin: 0 -20px 50px; padding: 34px 20px 29px; display: flex; flex-direction: column-reverse; }
    .pc__vysledek__buttons__homepage { margin: 0 0 56px; }
    .pc__vysledek__buttons__shares { margin: 0 0 50px; }
    .pc__vysledek__buttons__switch { margin: 0 0 0px; }

    .pc__vysledek__letters { grid-template-columns: 1fr 1fr; gap: 45px 20px; margin: 0 0 20px; }

    .pc__vysledek__charakteristika ul li { width: 100%; }

    .pc__vysledek__tabs { display: block; margin: 0 0 -1px; z-index: 5; }
    a.pc__vysledek__tabs__item { min-width: 190px; font-weight: 800; padding: 0 25px; font-size: 17px; line-height: 45px; }

    .pc__vysledek__profese { grid-template-columns: 1fr; gap: 10px;  }
    .pc__vysledek__content .tabTypologie .pc__vysledek__charakteristika { display: block; margin: 0 0 30px; }
}

@media screen and (min-width: 1024px) {
    .pc__vysledek__toolbox { padding: 32px 34px 54px;  }

    .pc__vysledek__head { grid-template-columns: 320px 1fr; gap: 0 30px; margin: 0 0 30px; grid-template-areas: "image text" "image letters"; grid-template-rows: 100px 1fr; }

    .pc__vysledek__head__text p { margin: 0 0 30px; }
    .pc__vysledek__head__text__populace { font-size: 17px; line-height: 30px; padding: 13px 30px; }
    .pc__vysledek__head__image { aspect-ratio: 320 / 240; margin: 0; }

    .pc__vysledek__buttons { margin: 0 -34px 30px; padding: 46px 33px 29px; flex-direction: row; justify-content: center; justify-items: center; }
    .pc__vysledek__buttons__shares { margin: 0 20px 0 0; }
    .pc__vysledek__buttons__homepage { margin: 0; }
    .pc__vysledek__buttons__switch { margin: 0 20px 0 0;}

    .pc__vysledek__letters { grid-template-columns: 1fr 1fr 1fr 1fr; gap: 45px 20px; margin: 0 0 40px; }

    .pc__vysledek__charakteristika ul li { width: calc(50% - 20px); }

    .pc__vysledek__tabs { display: flex; margin: 0 0 -1px; }
    a.pc__vysledek__tabs__item { min-width: 190px; font-weight: 800; padding: 0 25px; font-size: 17px; line-height: 45px; }
    a.pc__vysledek__tabs__item { margin-right: 20px;}
    a.pc__vysledek__tabs__item.active { border-bottom-color: #ffffff; }

    .pc__vysledek__profese { grid-template-columns: 1fr 1fr; gap: 30px;  }
    .pc__vysledek__content .tabTypologie .pc__vysledek__charakteristika { display: inline-block; float: right; width: 400px; margin: 0 0 20px 20px; }

    .pc__vysledek_claim__content { padding: 20px 0; display: block; grid-template-columns: 1fr 160px; align-items: center; }
    .pc__vysledek_claim__content__label { display: inline-block; margin-right: 20px; }
    .pc__vysledek_claim__content__button { display: inline-block; }
}


/* sekce Výsledek testu - konec */


/* sekce Landing page - začátek */

.typologie_list { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 10px; margin: 20px 0 30px; }
a.typologie_list__item { text-align: center; text-decoration: none; }
a.typologie_list__item:hover {}
a.typologie_list__item .typologie_list__item__image { margin: 0 0 12px; }
a.typologie_list__item .typologie_list__item__image img { transition: all 0.2s ease; }
a.typologie_list__item:hover .typologie_list__item__image img { transform: scale(1.1); }
a.typologie_list__item .typologie_list__item__nazev { margin: 0 0 1px; font-size: 16px; }
a.typologie_list__item:hover .typologie_list__item__nazev { color: #eb3739; }
a.typologie_list__item .typologie_list__item__kod {}

@media screen and (min-width: 600px) {
    .typologie_list { grid-template-columns: 1fr 1fr 1fr 1fr; }
}

/* sekce Landing page - konec */


/* sekce Error page - začátek */

@media screen and (min-width: 0) {
    .ep__content { text-align: center; margin: 100px auto 60px;}
}

@media screen and (min-width: 1024px) {
    .ep__content { text-align: center; margin: 0 auto 90px;}
    .ep__content h2 { font-size: 28px; line-height: 35px; font-weight: 800;  }
    .ep__content p { font-size: 18px; line-height: 27px; margin-bottom: 50px;  }
}

/* sekce Error page - konec */
