/*
 * Copyright PRO TV S.A. All rights reserved.
 * Contact: @protv.ro
 */

@import url("reset.css");
@import url("bootstrap.min.css");
/*
   * GLOBAL STYLES
   */
:root {
    --main-font-size: 18px;
    --block-margin: 20px;
    --block-padding: 40px;
    --heading-one-size: 2.5em;
    --heading-two-size: 1.75em;
    --heading-three-size: 1.25em;
    --heading-color: #fff;
    --heading-letter-spacing: normal;
    --heading-text-transform: uppercase;
    /* Colors: */
    --white: #ffffff;
    --black: #000000;
    --new-mauve: #3e044b;
    --color-60rule: #472252;
    --color-30rule: #606060;
    --color-10rule: #f26b3d;
    --link-color: #42affa;
    --link-color-dark: #068de9;
    --link-color-hover: #8dcffc;
    /* Font Styles */
    --font-style-normal: normal;
    --font-weight-normal: 300;
    --font-weight-bold: 500;
    --font-weight-bolder: 700;
}

body::-webkit-scrollbar {
    width: 18px;
}

body::-webkit-scrollbar-track {
    background: var(--color-60rule);
}

body::-webkit-scrollbar-thumb {
    background-color: var(--color-10rule);
    border-radius: 6px;
    border: 3px solid var(--color-60rule);
}

/*
   * GENERAL
   */

*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    transition: all 1s ease-in;
}

*:focus {
    outline: none !important;
    transition: all 1s ease-in;
}
html,
body {
    height: 100%;
    width: 100%;
}
body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #d7d8da;
    background-image: linear-gradient(top, #d7d8da, #b1b3b6);
    background-image: -moz-linear-gradient(top, #d7d8da, #b1b3b6);
    background-image: -webkit-linear-gradient(top, #d7d8da, #b1b3b6);
    font-family: "Roboto", sans-serif;
    font-size: var(--main-font-size);
    font-style: var(--font-style-normal);
    font-weight: var(--font-weight-normal);
    color: var(--selection-color);
    line-height: 1.45;
}

a {
    color: var(--color-10rule);
}
a:hover,
a:focus {
    color: var(--color-30rule);
}

.dark-bg {
    background-color: var(--color-60rule);
}

.light-bg {
    background-color: var(--color-30rule);
}

.nav-item {
    padding: 0 var(--block-margin);
}

.nav-item a {
    font-family: var(--main-font);
    font-style: var(--font-style-normal);
    font-weight: var(--font-weight-normal);
    text-transform: var(--heading-text-transform);
    font-size: var(--main-font-size);
    letter-spacing: var(--heading-letter-spacing);
    color: var(--color-60rule);
}
.navbar-brand svg {
    max-width: 200px;
    height: auto;
}

.navbar-toggler .spantext {
    display: flex;
}

.burger {
    width: 20px;
    height: 14px;
    position: relative;
    margin: 0px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    cursor: pointer;
}

.burger span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    border-radius: 6px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.25s ease-in-out;
    -moz-transition: 0.25s ease-in-out;
    -o-transition: 0.25s ease-in-out;
    transition: 0.25s ease-in-out;
}

.navbar-toggler[aria-expanded="false"] .burger span {
    background: var(--color-10rule);
}

.burger span {
    background: var(--color-30rule);
}

.navbar-toggler[aria-expanded="false"] .burger span:nth-child(1) {
    top: 0px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

.navbar-toggler[aria-expanded="false"] .burger span:nth-child(2) {
    top: 5px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

.navbar-toggler[aria-expanded="false"] .burger span:nth-child(3) {
    top: 10px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

.navbar-toggler[aria-expanded="true"] .burger span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 5px;
    left: 2px;
}

.navbar-toggler[aria-expanded="true"] .burger span:nth-child(2) {
    width: 0%;
    opacity: 0;
}

.navbar-toggler[aria-expanded="true"] .burger span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 5px;
    left: 2px;
}

/*
    * HERO
*/
.hero {
    background-color: var(--new-mauve);
}

.hero .card {
    background: transparent;
    border: 0;
    outline: unset;
    max-width: 223px;
}
.hero .card-header {
    padding: 0;
}
.hero .card-header img {
    width: 100%;
    object-fit: cover;
    object-position: center;
}
.hero .card-body {
    background: linear-gradient(90deg, #370244 0%, #520961 100%);
}
.hero .h3 {
    font-size: 18px;
    line-height: 1.5;
    font-weight: bold;
    color: var(--color-10rule);
    text-align: center;
}
.hero .h3 span {
    color: var(--white);
}

.hero .card-text {
    text-align: center;
    color: var(--white);
    position: relative;
    margin: 0 auto;
}
.hero .card-text p {
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
    color: var(--white);
}
.hero .btn {
    position: absolute;
    left: 50%;
    bottom: -20px;
    transform: translateX(-50%);
    display: block;
    padding-inline: 25px;
    margin: auto;
    text-align: center;
    font-size: 15px;
    text-transform: var(--heading-text-transform);
    background-color: var(--color-10rule);
    border-radius: 24px;
    letter-spacing: 1px;
}
.hero .btn a {
    display: block;
    height: auto;
    width: 100%;
    color: var(--new-mauve);
    white-space: nowrap;
    text-decoration: none;
}

/*
   * HEADINGS
   */
.heading-one {
    font-family: var(--main-font);
    font-style: var(--font-style-normal);
    font-weight: var(--font-weight-bold);
    font-size: var(--heading-one-size);
    letter-spacing: var(--heading-letter-spacing);
    color: var(--white);
    padding-bottom: 1em;
    padding-top: 2vh;
}
.heading-one span {
    font-weight: bold;
    color: var(--color-10rule);
    text-transform: var(--heading-text-transform);
}

.heading-two {
    font-family: var(--main-font);
    font-style: var(--font-style-normal);
    font-weight: var(--font-weight-bold);
    font-size: var(--heading-one-size);
    letter-spacing: var(--heading-letter-spacing);
    color: var(--color-60rule);
    padding-bottom: 1em;
    padding-top: 2vh;
}
.heading-two span {
    font-weight: bold;
}
.heading-three {
    font-family: var(--main-font);
    font-style: var(--font-style-normal);
    font-weight: var(--font-weight-bold);
    font-size: var(--heading-three-size);
    letter-spacing: var(--heading-letter-spacing);
    color: var(--white);
    padding-bottom: 1em;
    padding-top: 1vh;
}
.heading-three span {
    font-weight: bold;
}
.heading-three strong {
    color: var(--color-10rule);
}

.heading-winner {
    font-family: var(--main-font);
    font-style: var(--font-style-normal);
    font-weight: var(--font-weight-normal);
    font-size: var(--main-font-size);
    letter-spacing: var(--heading-letter-spacing);
    color: var(--color-60rule);
}
.info-stuff {
    max-width: 500px;
    text-align: left;
    padding-top: 10px;
    padding-bottom: 0;
    margin: 10px auto;
}
.info-stuff hr {
    display: block;
    margin: 10px auto;
    width: 100%;
    border-style: solid;
    border-width: 2px;
    border-color: var(--color-60rule);
    max-width: 300px;
    border-radius: 2px;
}
.info-campanie {
    text-align: left;
    font-size: 14px;
    color: var(--color-30rule);
    font-weight: var(--font-weight-normal);
    margin-bottom: 0;
}
/*
   * FORM SECTION
   */

/*
   * RADIO INPUTS
   */
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

/*
   *RADIO INPUT
  */

.checkbox-radio {
    width: 24px;
    height: 24px;
    background-color: var(--white);
    border-radius: 50%;
    vertical-align: middle;
    border: 1px solid var(--color-10rule);
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    cursor: pointer;
    margin: -2px 10px 0;
}

.checkbox-radio:checked {
    background-color: var(--color-60rule);
}

.custom-control-description {
    font-size: 18px;
    color: var(--color-60rule);
    font-weight: var(--font-weight-normal);
}

.custom-control-description a {
    color: var(--color-10rule);
}

/*
 * CHECKBOX INPUT
 */
.checkbox-round {
    width: 20px;
    height: 20px;
    background-color: var(--white);
    border-radius: 0;
    vertical-align: middle;
    border: 1px solid var(--color-30rule);
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    cursor: pointer;
    margin: -2px 10px 0;
}

.checkbox-round:checked {
    background-color: var(--color-30rule);
}

.custom-control-description {
    font-size: 14px;
    color: var(--color-30rule);
    font-weight: var(--font-weight-normal);
}

.custom-control-description a {
    color: var(--color-10rule);
}
.row-checkbox {
    padding-top: 20px;
}
.row-checkbox-check {
    padding-top: 0;
    margin-top: 10px;
    margin-bottom: var(--block-margin);
}
.row-checkbox-check label {
    margin-bottom: 3px;
}
#ssoform {
    margin: 0 auto;
}
#results {
    color: var(--color-60rule);
}

#text-errors {
    color: var(--color-10rule);
    padding: var(--block-margin) 0 0;
    font-size: 30px;
    padding: 20px 0;
}

.visuallyhidden {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}

#ssoform input[type="text"],
#ssoform input[type="tel"],
#ssoform input[type="email"] {
    width: 100%;
    padding: 12px 10px;
}
input:not(:placeholder-shown) {
    border-color: var(--color-60rule);
}

.input-effect {
    position: relative;
    width: 100%;
    margin: 20px 0 0;
}

.effect-placeholder {
    color: var(--color-30rule);
    padding: 12px 0;
    background-color: var(--white);
    border: 1px solid var(--color-60rule);
    border-radius: 28px;
}
.effect-placeholder ~ label {
    position: absolute;
    left: 30px;
    width: 100%;
    top: 12px;
    color: var(--color-30rule);
    transition: 0.3s;
    z-index: 1;
    letter-spacing: 0.2px;
}

input:focus {
    outline: 0;
}

.effect-placeholder:focus ~ label,
.has-content.effect-placeholder ~ label,
input:not(:empty).effect-placeholder ~ label {
    top: -20px;
    left: 30px;
    font-size: 12px;
    color: var(--color-10rule);
    transition: 0.3s;
}

label {
    display: block;
    margin-bottom: var(--block-margin);
}

#slide-quizzing label {
    cursor: pointer;
    display: block;
    margin-bottom: var(--block-margin);
    border: 1px solid var(--color-60rule);
    background: var(--white);
    border-radius: 28px;
    padding: 8px;
}
#slide-quizzing label:focus,
#slide-quizzing label:hover {
    background: #d7d8da;
}
#slide-quizzing .custom-control-description {
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    color: var(--color-60rule);
}

.submitButton {
    border: 0;
    background: transparent;
    background-image: url("../img/btn_bg.svg");
    text-align: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    font-size: 20px;
    color: var(--white);
    padding: 30px 80px;
    border-radius: 0;

    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    cursor: pointer;
}
.submitButton:focus,
.submitButton:hover {
    color: var(--white);
    transform: scale(1.1);
}

.info {
    padding: var(--block-padding) 0 var(--block-padding);
    color: var(--color-30rule);
    font-size: 12px;
}
.row-checkbox .col-12 {
    max-width: 1000px;
    margin: 0 auto;
}

/*
 * SECTIONS
 */

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

.container {
    max-width: 1200px;
}

section {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
}

.castigatori {
    margin: 0;
    padding: var(--block-padding) 0;
    height: auto;
    min-height: 30vh;
    background-color: var(--color-60rule);
}

.form-section {
    display: block;
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
}

.section__contain_iframe {
    max-width: 50vw;
    width: 100%;
    display: block;
}
.iframe-container {
    width: 100%;
    margin: 0;
    display: block;
    overflow: hidden;
    padding-top: 56.25%;
    position: relative;
}

.iframe-container iframe {
    position: absolute;
    border: 0;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.display-mobile {
    display: none;
}

.display-desktop {
    display: flex;
}

/*
 * MODAL
 */
.modal {
    padding: 0 !important;
    margin: 0;
}
.modal-open {
    padding: 0 !important;
    margin: 0 !important;
}
.modal-dialog {
    max-width: 500px;
    top: 50%;
    left: 0;
    position: relative;
    width: auto;
    pointer-events: none;
    transform: translate(0%, -50%) !important;
}
.modal-header {
    border-bottom: 0px;
}

@media (max-width: 768px) {
    :root {
        --main-font-size: 16px;
        --block-margin: 10px;
        --block-padding: 15px;
        --heading-one-size: 1.75em;
        --heading-two-size: 1.35em;
        --heading-three-size: 1em;
        --heading-color: #fff;
    }
    .display-mobile {
        display: flex;
    }
    .display-desktop {
        display: none;
    }
    .hero .card-text {
        display: none;
    }
    .hero .col {
        min-width: 223px;
    }
    .hero .btn {
        font-size: 12px;
    }
    .navbar-brand svg {
        max-width: 150px;
    }

    .section__contain_iframe {
        max-width: 100%;
        overflow: hidden;
    }
    .row-checkbox-check label {
        margin-bottom: var(--block-margin);
    }
}

#tapad_url {
    display: none;
    height: 0;
}
/*
 *  SVG classes
 */
.svghere {
    width: 100%;
    height: auto;
    max-width: 220px;
}
.cls-1 {
    fill: none;
}
.cls-3 {
    fill: #f56d3e;
}
.cls-4 {
    fill: #fa7f3f;
}
.cls-5 {
    fill: #fa7d3e;
}
.cls-6 {
    fill: #f8733d;
}
.cls-7 {
    fill: #f8753d;
}
.cls-8 {
    fill: #f8723d;
}
.cls-9 {
    fill: #f8743d;
}
.cls-10 {
    fill: #f8713c;
}
.cls-11 {
    fill: #f9773d;
}
.cls-12 {
    fill: #f9783e;
}
.cls-13 {
    fill: #f97a3e;
}
.cls-14 {
    fill: #f9763d;
}
.cls-15 {
    fill: #f9793e;
}
.cls-16 {
    fill: #f46c3f;
}
.cls-17 {
    fill: #fb803f;
}
.cls-18 {
    fill: #fb813f;
}
.cls-19 {
    fill: #fb853f;
}
.cls-20 {
    fill: #fb843f;
}
.cls-21 {
    fill: #fb833f;
}
.cls-22 {
    fill: #fa7c3e;
}
.cls-23 {
    fill: #fa7b3e;
}
.cls-24 {
    fill: #fa7e3e;
}
.cls-25 {
    fill: #ed6746;
}
.cls-26 {
    fill: #f26b41;
}
.cls-27 {
    fill: #f26b3d;
}
.cls-28 {
    fill: #ec6747;
}
.cls-29 {
    fill: #eb6648;
}
.cls-30 {
    fill: #f66d3d;
}
.cls-31 {
    fill: #f76e3c;
}
.cls-32 {
    fill: #f76f3c;
}
.cls-33 {
    fill: #f7703c;
}
.cls-34 {
    fill: #fc8940;
}
.cls-37 {
    fill: #e96549;
}
.cls-38 {
    fill: #e8644a;
}
.cls-39 {
    fill: #e5624d;
}
.cls-40 {
    fill: #ef6944;
}
.cls-41 {
    fill: #fff;
}
.cls-42 {
    fill: #ea6549;
}
.cls-43 {
    fill: #f36b40;
}
.cls-44 {
    fill: #ee6845;
}
.cls-47 {
    fill: #fd8b40;
}
.cls-49 {
    fill: #fd8c40;
}
.cls-50 {
    fill: #e7634b;
}
.cls-54 {
    fill: #e4614e;
}
.cls-55 {
    fill: #f16a42;
}
.cls-56 {
    fill: #f06943;
}
.cls-57 {
    fill: #e6634c;
}
.cls-60 {
    fill: #ff9742;
}
.cls-61 {
    fill: #fc8840;
}
.cls-62 {
    fill: #fc8740;
}
.cls-63 {
    fill: #fc863f;
}
.cls-64 {
    fill: #fc8a40;
}
.cls-65 {
    fill: #932c9b;
}
.cls-69 {
    fill: #9a3194;
}
.cls-70 {
    fill: #982f96;
}
.cls-71 {
    fill: #9b3194;
}
.cls-72 {
    fill: #993095;
}
.cls-75 {
    fill: #a2368d;
}
.cls-76 {
    fill: #942d9a;
}
.cls-77 {
    fill: #a1358e;
}
.cls-79 {
    fill: #a0358f;
}
.cls-83 {
    fill: #952d99;
}
.cls-84 {
    fill: #c44c6d;
}
.cls-85 {
    fill: #b6437a;
}
.cls-86 {
    fill: #b74479;
}
.cls-87 {
    fill: #ba4676;
}
.cls-88 {
    fill: #9f3490;
}
.cls-89 {
    fill: #9e3391;
}
.cls-90 {
    fill: #8d28a1;
}
.cls-91 {
    fill: #9d3392;
}
.cls-92 {
    fill: #8e29a0;
}
.cls-93 {
    fill: #912b9d;
}
.cls-94 {
    fill: #b5437b;
}
.cls-95 {
    fill: #922b9c;
}
.cls-96 {
    fill: #c34b6e;
}
.cls-97 {
    fill: #b84578;
}
.cls-98 {
    fill: #bc4774;
}
.cls-99 {
    fill: #8f299f;
}
.cls-100 {
    fill: #bb4775;
}
.cls-101 {
    fill: #902a9e;
}
.cls-102 {
    fill: #b94577;
}
.cls-103 {
    fill: #d05462;
}
.cls-104 {
    fill: #cf5362;
}
.cls-105 {
    fill: #ad3d82;
}
.cls-106 {
    fill: #af3f80;
}
.cls-107 {
    fill: #a93b86;
}
.cls-108 {
    fill: #aa3b85;
}
.cls-109 {
    fill: #a73988;
}
.cls-110 {
    fill: #c14b6f;
}
.cls-111 {
    fill: #b3417c;
}
.cls-112 {
    fill: #ab3c84;
}
.cls-113 {
    fill: #be4972;
}
.cls-114 {
    fill: #b03f7f;
}
.cls-115 {
    fill: #b1407e;
}
.cls-116 {
    fill: #b2417d;
}
.cls-117 {
    fill: #da5b58;
}
.cls-118 {
    fill: #a63989;
}
.cls-119 {
    fill: #b4427b;
}
.cls-120 {
    fill: #bd4873;
}
.cls-121 {
    fill: #c04a70;
}
.cls-122 {
    fill: #a5388a;
}
.cls-123 {
    fill: #a83a87;
}
.cls-124 {
    fill: #bf4971;
}
.cls-125 {
    fill: #ac3d83;
}
.cls-126 {
    fill: #ce5363;
}
.cls-127 {
    fill: #cc5165;
}
.cls-128 {
    fill: #cb5166;
}
.cls-129 {
    fill: #d15561;
}
.cls-130 {
    fill: #c94f68;
}
.cls-131 {
    fill: #e05f52;
}
.cls-132 {
    fill: #df5e53;
}
.cls-133 {
    fill: #cd5264;
}
.cls-134 {
    fill: #d4575e;
}
.cls-135 {
    fill: #d3565f;
}
.cls-136 {
    fill: #c54d6c;
}
.cls-137 {
    fill: #c84f69;
}
.cls-138 {
    fill: #c64d6b;
}
.cls-139 {
    fill: #c74e6a;
}
.cls-140 {
    fill: #d25560;
}
.cls-141 {
    fill: #ae3e81;
}
.cls-142 {
    fill: #de5d54;
}
.cls-143 {
    fill: #dd5d55;
}
.cls-144 {
    fill: #d6585c;
}
.cls-145 {
    fill: #dc5c56;
}
.cls-146 {
    fill: #db5b57;
}
.cls-147 {
    fill: #e26050;
}
.cls-148 {
    fill: #d95a59;
}
.cls-149 {
    fill: #d5575d;
}
.cls-150 {
    fill: #e3614f;
}
.cls-151 {
    fill: #ca5067;
}
.cls-152 {
    fill: #e15f51;
}
.cls-153 {
    fill: #d8595a;
}
.cls-154 {
    fill: #d7595b;
}
.cls-159 {
    fill: #370244;
}
.cls-166 {
    fill: #962e98;
}
.cls-167 {
    fill: #a4378b;
}
.cls-168 {
    fill: #a3378c;
}
.cls-169 {
    fill: #972f97;
}
.cls-173 {
    fill: #9c3293;
}